:root {
  --paper:#f6f5f0; --white:#fffefa; --ink:#222e28; --muted:#657068;
  --line:#d9dcd2; --green:#245943; --pale:#e9ede3; --danger:#a0382b;
  --serif:Georgia,"Times New Roman",serif;
  --sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.6 var(--sans); }
[hidden] { display:none!important; }
a { color:inherit; text-decoration:none; } a:hover { text-decoration:underline; }
button,input { font:inherit; } button,.button { cursor:pointer; }
button:disabled { opacity:.55; cursor:wait; }
button:focus-visible,a:focus-visible,input:focus-visible,.upload-zone:focus-within { outline:3px solid #a97922; outline-offset:3px; }
h1,h2,h3,p { margin-top:0; } p { color:var(--muted); }
.skip { position:absolute; left:-9999px; top:8px; z-index:10; padding:8px; background:var(--white); }
.skip:focus { left:8px; }
.eyebrow { margin:0 0 16px; font-size:10px; font-weight:750; letter-spacing:2px; }
.small { font-size:12px; }
.button { min-height:46px; display:inline-flex; align-items:center; justify-content:center; gap:22px; padding:10px 18px; border:1px solid transparent; border-radius:3px; font-size:13px; line-height:1.3; font-weight:700; white-space:nowrap; text-decoration:none; }
.button:hover { text-decoration:none; filter:brightness(.96); }
.primary { background:var(--green); color:white; }
.secondary { background:var(--white); border-color:#b7c3b6; color:var(--green); }
.quiet { background:transparent; color:var(--ink); }
.quiet:hover { background:var(--pale); }
.text-link { font-size:13px; text-decoration:underline; }
.topbar { border-bottom:1px solid var(--line); }
.topbar-inner { height:82px; max-width:1240px; margin:auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:11px; font-size:27px; line-height:1; letter-spacing:-1.5px; font-weight:800; }
.brand:hover { text-decoration:none; }
.brand-icon { width:37px; height:37px; display:grid; place-items:center; border:1px solid var(--green); border-radius:50%; }
.brand-icon img { width:25px; height:25px; }
.brand-dot { color:var(--green); }
.brand small { display:block; margin-top:4px; color:var(--muted); font-size:8px; line-height:1; letter-spacing:1.5px; font-weight:750; }
.header-caption { margin-left:auto; color:var(--muted); font-size:9px; letter-spacing:1.5px; font-weight:750; }
.header-caption span { margin:0 9px; color:var(--green); }
#session { display:flex; align-items:center; gap:18px; color:var(--muted); font-size:11px; }
#session button { min-height:36px; }
main { max-width:1240px; min-height:calc(100vh - 155px); margin:auto; padding:30px 28px 60px; }
.site-footer { max-width:1184px; margin:auto; padding:23px 0 28px; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:9px; font-weight:750; letter-spacing:1.6px; }
.center { width:min(100%,600px); margin:18vh auto 0; }
.center h1 { font:normal 52px/1.1 var(--serif); }

/* Sign-in layout */
.login-feature { min-height:555px; padding:27px 42px 0; color:var(--white); background:var(--green); overflow:hidden; position:relative; }
.login-feature::before { content:""; position:absolute; inset:0; opacity:.16; pointer-events:none; background:repeating-linear-gradient(90deg,transparent 0,transparent 119px,#c8dfca 120px); }
.feature-top { position:relative; z-index:1; display:flex; justify-content:space-between; border-bottom:1px solid #ffffff55; padding-bottom:15px; font-size:9px; letter-spacing:1.7px; font-weight:750; }
.feature-grid { position:relative; z-index:1; display:grid; grid-template-columns:1.03fr .97fr; gap:24px; align-items:center; min-height:493px; }
.feature-copy { padding:35px 0 64px; }
.feature-copy .eyebrow { color:#d6e5d8; }
.feature-copy h1 { margin:0 0 25px; font:normal clamp(65px,7vw,104px)/.98 var(--serif); letter-spacing:-5px; }
.feature-copy h1 em { color:#cbdcc6; font-weight:normal; }
.feature-copy>p:not(.eyebrow) { max-width:420px; color:#e0e9dd; font-size:15px; line-height:1.8; }
.feature-steps { display:flex; gap:23px; flex-wrap:wrap; margin-top:42px; color:#cfdece; font-size:9px; letter-spacing:1.4px; font-weight:700; }
.paper-scene { position:relative; min-height:450px; perspective:1000px; }
.paper-sheet { position:absolute; width:min(78%,330px); height:378px; top:30px; left:50%; background:var(--white); border:1px solid #d1d9ca; box-shadow:0 13px 25px #102b202b; }
.sheet-back { transform:translateX(-40%) rotate(13deg); background:#e6ebdf; }
.sheet-middle { transform:translateX(-54%) rotate(-9deg); background:#f3f4ed; }
.sheet-front { display:flex; flex-direction:column; padding:23px 26px 21px; transform:translateX(-47%) rotate(2deg); color:var(--ink); }
.sheet-top,.sheet-bottom { display:flex; justify-content:space-between; font-size:9px; letter-spacing:1.3px; font-weight:750; }
.sheet-top { padding-bottom:13px; border-bottom:1px solid var(--line); }
.sheet-top span:last-child { font-size:18px; line-height:10px; color:var(--green); }
.sheet-art { flex:1; display:flex; flex-direction:column; justify-content:center; }
.sheet-kicker { color:var(--green); font-size:8px; letter-spacing:1.3px; font-weight:750; }
.sheet-art strong { margin:15px 0 25px; font:normal 53px/.98 var(--serif); letter-spacing:-2.5px; }
.sheet-rule { height:1px; width:80%; margin:9px 0; background:#b9c8b6; }
.sheet-rule.short { width:57%; }
.sheet-bottom { padding-top:13px; border-top:1px solid var(--line); color:var(--muted); }
.access-band { position:relative; z-index:2; display:grid; grid-template-columns:.76fr 1fr; gap:55px; margin:-23px 34px 0; padding:33px 37px 35px; background:var(--white); border:1px solid var(--line); box-shadow:0 16px 36px #283c2914; }
.access-heading .eyebrow { color:var(--green); }
.access-heading h2 { margin:0 0 7px; font:normal 35px/1.1 var(--serif); letter-spacing:-1.1px; }
.access-heading p:last-child { margin:0; font-size:13px; }
.access-form { border-left:1px solid var(--line); padding-left:40px; }
.access-form label { display:block; margin-bottom:7px; font-size:12px; font-weight:750; }
.login-row { display:flex; gap:8px; }
.login-row input { flex:1; min-width:0; height:46px; padding:10px 13px; border:1px solid #b7bfb2; border-radius:3px; background:var(--white); color:var(--ink); }
.login-row input::placeholder { color:#89958d; }
.access-form .small { margin:8px 0 0; }
.security-note { color:var(--muted); }
#login-wait h2 { font:normal 26px var(--serif); margin:0; }
#login-wait p#login-status { margin-bottom:4px; }
.code { margin:13px 0; color:var(--green); font:700 31px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:7px; }

/* Approval layout */
.approval-screen { width:min(100%,700px); min-height:520px; margin:30px auto; background:var(--white); border:1px solid var(--line); box-shadow:14px 14px 0 var(--pale); }
.approval-index { display:flex; justify-content:space-between; padding:20px 28px; border-bottom:1px solid var(--line); color:var(--green); font-size:10px; font-weight:750; letter-spacing:1.5px; }
.approval-index span { font-size:23px; line-height:10px; }
.approval-content { padding:55px max(28px,8%); }
.approval-content .eyebrow { color:var(--green); }
.approval-content h1 { margin:0 0 20px; font:normal 56px/1.04 var(--serif); letter-spacing:-2px; }
.approval-content .text-link { display:block; margin-top:23px; }
#approval-status { margin-top:15px; }

/* Job form and queue */
.desk-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin:30px 0 34px; }
.desk-heading .eyebrow { margin-bottom:15px; color:var(--green); }
.desk-heading h1 { margin:0; font:normal clamp(55px,6vw,82px)/1.03 var(--serif); letter-spacing:-3.5px; }
.desk-heading h1 span { color:var(--green); }
.desk-heading>p { max-width:260px; margin:0 4px 5px 0; font-size:13px; line-height:1.7; }
.composer { background:var(--white); border:1px solid var(--line); }
.composer-top { display:flex; justify-content:space-between; align-items:center; padding:14px 25px; background:var(--green); color:var(--white); font-size:9px; font-weight:750; letter-spacing:1.5px; }
.composer-top-right { color:#d3e1d0; }
.composer-top-right span { margin-left:12px; font-size:18px; line-height:0; }
.composer-body { display:grid; grid-template-columns:1.07fr .93fr; }
.upload-panel,.settings-panel { min-width:0; padding:36px 38px 38px; }
.upload-panel { border-right:1px solid var(--line); }
.settings-panel { background:#f0f2eb; }
.upload-panel .eyebrow,.settings-panel .eyebrow { color:var(--green); }
.composer h2 { margin:0 0 24px; font:normal 39px/1.1 var(--serif); letter-spacing:-1.2px; }
.upload-zone { min-height:253px; display:flex; flex-direction:column; align-items:flex-start; padding:25px 28px; border:1px dashed #a9b6a6; background:#fafbf7; transition:background .15s,border-color .15s; }
.upload-zone.dragging { background:var(--pale); border-color:var(--green); }
.upload-mark { display:grid; place-items:center; width:38px; height:38px; margin-bottom:21px; border:1px solid var(--green); border-radius:50%; color:var(--green); font-size:22px; line-height:1; }
.upload-zone strong { font:normal 25px/1.2 var(--serif); letter-spacing:-.5px; }
.upload-zone p { margin:4px 0 18px; font-size:12px; }
.upload-zone input { position:absolute; width:1px; height:1px; opacity:0; }
.upload-zone .button { min-height:40px; }
.selected-file { width:100%; margin-top:14px; padding-top:10px; border-top:1px solid var(--line); color:var(--green); font-size:12px; font-weight:700; overflow-wrap:anywhere; }
.upload-hint { margin:10px 0 0; font-size:11px; }
.options { display:grid; gap:17px; }
.field { min-width:0; margin:0; padding:0; border:0; }
.field>label,.field>legend { display:block; width:100%; margin-bottom:7px; padding:0; color:var(--ink); font-size:11px; font-weight:750; }
.copies-control { height:46px; display:flex; align-items:center; width:160px; border:1px solid #b7c2b3; background:var(--white); }
.copies-control input { width:100%; height:100%; min-width:0; padding:7px 12px; border:0; background:transparent; color:var(--ink); font-size:19px; font-weight:700; }
.copies-control span { padding-right:11px; color:var(--muted); font-size:9px; letter-spacing:1.2px; font-weight:750; }
.segmented { display:flex; gap:7px; }
.segmented label { flex:1; min-width:0; position:relative; }
.segmented input { position:absolute; opacity:0; }
.segmented span { min-height:43px; display:grid; place-items:center; padding:8px; border:1px solid #b7c2b3; background:var(--white); color:var(--ink); font-size:11px; font-weight:700; text-align:center; cursor:pointer; }
.segmented input:checked+span { color:var(--white); background:var(--green); border-color:var(--green); }
.segmented input:focus-visible+span { outline:3px solid #a97922; outline-offset:2px; }
.setup-note { display:flex; gap:9px; margin-top:22px; padding-top:13px; border-top:1px solid #d1dacf; }
.setup-note span { color:var(--green); }
.setup-note p { max-width:250px; margin:0; font-size:11px; }
.composer-bottom { min-height:75px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:15px 25px; border-top:1px solid var(--line); }
.composer-bottom>span { color:var(--muted); font-size:9px; letter-spacing:1.5px; font-weight:750; }
.composer-bottom>span span { margin-left:8px; color:var(--green); }
.composer-bottom .button { min-width:184px; }
.queue-section { margin-top:48px; padding:30px 36px 39px; background:var(--green); color:var(--white); }
.queue-top { display:flex; justify-content:space-between; padding-bottom:13px; border-bottom:1px solid #ffffff55; color:#d5e4d2; font-size:9px; letter-spacing:1.6px; font-weight:750; }
.queue-intro { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-top:27px; }
.queue-intro h2 { margin:0 0 5px; font:normal 43px/1.1 var(--serif); letter-spacing:-1.3px; }
.queue-intro p { margin:0; color:#d9e6d6; font-size:12px; }
.queue-refresh { border-color:#d4e2d0; background:transparent; color:var(--white); }
.queue-stats { display:grid; grid-template-columns:repeat(3,1fr); margin:28px 0; border-top:1px solid #ffffff55; border-bottom:1px solid #ffffff55; }
.queue-stats>div { min-height:72px; display:flex; align-items:center; gap:13px; padding:11px 18px; }
.queue-stats>div:first-child { padding-left:0; }
.queue-stats>div+div { border-left:1px solid #ffffff55; }
.queue-stats span { font:normal 29px var(--serif); }
.queue-stats small { color:#d2e2ce; font-size:9px; letter-spacing:1.2px; font-weight:750; }
.job-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.job { position:relative; min-width:0; display:grid; grid-template-columns:42px minmax(0,1fr); gap:12px; padding:17px 18px 16px 23px; background:var(--white); color:var(--ink); }
.job::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:#adbead; }
.job:has(.badge.printing)::before { background:#a97922; }
.job:has(.badge.failed)::before { background:var(--danger); }
.job-icon { width:39px; height:45px; display:grid; place-items:center; border:1px solid var(--line); color:var(--green); font-size:10px; font-weight:800; }
.job-name { font-size:13px; font-weight:750; overflow-wrap:anywhere; }
.job-meta { margin-top:2px; color:var(--muted); font-size:10px; line-height:1.5; }
.job small { display:block; margin-top:6px; color:var(--muted); font-size:10px; }
.job-right { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; padding-top:10px; border-top:1px dashed var(--line); }
.badge { color:var(--green); font-size:10px; font-weight:800; letter-spacing:1px; text-transform:uppercase; }
.badge::before { content:"●"; margin-right:7px; font-size:8px; }
.badge.printing { color:#946518; }.badge.failed { color:var(--danger); }
.cancel { padding:0; border:0; background:none; color:var(--danger); font-size:11px; font-weight:700; }
.empty { min-height:200px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px dashed #ffffff77; text-align:center; }
.empty-mark { color:#d4e4d0; font-size:27px; }
.empty h3 { margin:8px 0 3px; font:normal 29px var(--serif); }
.empty p { margin:0; color:#d4e4d0; font-size:12px; }
.owner-panel { margin-top:48px; padding:34px 36px; border:1px solid var(--line); background:var(--white); }
.owner-heading h2 { margin:0 0 4px; font:normal 43px/1.1 var(--serif); letter-spacing:-1.3px; }
.owner-heading p:last-child { margin:0 0 27px; font-size:12px; }
.invite-form { padding:23px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.invite-form label { display:block; margin-bottom:7px; font-size:11px; font-weight:750; }
.invite-row { display:flex; gap:8px; max-width:650px; }
.invite-row input { flex:1; min-width:0; height:46px; padding:10px 13px; border:1px solid #b7bfb2; border-radius:3px; background:var(--white); color:var(--ink); }
.invitations { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:22px; }
.invitation { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; background:#f0f2eb; }
.invitation strong { display:block; overflow-wrap:anywhere; font-size:12px; }
.invitation small { display:block; color:var(--muted); font-size:10px; }
.invitation .button { min-height:34px; }
.invite-empty { margin:20px 0 0; font-size:12px; }
#notice { position:fixed; right:24px; bottom:24px; z-index:20; max-width:360px; padding:13px 18px; background:var(--ink); color:var(--white); box-shadow:0 12px 35px #0002; font-size:13px; }
dialog { width:min(92vw,440px); padding:32px; border:1px solid var(--line); border-radius:3px; background:var(--white); color:var(--ink); box-shadow:0 20px 60px #0003; }
dialog::backdrop { background:#102b20a3; }
dialog h2 { font:normal 35px var(--serif); }
.dialog-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:24px; }
@media(max-width:950px) {
  .header-caption { display:none; }
  .feature-copy h1 { font-size:78px; }
  .access-band { gap:25px; margin-left:20px; margin-right:20px; }
  .access-form { padding-left:25px; }
  .composer h2 { font-size:32px; }
  .upload-panel,.settings-panel { padding:28px; }
}
@media(max-width:700px) {
  .topbar-inner { height:72px; padding:0 18px; }
  #session-email { display:none; }
  main { padding:18px 16px 42px; min-height:calc(100vh - 125px); }
  .site-footer { margin:0 16px; }
  .login-feature { padding:20px 22px 0; min-height:auto; }
  .feature-grid { grid-template-columns:1fr; min-height:0; }
  .feature-copy { padding:42px 0 4px; }
  .feature-copy h1 { font-size:clamp(59px,12vw,80px); letter-spacing:-3px; }
  .feature-steps { margin-top:27px; gap:14px; }
  .paper-scene { min-height:295px; }
  .paper-sheet { top:12px; width:210px; height:250px; }
  .sheet-front { padding:15px 17px; }
  .sheet-art strong { font-size:35px; margin:8px 0 13px; }
  .sheet-kicker,.sheet-top,.sheet-bottom { font-size:6px; }
  .sheet-rule { margin:5px 0; }
  .access-band { grid-template-columns:1fr; gap:22px; margin:-6px 12px 0; padding:24px; }
  .access-form { padding:20px 0 0; border-left:0; border-top:1px solid var(--line); }
  .desk-heading { display:block; margin:25px 0; }
  .desk-heading h1 { font-size:clamp(52px,9vw,70px); }
  .desk-heading>p { margin-top:14px; }
  .composer-body { grid-template-columns:1fr; }
  .upload-panel { border-right:0; border-bottom:1px solid var(--line); }
  .queue-section { padding:23px 22px 28px; }
  .job-grid { grid-template-columns:1fr; }
  .invitations { grid-template-columns:1fr; }
  .owner-panel { padding:25px 22px; }
}
@media(max-width:460px) {
  .feature-top span:last-child { display:none; }
  .login-row { flex-direction:column; }
  .login-row .button { width:100%; }
  .composer-top-right { display:none; }
  .upload-panel,.settings-panel { padding:23px 20px; }
  .composer h2 { font-size:30px; }
  .composer-bottom { align-items:stretch; flex-direction:column; }
  .composer-bottom .button { width:100%; }
  .queue-intro { display:block; }
  .queue-intro h2 { font-size:35px; }
  .queue-refresh { margin-top:15px; }
  .queue-stats>div { display:block; padding:11px; }
  .queue-stats>div:first-child { padding-left:0; }
  .queue-stats small { display:block; }
  .site-footer span:last-child { display:none; }
  .invite-row { flex-direction:column; }
}
