:root{--ink:#172920;--paper:#f4f3ec;--accent:#c6f36a;--line:#c7cbc2}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px}button,input,select,textarea,.button{font:inherit}button,.button{cursor:pointer;border:1px solid var(--ink);background:transparent;color:var(--ink);padding:10px 14px;border-radius:4px;display:inline-block;text-align:center}button:hover,.button:hover{background:#e0e6d6}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.upload:focus-within,.button:focus-within{outline:3px solid #387ef5;outline-offset:3px}header{display:flex;align-items:center;justify-content:space-between;padding:22px 4vw;border-bottom:1px solid var(--ink);gap:20px}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-weight:900;letter-spacing:1px}.mark{background:var(--ink);color:var(--accent);padding:6px 10px;font-size:27px;letter-spacing:-3px}.edition,.eyebrow{font-family:monospace;font-size:13px;letter-spacing:1px}.intro{display:flex;justify-content:space-between;align-items:end;padding:40px 0 32px;gap:25px}.intro p:last-child{max-width:335px;line-height:1.6}h1{font-size:clamp(38px,5vw,68px);line-height:.98;letter-spacing:-3px;margin:14px 0}h1 em{font-family:Georgia,serif;font-weight:normal}main{max-width:1440px;padding:0 4vw;margin:auto}.workspace{display:grid;grid-template-columns:minmax(310px, .85fr) minmax(350px,1.3fr);border:1px solid var(--ink)}.editor{padding:24px;border-right:1px solid var(--ink)}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px}.section-heading h2{font-size:15px;margin:0}.section-heading>span{font-size:13px}#pages{display:grid;grid-template-columns:repeat(8,1fr);gap:5px}#pages button{padding:10px 0}#pages button[aria-current=true]{background:var(--ink);color:white}.editor-heading{display:flex;align-items:center;justify-content:space-between;margin-top:20px}h3{font-family:Georgia,serif;font-size:26px;font-weight:normal}label{display:block;font-size:14px;margin:14px 0 7px}input:not([type=file]),textarea,select{width:100%;padding:10px;border:1px solid #929d91;border-radius:3px;background:#fffef8;color:var(--ink)}textarea{resize:vertical;line-height:1.5}.field-row{display:flex;gap:14px;align-items:end}.field-row>div{flex:1;min-width:0}.field-row button{font-size:14px}.upload{border:1px dashed #71806e;padding:18px;text-align:center;cursor:pointer;margin-top:20px;font-size:16px}input[type=file]{position:absolute;width:1px;height:1px;opacity:0}.move-row{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:20px;margin-top:22px;font-size:14px}.move-row span{margin-right:auto}.move-row button{font-size:14px;padding:8px}.preview{background:#e1e7dc;padding:24px;min-width:0;display:flex;flex-direction:column}.view-switch{display:flex}.view-switch button{font-size:13px;padding:8px}.view-switch button[aria-pressed=true]{background:var(--ink);color:white}#canvas-wrap{flex:1;min-height:380px;display:flex;align-items:center;justify-content:center;padding:20px}canvas{display:block;max-width:100%;max-height:520px;width:auto;height:auto;box-shadow:7px 10px 0 #17292022}#preview-note{text-align:center;font-family:monospace;font-size:14px}.hint{font-size:13px;line-height:1.5;color:#4e604f;text-align:center}.output{display:flex;align-items:center;justify-content:space-between;padding:25px 0;gap:24px;border-bottom:1px solid var(--line)}.output h2{font-family:Georgia,serif;font-weight:normal;font-size:28px;margin:0}.export-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.export-controls label{margin:0}.export-controls select{width:auto}.primary{background:var(--ink);color:var(--accent);font-weight:bold}.primary:hover{background:#304b39}.project-bar{display:flex;align-items:center;gap:10px;padding:20px 0;flex-wrap:wrap}.project-bar label{margin:0;font-size:16px}#status{margin-left:auto;font-size:14px;max-width:480px}footer{margin:30px 4vw 0;padding:25px 0;border-top:1px solid var(--ink);display:flex;justify-content:space-between;gap:20px;font-size:13px}dialog{max-width:640px;width:calc(100% - 32px);padding:32px;background:var(--paper);color:var(--ink);border:1px solid var(--ink)}dialog::backdrop{background:#172920aa}dialog h2{font:32px Georgia,serif}dialog li{padding:7px;line-height:1.5}dialog p{line-height:1.5}.close{float:right;font-size:22px}.fold-map{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--ink)}.fold-map span{padding:16px;border:1px dashed #82907e;text-align:center}.fold-map span:nth-child(2),.fold-map span:nth-child(3){border-bottom:3px solid var(--ink)}@media(max-width:850px){.edition{display:none}.workspace{grid-template-columns:1fr}.editor{border-right:0;border-bottom:1px solid var(--ink)}.output{align-items:start;flex-direction:column}.intro{align-items:start}.intro p:last-child{max-width:230px}.preview{min-height:550px}}@media(max-width:520px){header{padding:15px}.brand{font-size:13px}header button{font-size:13px}.intro{display:block;padding-top:24px}.intro p:last-child{max-width:none}h1{letter-spacing:-2px}.editor,.preview{padding:16px}.section-heading{flex-wrap:wrap}#canvas-wrap{padding:10px}.project-bar button,.project-bar .button{font-size:14px}footer{flex-direction:column}.export-controls{width:100%}.export-controls .primary{flex:1}#status{margin:8px 0}dialog{padding:20px}.move-row{flex-wrap:wrap}}

/* Main-site navigation; scoped to keep the editor controls independent. */
.site-header{background:#ffffffed;border-bottom:1px solid #0002;color:#20202b}
.site-nav{display:flex;align-items:center;flex-wrap:wrap;gap:8px 24px;padding:16px 24px;min-height:74px}
.site-nav a{color:inherit}
.site-nav .site-name{text-decoration:none;font-weight:700;font-size:20px;margin-right:auto;white-space:nowrap}
.site-nav .nav-links{display:flex;flex-wrap:wrap;gap:6px 8px}
.site-nav .nav-links a{padding:10px 12px;text-decoration:none;border-radius:4px;font-size:16px}
.site-nav .nav-links a:hover,.site-nav .nav-links a[aria-current=page]{background:#252533;color:white}
.site-nav a:focus-visible{outline:3px solid #161640;outline-offset:4px}
@media(max-width:600px){.site-nav{padding:12px 16px;gap:10px}.site-nav .site-name{width:100%}.site-nav .nav-links{gap:4px}.site-nav .nav-links a{padding:9px;font-size:15px}}