/* A quiet desk: the text is the task, and real paper is the result. */
:root{--action:#4059c6}
body{font-size:1rem}.primary:hover{background:#354bb5}.print-actions .primary:hover{background:#354bb5}
.skip-link{position:absolute;left:12px;top:8px;z-index:80;transform:translateY(-180%);padding:12px 18px;border-radius:8px;background:#eef1f8;color:#10141e;font-weight:600}
.skip-link:focus{transform:none}
main{padding-top:22px}header{height:auto;min-height:70px;padding-top:10px;padding-bottom:10px;gap:18px}
.topnav{gap:18px;flex-wrap:wrap}.topnav .text-button,.topnav a{font-size:.875rem;min-height:44px}
.app-modes{margin-bottom:6px}.mode-help{font-size:.875rem;color:var(--muted);margin:0 0 20px}
.intro{max-width:1300px;margin-bottom:16px}.intro h1{font-size:clamp(1.5rem,2.5vw,2rem);line-height:1.25}.intro>div>p:last-child{font-size:1rem;max-width:760px;margin-top:8px}
.journey{max-width:1300px;padding:4px;margin-bottom:18px}.journey button{padding:10px 16px}.journey strong{font-size:1rem}.journey small{font-size:.875rem}.journey .step-number{width:26px;height:26px}
body[data-stage="2"] .workspace{display:grid;grid-template-columns:minmax(350px,440px) minmax(0,1fr);max-width:1300px;align-items:start}
body[data-stage="2"] .controls{padding:24px;border-right:1px solid var(--border)}
body[data-stage="2"] .preview{padding:24px;min-height:600px;position:sticky;top:12px}
body[data-stage="1"] .workspace{max-width:1300px}body[data-stage="1"] .controls{padding:28px}
body[data-stage="3"] .workspace{max-width:1040px}
#writePanel textarea{min-height:190px;font-size:1rem;line-height:1.6}
.section-title h2,.editor-group h2{font-size:1.125rem}.section-title span{font-size:.875rem}
.editor-next{display:flex;gap:16px;align-items:center;justify-content:space-between;margin-top:12px}.editor-next .primary{width:auto;min-width:170px}.editor-next .text-button{flex:none}
#writePanel>#previewPermission{font-size:.875rem;margin:10px 0 20px}
.editor-group{border-top:1px solid var(--border);padding:20px 0 0;margin-top:18px}.editor-group .page-choice{margin:0 0 14px}.editor-group .page-choice h2{margin-bottom:12px}
.paper-size-label{display:flex;gap:18px;align-items:center;font-size:.875rem}.paper-size-label select{margin:0;max-width:230px}
.page-style-buttons button{min-height:58px;font-size:.9375rem;padding:10px 14px}.page-style-buttons button span{font-size:.875rem}
.editor-group .style-controls{margin-top:10px}.editor-group .style-controls label{font-size:.875rem;flex:1;min-width:0}.editor-group .style-controls select{margin-top:6px}
#writePanel .profile-info{margin:10px 0 0;padding:12px 0;border-bottom:0}.profile-info p,.profile-info strong{font-size:.875rem}
#accountStatus{margin:8px 0;font-size:.875rem}
.getting-started{display:flex;padding:14px;margin:12px 0 18px;gap:14px;background:#202b40;border-color:#526485;align-items:flex-start}
.getting-started strong{font-size:.875rem}.getting-started p{font-size:.875rem;color:var(--muted);line-height:1.55;margin-top:4px}
.getting-started #stepSample{background:none;color:var(--blue);border:1px solid #667895;border-radius:8px;min-height:44px;padding:10px 12px;min-width:132px;flex:none;text-align:left}
#stepSample strong{display:block}#stepSample small{display:block;font-size:.8125rem;color:var(--muted);max-width:155px}
.note-editor{margin-top:18px}#savePermission{margin-top:12px}
body[data-stage="2"] .preview .page-choice,body[data-stage="2"] .preview-navigation{display:none}
.preview-empty{display:grid;align-content:center;min-height:280px;padding:30px;border:1px dashed #667895;border-radius:12px;background:#1a2437;color:var(--text);text-align:center}
.preview-empty strong{font-size:1.125rem}.preview-empty p{font-size:.9375rem;color:var(--muted);max-width:320px;margin:12px auto}
.preview .demo-badge{margin:14px auto;font-size:.875rem}.preview #previewWritingType{margin:12px 0;color:#c2d0ef}
.preview .print-actions{margin:16px 0}.print-actions p,.preview #outputAllowance{font-size:.875rem;margin:12px 0}.print-actions .privacy-link{margin-top:8px}
body[data-stage="2"] #pages{margin-top:16px}body[data-stage="2"] #pages .page-sheet:not(:first-child){content-visibility:auto}
.primary,.secondary{font-size:.9375rem;min-height:44px}.text-button{min-height:44px;min-width:44px;font-size:.875rem}
.small,.muted,.settings-grid label,.join-option,.style-label,.slider-label,.ink-row{font-size:.875rem}.small,.muted{line-height:1.65}
summary{min-height:44px;align-content:center}summary:focus-visible{outline:3px solid #c1d1ff;outline-offset:4px;border-radius:5px}
input:not([type=range]):not([type=checkbox]):not([type=file]),textarea,select{border-color:#667895;font-size:1rem}
input[type=range]{min-height:32px}.swatches{gap:10px}.swatches button{width:44px;height:44px;border:10px solid var(--raised);flex:none}.swatches button:focus-visible{outline:3px solid #dbe5ff;outline-offset:4px}
button:disabled{opacity:.6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:#c1d1ff}
.optional-tools summary span{font-size:.8125rem}.optional-tools summary{line-height:1.55}
.setup-sequence{list-style:none;counter-reset:none;padding:0;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:18px}
.setup-sequence li{padding:18px;border:1px solid #526485;background:#202a3c;border-radius:10px;min-width:0}.setup-sequence li>strong{font-size:1rem}.setup-sequence p{font-size:.875rem;line-height:1.6}
.setup-sequence .primary,.setup-sequence .secondary{width:100%;padding:10px}.setup-sequence .text-button{font-size:.875rem;white-space:normal;text-align:left}.setup-complete{border-color:#77bfa5!important}.setup-current{border-color:#a1b4ff!important;background:#293654!important}
.practice-progress span{font-size:.875rem}.setup-heading h2{font-size:1.375rem}.setup-heading p{font-size:1rem}
#uploadStatus{font-size:.875rem;line-height:1.6}.privacy-link{color:var(--blue)}#privacyDialog p{font-size:1rem;line-height:1.7}.dialog-close{min-width:65px;min-height:44px}
footer{flex-wrap:wrap;align-items:center;font-size:.875rem}footer a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:1150px){.setup-sequence{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){body[data-stage="2"] .workspace{grid-template-columns:1fr}body[data-stage="2"] .controls{border-right:0}body[data-stage="2"] .preview{position:static;border-top:1px solid var(--border);min-height:0}.intro>div>p:last-child{max-width:600px}.setup-sequence{grid-template-columns:1fr 1fr}}
@media(max-width:680px){main{padding:18px 14px 0}header{padding:10px 14px;gap:6px}.topnav{gap:8px;width:100%;justify-content:space-between}.topnav .text-button,.topnav a{font-size:.875rem}.brand{font-size:1.5rem}.app-modes{margin-top:4px}.mode-help{margin-bottom:14px;line-height:1.55}.intro h1{font-size:1.5rem}.intro>div>p:last-child{font-size:.9375rem}.journey strong{font-size:.875rem}.journey button{padding:10px 8px;gap:6px}.journey small{display:none}body[data-stage="2"] .controls,body[data-stage="2"] .preview,body[data-stage="1"] .controls{padding:20px 16px}#writePanel textarea{min-height:165px}.editor-next{gap:10px}.editor-next .primary{min-width:0;flex:1}.getting-started{flex-direction:column}.getting-started #stepSample{width:100%}.getting-started #stepSample small{max-width:none}.setup-sequence{grid-template-columns:1fr;gap:10px}.setup-sequence li{padding:16px}.setup-heading p{font-size:.9375rem}.preview-empty{min-height:180px;padding:24px}.page-style-buttons{gap:8px}.page-style-buttons button{padding:10px}.paper-size-label{flex-wrap:wrap;gap:8px}.paper-size-label select{width:100%;max-width:none}.preview .print-actions{margin-bottom:0}.optional-tools summary span{max-width:40%;text-align:right}.ink-row{gap:12px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{.skip-link,.mode-help,.preview-empty{display:none!important}}

.setup-sequence li::before{display:none}
@media(max-width:680px){#writePanel textarea{min-height:140px}.intro>div>p:last-child{line-height:1.5}.mode-help{margin-bottom:12px}.intro{margin-bottom:12px}.journey{margin-bottom:14px}.journey button{display:flex;flex-direction:row;align-items:center}.journey .step-number{flex:none;width:22px;height:22px}header .topnav{gap:4px 10px}.topnav .text-button{min-height:44px}main{padding-top:14px}}

@media(max-width:360px){.editor-next .primary{font-size:.875rem;padding-left:10px;padding-right:10px}.editor-next{gap:8px}.editor-next .text-button{font-size:.8125rem}}