:root {
 --font-sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,sans-serif;
 --font:var(--font-sans); --mono:var(--font-sans); --font-mono:var(--font-sans);
 --t-sm:13px; --t-body:15px; --t-h3:17px; --t-title:26px; --t-sign:28px;
 --paper:#F4F5F7;
 --surface:#FFFFFF; --surface-2:#F5F5F7; --surface-3:#EBEBEE;
 --glass:rgba(255,255,255,0.72); --glass-strong:rgba(255,255,255,0.88); --glass-dark:rgba(28,28,30,0.78);
 --glass-blur:blur(20px) saturate(180%); --glass-blur-soft:blur(12px) saturate(160%);
 --line:rgba(60,60,67,0.10); --line-soft:rgba(60,60,67,0.06);
 --ink:#1D1D1F; --ink-2:rgba(60,60,67,.58); --ink-3:rgba(60,60,67,.30);
 --rust:#C41A1A; --rust-deep:#A81212; --rust-tint:#FDEEED;
 --accent:#007AFF; --accent-deep:#0066CC; --accent-tint:rgba(0,122,255,0.10);
 --btn-primary-top:#2C2C2E; --btn-primary-btm:#0F0F11;
 --danger:#E03B30; --danger-tint:rgba(224,59,48,0.07);
 --warn:#D17000; --warn-tint:rgba(209,112,0,0.08);
 --go:#34A853; --go-tint:rgba(52,168,83,0.09); --neutral:#8E8E93;
 --shadow-sm:0 1px 0 rgba(0,0,0,.03);
 --shadow-md:0 1px 2px rgba(0,0,0,.03),0 8px 24px rgba(0,0,0,.05);
 --shadow-lg:0 4px 16px rgba(0,0,0,.06),0 24px 48px rgba(0,0,0,.10);
 --glass-line:rgba(60,60,67,.18); --control-line:#7B7B80; --r-lg:16px;
 --text-secondary:#55555C; --danger-ink:#A32218; --go-ink:#206B32;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
html,body{height:100%;background:#EEF0F3;background-image:radial-gradient(ellipse 800px 600px at 20% 0%,rgba(168,48,42,.04) 0%,transparent 50%),radial-gradient(ellipse 700px 500px at 90% 100%,rgba(0,122,255,.05) 0%,transparent 50%),radial-gradient(ellipse at 50% 0%,rgba(255,255,255,.55) 0%,transparent 60%);background-attachment:fixed;color:var(--ink);font-family:var(--font-sans);font-size:var(--t-body);line-height:1.47;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{overflow:hidden}
#shell{height:100%;height:100dvh;display:flex;flex-direction:column}
.header{display:flex;align-items:center;gap:12px;padding:11px 20px;background:rgba(237,238,240,.78);border-bottom:1px solid var(--glass-line);-webkit-backdrop-filter:saturate(200%) blur(28px);backdrop-filter:saturate(200%) blur(28px);flex:none;flex-wrap:wrap}
.nb-squircle{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--rust);color:var(--surface);border-radius:10px;font-weight:800}
.crumb{color:var(--text-secondary)}.crumb b{color:var(--ink);margin-left:7px}.meta{font-size:var(--t-sm);color:var(--text-secondary);margin-left:auto}
#main{flex:1;min-height:0;overflow:auto;padding:16px;padding-bottom:max(26px,env(safe-area-inset-bottom));scroll-padding-bottom:26px;background:rgba(242,242,245,.55)}
h1{font-size:var(--t-title);letter-spacing:-.015em}h2{font-size:var(--t-h3)}p{margin:8px 0}ol{padding-left:24px}li{margin:8px 0}
.hero{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:8px 0 16px;border-bottom:1px solid var(--glass-line)}.hero>div:first-child{flex:1}.eyebrow{font-size:var(--t-sm);font-weight:700;color:var(--text-secondary)}
button,.button,select{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:56px;min-width:56px;padding:10px 16px;border:1px solid var(--control-line);border-radius:12px;background:var(--surface);color:var(--accent-deep);font:inherit;font-size:var(--t-body);font-weight:600;cursor:pointer;flex:0 0 auto;text-decoration:none;transition:transform .08s,opacity .12s;touch-action:manipulation}
button:active,.button:active{transform:scale(.97);opacity:.88}button:disabled{color:var(--text-secondary);background:var(--surface-3);cursor:default}button:disabled:active{transform:none;opacity:1}
.primary{background:linear-gradient(180deg,var(--btn-primary-top),var(--btn-primary-btm));color:var(--surface);box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
:focus-visible{outline:3px solid var(--accent-deep);outline-offset:3px}
.actions,.action-bar,.sign-controls{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.action-bar{position:sticky;bottom:0;justify-content:space-between;padding:12px 0;background:var(--glass-strong);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
.notice{background:var(--surface);border:1px solid var(--control-line);border-radius:var(--r-lg);padding:16px;margin:12px 0;color:var(--ink)}
.error{color:var(--danger-ink);background:var(--surface);padding:16px;border:2px solid var(--danger-ink);border-radius:12px}
.floor-tabs{display:flex;gap:10px;min-width:0;overflow-x:auto;padding:16px 0}.floor-tabs [aria-pressed="true"]{background:var(--accent-tint);border-color:var(--accent-deep);color:var(--accent-deep)}
.apt-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--glass-line);flex-wrap:wrap}.sign-choice{flex:1;justify-content:space-between;text-align:left;min-width:140px;color:var(--ink)}.row-status{flex:1;min-width:140px}.apt-number{font-size:var(--t-h3);font-weight:700}.row-status small{display:block;color:var(--text-secondary);font-size:var(--t-sm)}
#handback button{margin-top:8px}#saved{color:var(--go-ink);min-height:22px}
body.signing #header{display:none}body.signing #main{padding:16px;display:flex;flex-direction:column;background:transparent}
#sign-view{display:flex;flex-direction:column;flex:1;min-height:0}.sign-title{flex:none}.sign-title h1{font-size:var(--t-sign)}
.pad-position{display:flex;flex:1;min-height:0;align-items:center;padding-top:16svh;padding-bottom:20px}
#pad-box{position:relative;flex:1;height:clamp(300px,43vw,340px);background:var(--surface);border:1px solid var(--control-line);border-radius:12px;overflow:hidden}
#pad{height:100%;width:100%;position:relative}.x-line{position:absolute;inset:0;pointer-events:none;display:flex;align-items:flex-end;padding:0 22px 40px;color:var(--ink)}.x-line:after{content:"";position:absolute;left:48px;right:24px;bottom:40px;border-bottom:1px solid var(--control-line)}.x-line span{font-size:var(--t-title)}
.sign-controls{flex:none;justify-content:flex-end}#sign-status{flex:none;color:var(--danger-ink)}
.check{padding:16px 0;border-bottom:1px solid var(--glass-line)}.check label{display:block;margin:10px 0 4px}.check select,.check textarea{width:100%}textarea{font:inherit;font-size:var(--t-body);padding:12px;border:1px solid var(--control-line);border-radius:10px;min-height:90px;color:var(--ink);background:var(--surface)}.check button{margin-top:8px}
#tools label{display:block;margin-top:16px}#tools .actions{margin:12px 0}
@media(max-width:600px) and (orientation:portrait){
 .header{padding:10px 12px}.meta{margin-left:0}#main{padding:12px}.apt-row{gap:8px}.apt-row>button:not(.sign-choice){padding:10px 12px}.sign-choice{flex-basis:100%}
 .pad-position{padding-top:12px;align-items:stretch;min-height:292px;flex:1}#pad-box{height:auto;min-height:280px}
 body.signing #main{padding:12px}#sign-view{min-height:530px}
 .sign-controls{justify-content:space-between}
}
@media(prefers-reduced-motion:reduce){button,.button{transition:none}}