.setup-connect{text-align:center;margin-top:22px}.setup-connect .button{font-size:12px}
.sync-preference{display:flex;align-items:center;gap:16px;border:1px solid var(--line);border-radius:13px;padding:15px 17px;margin:16px 0;background:var(--surface-2)}.sync-preference>span{flex:1;min-width:0}.sync-preference strong{display:block;font-size:13px;font-weight:600}.sync-preference small{display:block;color:var(--muted);font-size:11px;line-height:1.7;margin-top:5px}.sync-preference input{width:22px;height:22px;flex-shrink:0;accent-color:var(--purple)}.quiet-text.sync-warning{color:var(--peach);font-weight:550}
.connection-methods{display:grid;gap:12px;margin-bottom:20px}.connection-method{display:flex;align-items:center;gap:15px;text-align:left;width:100%;padding:20px;border:1px solid var(--line);border-radius:15px;background:var(--surface-2)}.connection-method:hover{background:var(--purple-bg);border-color:var(--purple)}.connection-method>svg{width:25px;height:25px;color:var(--purple);flex-shrink:0}.connection-method>svg:last-child{width:18px;height:18px;margin-left:auto}.connection-method strong{display:block;font-size:14px;font-weight:650}.connection-method small{display:block;color:var(--muted);font-size:12px;line-height:1.7;margin-top:5px}.educonnect-site{display:flex;align-items:center;gap:12px;padding:17px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}.educonnect-site strong{display:block;font-size:15px}.educonnect-site small{display:block;color:var(--muted);font-size:11px;margin-top:5px;overflow-wrap:anywhere}.educonnect-site .pronote-logo{background:var(--purple-bg);color:var(--purple)}.educonnect-link{width:100%;justify-content:center;flex-wrap:wrap;text-decoration:none;margin:8px 0 14px}.external-hint{font-size:10px;opacity:.8}@media(max-width:480px){.connection-method{padding:16px 13px;gap:11px}.connection-method strong{font-size:13px}.connection-method small{font-size:11px}.educonnect-link{font-size:12px}}
.pronote-heading{display:flex;align-items:center;gap:12px;margin-bottom:18px}.pronote-heading h3{margin-bottom:2px}.pronote-heading p{margin:0!important;font-size:11px}.pronote-logo{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--mint-soft);color:#4d8e6c;font-size:24px;font-weight:750;flex-shrink:0}.connection-badge{margin-left:auto;font-size:10px;white-space:nowrap;background:var(--surface-2);border-radius:20px;padding:6px 10px;color:var(--muted)}.connection-badge.connected{background:var(--mint-soft);color:#498569}
.pronote-account{padding:17px 19px;background:var(--surface-2);border:1px solid var(--line);border-radius:14px;margin:0 0 17px}.pronote-account strong{display:block;font-weight:650;overflow-wrap:anywhere}.pronote-account small{display:block;color:var(--muted);font-size:11px;margin-top:5px;overflow-wrap:anywhere}.pronote-account.preview{padding:22px;background:var(--purple-bg)}.pronote-account.preview strong{font-size:21px}
.connection-steps{display:flex;gap:8px;margin-bottom:25px}.connection-steps>span{flex:1;text-align:center;font-size:10px;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);padding:9px 5px;border-radius:10px}.connection-steps>.active{background:var(--purple-bg);border-color:var(--purple-bg);color:var(--purple);font-weight:650}
.pronote-guide h3{font-size:14px}.pronote-guide ol{padding-left:20px;margin:12px 0;font-size:12px;line-height:1.8}.pronote-guide li+li{margin-top:6px}.pronote-guide p{font-size:12px;color:var(--muted);line-height:1.8}.qr-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:22px 0}.qr-choice-button{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;border:1px solid var(--line);border-radius:15px;padding:20px;background:var(--surface-2);min-height:133px}.qr-choice-button:hover{background:var(--purple-bg);border-color:var(--purple)}.qr-choice-button>svg{color:var(--purple);width:25px;height:25px;margin-bottom:3px}.qr-choice-button strong{font-size:13px;font-weight:600}.qr-choice-button span{font-size:11px;color:var(--muted)}
.qr-ready{display:flex;align-items:center;gap:10px;padding:13px 16px;border-radius:12px;background:var(--mint-soft);font-size:12px;margin-bottom:24px}.qr-ready svg{width:20px;height:20px;color:#498569;flex-shrink:0}form[data-form="pronote-connect"] input[name="pin"]{font-size:25px;letter-spacing:10px;padding:14px 17px}.pronote-status{font-size:12px;line-height:1.8;color:var(--purple);margin-top:12px}.qr-camera{position:relative;aspect-ratio:1;max-height:400px;overflow:hidden;border-radius:18px;background:#222;margin-bottom:18px}.qr-camera video{display:block;width:100%;height:100%;object-fit:cover}.qr-camera-frame{position:absolute;inset:15%;border:3px solid #d5c4ff;border-radius:20px;box-shadow:0 0 0 120px #0005;pointer-events:none}
.connection-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0}.connection-counts>span{background:var(--surface-2);border:1px solid var(--line);border-radius:13px;padding:15px 9px;text-align:center;color:var(--muted);font-size:12px}.connection-counts strong{display:block;font-size:26px;font-weight:600;color:var(--purple);line-height:1.3}.connection-notes{margin-top:15px;padding:14px 17px;background:var(--yellow-soft);border-radius:12px;font-size:11px;line-height:1.8}.connection-notes p+p{margin-top:8px}.pronote-section .quiet-text{margin-top:16px}.pronote-section .backup-actions{flex-wrap:wrap}
@media(max-width:480px){.pronote-heading{gap:9px;flex-wrap:wrap}.connection-badge{padding:5px 8px;font-size:9px}.qr-choice-button{padding:16px 13px}.qr-choice-button strong{font-size:12px}.connection-steps>span{font-size:9px}.pronote-account.preview strong{font-size:19px}.pronote-section .backup-actions .button{font-size:10px;padding:10px 11px}}

.remote-range{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:14px 17px;background:var(--mint-soft);border-radius:13px;margin-bottom:20px}.remote-range p{font-size:11px;line-height:1.8}.remote-range .button{font-size:11px;flex-shrink:0;padding:9px 12px}@media(max-width:480px){.remote-range{align-items:flex-start;gap:10px;padding:12px}.remote-range p{font-size:10px}.remote-range .button{font-size:10px;padding:8px;gap:4px}}

.pronote-import-section{min-width:0;border:1px solid var(--line);border-radius:15px;padding:17px;margin:20px 0;background:var(--surface-2)}.pronote-import-section legend{display:inline-flex;align-items:center;gap:8px;padding:0 7px;font-size:14px;font-weight:650}.pronote-import-section legend svg{width:19px;height:19px;color:var(--purple)}.import-counts{display:flex;flex-wrap:wrap;justify-content:space-between;gap:7px;font-size:12px;color:var(--muted)}.import-counts strong{color:var(--text)}.pronote-import-section .quiet-text{font-size:11px;margin:10px 0}.import-choice{margin:16px 0 0}.import-choice>span{line-height:1.6}.import-choice select{width:100%;font-size:12px}.import-preview{margin-top:13px;font-size:11px;color:var(--muted);line-height:1.7}.import-preview summary{cursor:pointer;color:var(--purple);padding:4px 0}.import-preview ul{padding-left:18px;margin-top:9px}.import-preview li{overflow-wrap:anywhere}.import-preview li+li{margin-top:7px}.import-preview p{margin-top:6px}.import-empty,.import-unavailable{padding:10px 12px;background:var(--yellow-soft);border-radius:9px;font-size:11px;line-height:1.7;margin-top:12px}.import-unavailable{background:var(--purple-bg)}@media(max-width:480px){.pronote-import-section{padding:14px 12px}.import-choice select{font-size:11px}.import-counts{font-size:11px}}