/* ===== app.css ===== */
:root{--bg:#F3F5F9;--sf:#fff;--sf2:#EAEEF5;--tx:#0E1A2B;--mu:#5B6B82;--ln:#D9DFEA;--ac:#F2A900;--bl:#1F4FD8;--sh:0 1px 2px rgba(14,26,43,.06),0 12px 32px -12px rgba(14,26,43,.18)}
[data-t=dark]{--bg:#09121F;--sf:#102036;--sf2:#16294A;--tx:#EAF0FA;--mu:#8FA2BF;--ln:#22385C;--sh:0 1px 2px #0006,0 16px 40px -16px #000a}
*{box-sizing:border-box}html,body{margin:0}
body{font:15px/1.5 Inter,system-ui,sans-serif;background:var(--bg);color:var(--tx);-webkit-font-smoothing:antialiased;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
h1,h2,h3{font-family:'Barlow Condensed',sans-serif;letter-spacing:.01em;margin:0}
button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px;padding:12px 20px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--ln)}
.brand{display:flex;align-items:center;gap:10px;font:700 22px 'Barlow Condensed';cursor:pointer}
.mark{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,var(--bl),#0E1A2B);display:grid;place-items:center;color:var(--ac);font:700 15px 'Barlow Condensed'}
.sp{flex:1}.bl{background:#fff;border-radius:9px;padding:5px 10px;display:flex;border:1px solid var(--ln)}.bl img{height:26px;width:auto;display:block}
.btn{border:1px solid var(--ln);background:var(--sf);border-radius:10px;padding:8px 14px;font-weight:500}
.btn.p{background:var(--ac);border-color:var(--ac);color:#0E1A2B;font-weight:600}
.btn.d{color:#D64545}
.wrap{max-width:1240px;margin:0 auto;padding:28px 20px 60px}
.hero{padding:8px 0 28px}.hero h1{font-size:44px;line-height:1.05}.hero p{color:var(--mu);max-width:52ch;margin:8px 0 0}
.sec{margin:30px 0 12px;font-size:22px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.tile{background:var(--sf);border:1px solid var(--ln);border-radius:16px;padding:18px;text-align:left;box-shadow:var(--sh);display:flex;flex-direction:column;gap:6px;min-height:120px;transition:transform .15s}
.tile:hover{transform:translateY(-2px)}.tile b{font:700 20px 'Barlow Condensed'}.tile span{color:var(--mu);font-size:13px}
.tile i{width:36px;height:4px;border-radius:2px;background:var(--ac);margin-bottom:6px}
.row{display:flex;align-items:center;gap:12px;background:var(--sf);border:1px solid var(--ln);border-radius:12px;padding:12px 16px;margin-bottom:8px;cursor:pointer}
.row small{color:var(--mu)}
.ed{display:grid;grid-template-columns:minmax(320px,440px) 1fr;gap:20px;align-items:start}
.pane{background:var(--sf);border:1px solid var(--ln);border-radius:16px;padding:18px;box-shadow:var(--sh)}
.pane h3{font-size:19px;margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--ln)}.pane h3:first-child{margin-top:0;padding-top:0;border:0}
.fld{margin-bottom:12px}.fld label{display:block;font-size:12.5px;font-weight:600;color:var(--mu);margin-bottom:4px}
.ctl{display:flex;gap:6px}
input,textarea,select{width:100%;font:inherit;color:var(--tx);background:var(--sf2);border:1px solid var(--ln);border-radius:9px;padding:9px 11px}
input:focus,textarea:focus,select:focus{outline:2px solid var(--bl);border-color:transparent}
.al{display:flex;border:1px solid var(--ln);border-radius:9px;overflow:hidden;flex:none}
.al button{border:0;background:var(--sf2);width:32px;color:var(--mu);font-size:13px}.al button.on{background:var(--bl);color:#fff}
.chk{display:flex;flex-wrap:wrap;gap:6px 14px}.chk label{display:flex;gap:6px;align-items:center;color:var(--tx);font-weight:400;font-size:14px;margin:0}.chk input{width:auto}
.tr{background:var(--sf2);border-radius:12px;padding:10px;margin-bottom:8px}
.tr .cs{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.tabs{display:none}
.stage{background:#8892A6;border-radius:16px;padding:18px;overflow:auto;display:flex;justify-content:center}
.slot-ed{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.slot-ed label{aspect-ratio:1;border:1.5px dashed var(--ln);border-radius:12px;display:grid;place-items:center;overflow:hidden;cursor:pointer;color:var(--mu);font-size:12px;text-align:center;background:var(--sf2)}
.slot-ed img{max-width:80%;max-height:80%}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--tx);color:var(--bg);padding:10px 18px;border-radius:10px;z-index:99}

/* ---------- A4 sheet (preview + PDF): mirrors the original Danholsen forms ---------- */
.sheet{width:210mm;min-height:297mm;background:#fff;color:#111;padding:0 10mm;font:11px/1.35 Lato,Arial,sans-serif;box-shadow:0 10px 40px #0004}
.wrap2{width:100%;border-collapse:collapse}.wrap2>thead td,.wrap2>tfoot td{padding:0;height:8mm}.wrap2>tbody>tr>td{padding:0;vertical-align:top}
.body{display:flex;flex-direction:column;gap:7px}
.logos{display:flex;min-height:18mm;border:1px solid #111}
.slot{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;padding:2mm}
.slot img{max-width:100%;max-height:14mm;width:auto;height:auto;object-fit:contain;display:block}
.bar{height:4px;background:#111;margin-top:3px}
.jt{display:flex;justify-content:space-between;align-items:flex-end;margin:6px 0 4px}.jt h2{font:700 23px Lato,Arial}
.jt span{font-weight:700;font-size:11px}.jt u{display:inline-block;min-width:44mm;border-bottom:1.5px solid #111;text-decoration:none;padding:0 6px 2px}
.ob{background:#F2A900;text-align:center;padding:7px}.ob h2{font:700 17px Lato,Arial;text-transform:uppercase}
.tt{text-align:center;padding:3px}.tt h2{font:400 22px Lato,Arial;text-decoration:underline;text-transform:uppercase}
.gb{background:#D9D9D9;border:1px solid #9A9A9A;text-align:center;padding:8px}.gb h2{font:700 13px Lato,Arial;text-transform:uppercase}
.sh{font-weight:700;font-size:11px;text-transform:uppercase;padding:5px 8px}
.st-jcf .sh{padding:6px 0}.st-jcf .sh.ctr{text-align:center}
.st-trn .sh{background:#3A3A3A;color:#fff}
.st-tsh .sh{font-weight:400;padding:2px 0}
.st-rep .sh{background:#D9D9D9;text-align:center;border:1px solid #9A9A9A}
.g{display:grid;border-top:1px solid #9A9A9A;border-left:1px solid #9A9A9A}
.c{display:flex;border-right:1px solid #9A9A9A;border-bottom:1px solid #9A9A9A;min-height:8.5mm;break-inside:avoid}
.c .l{width:36%;max-width:38mm;flex:none;background:#F1F1F1;font-weight:700;font-size:10px;padding:3px 7px;display:flex;align-items:center;border-right:1px solid #9A9A9A}
.st-tsh .c .l{text-transform:uppercase}
.c .v{flex:1;min-width:0;padding:3px 7px;display:flex;align-items:center;white-space:pre-wrap;overflow-wrap:anywhere}.v.t{display:flex;align-items:center}
.lr{display:flex;align-items:center;border-bottom:1px solid #D0D0D0;padding:9px 0;break-inside:avoid}.lr b{width:55mm;flex:none;text-transform:uppercase;font-size:11px}.lr .v{flex:1;padding:0;text-transform:uppercase}
.rbs{border-top:1px solid #9A9A9A;border-left:1px solid #9A9A9A}
.rg{display:grid;grid-template-columns:repeat(var(--n),1fr);break-inside:avoid}
.rl,.rv{border-right:1px solid #9A9A9A;border-bottom:1px solid #9A9A9A;min-width:0}
.rl{background:#D9D9D9;font-weight:700;font-size:9.5px;text-transform:uppercase;text-align:center;padding:4px 5px;display:flex;align-items:center;justify-content:center}
.rv{display:flex;min-height:9mm}.rv .v{flex:1;min-width:0;padding:3px 6px;display:flex;align-items:center;white-space:pre-wrap;overflow-wrap:anywhere}
.tb{width:100%;border-collapse:collapse;table-layout:fixed}
.tb th{background:#3A3A3A;color:#fff;font-size:9.5px;padding:6px 4px;border:1px solid #111;text-transform:uppercase}
.st-tsh .tb th,.st-rep .tb th{background:#D9D9D9;color:#111;border-color:#9A9A9A}
.tb td{border:1px solid #9A9A9A;padding:4px 7px;vertical-align:middle;overflow-wrap:anywhere;height:8mm}.tb tr{break-inside:avoid}
.st-jcf .tb td{height:10.5mm;border-color:#111}.st-trn .tb td{height:11mm}
.o{display:inline-block;width:5mm;height:5mm;border:1.2px solid #444;border-radius:50%;vertical-align:middle;position:relative}.o.on::after{content:'';position:absolute;inset:1mm;background:#111;border-radius:50%}
.bx{display:inline-block;width:4.2mm;height:4.2mm;border:1.2px solid #444;border-radius:1px;vertical-align:middle;margin-right:5px;text-align:center;line-height:3.8mm;font-size:10px;font-weight:700}
.st-trn .bx.on{background:#1A73E8;border-color:#1A73E8;color:#fff}
.ck{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center;border:1px solid #9A9A9A;padding:8px 10px}
.sg{display:grid;grid-template-columns:repeat(var(--n),1fr);border:1px solid #9A9A9A}.sg>div{padding:5px 8px;border-right:1px solid #9A9A9A}.sg>div:last-child{border:0}
.sg .l{font-weight:700;font-size:9px;text-transform:uppercase;margin-bottom:3px}.sg .ln{border-bottom:1px solid #111;min-height:6mm;display:flex;align-items:flex-end;padding-bottom:1px}
.sl{display:grid;grid-template-columns:1fr 1fr;gap:12px 14mm;margin-top:4px}.sl>div{display:flex;align-items:flex-end;gap:6px;font-weight:700;text-transform:uppercase}.sl .ln{flex:1;border-bottom:1px solid #111;min-height:8mm;font-weight:400;display:flex;align-items:flex-end;text-transform:none}
.bxs{display:grid;grid-template-columns:1fr 1fr;border:1px solid #111;break-inside:avoid}.bxs>div+div{border-left:2px solid #111}
.bxs .bh{background:#F2A900;font-weight:700;text-align:center;font-size:9.5px;padding:6px;text-transform:uppercase}
.st-tsh .bxs .bh{background:#fff;border-bottom:1px solid #111}
.bxs .br{padding:8px 8px;border-top:1px solid #9A9A9A;min-height:10mm;display:flex;align-items:center;gap:5px}.bxs .br b{font-weight:400}.bxs .br .v{flex:1;padding:0}
.ft{margin-top:6px;padding-top:4px;font-size:9px;color:#444;display:flex;justify-content:space-between}

@media(max-width:900px){.ed{grid-template-columns:1fr}.tabs{display:flex;gap:8px;margin-bottom:12px}.tabs .btn{flex:1}.ed[data-v=form] .stage,.ed[data-v=prev] .pane{display:none}.hero h1{font-size:36px}.stage{padding:8px;justify-content:flex-start}}
@media print{
 @page{size:A4;margin:0}
 html,body{background:#fff!important;padding:0}
 .top,.pane,.tabs,.hero,.toast{display:none!important}
 .wrap,.ed,.stage{display:block!important;padding:0!important;margin:0!important;background:none!important;max-width:none!important;border:0!important}
 .sheet{box-shadow:none;zoom:1!important;min-height:0;width:210mm}
 *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
.brand>span:last-child{display:inline}
.top .btn{white-space:nowrap}#ttl{flex:1;min-width:0}@media(max-width:600px){.top{padding:10px 12px;gap:8px}.bl img{height:22px}}
.sh{break-after:avoid}.sg,.sl,.ck,.g{break-inside:avoid}
.jt h2{text-transform:uppercase}

.sxg{display:grid;grid-template-columns:1fr 2fr 2fr 2fr 2fr;border-top:1px solid #9A9A9A;border-left:1px solid #9A9A9A}.sxg>div{border-right:1px solid #9A9A9A;border-bottom:1px solid #9A9A9A;padding:3px 6px;min-height:9mm;display:flex;align-items:center;gap:4px;min-width:0}.sxg .v{flex:1;padding:0}.sxg .sxh{background:#D9D9D9;font-weight:700;justify-content:center;text-transform:uppercase;font-size:9.5px;min-height:6mm}.sxg .sxl{grid-column:1;grid-row:2/5;justify-content:center;text-align:center}.sxg .sxh .v{justify-content:center}
.st-tsh .sh{background:#3A3A3A;color:#fff;padding:5px 8px;font-weight:700}.st-tsh .tb th{background:#3A3A3A;color:#fff;border-color:#111}.st-tsh .tb td{height:8mm}.st-tsh .tt{text-align:right;border-bottom:2px solid #F2A900}.st-tsh .tt h2{font:700 20px Lato,Arial;text-decoration:none}.st-tsh .bxs .bh{background:#F2A900;color:#fff;border-bottom:1px solid #111}
.sxg>div>b{flex:none;min-width:15mm}.sxg>div:not(.sxh):not(.sxl)>.v{justify-content:flex-start!important;text-align:left!important}

/* ===== premium.css ===== */
/* Premium layer: loads after app.css, restyles the shell only. A4 sheet is untouched. */
:root{--bg:#EEF1F6;--ln:#D9DFEA;--r:16px;--sh:0 1px 2px rgba(14,26,43,.05),0 10px 30px -14px rgba(14,26,43,.22)}
[data-t=dark]{--bg:#070F1B;--sf:#0F1D31;--sf2:#14253F;--ln:#1E3355}
body{letter-spacing:-.003em}
.top{padding:calc(10px + env(safe-area-inset-top)) 18px 10px;border-bottom:1px solid color-mix(in srgb,var(--ln) 70%,transparent);background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:saturate(1.4) blur(18px)}
.wm{font:600 22px 'Barlow Condensed';color:var(--mu);letter-spacing:.04em;text-transform:uppercase}
.bl{border-radius:10px;box-shadow:var(--sh)}
.ib{width:44px;height:44px;border-radius:13px;border:1px solid var(--ln);background:var(--sf);display:grid;place-items:center;color:var(--tx);transition:.15s}
.ib:active,.btn:active,.tile:active,.row:active{transform:scale(.97)}.ib.d{color:#D64545;width:40px;height:40px;border-color:transparent;background:transparent}
.btn{border-radius:12px;min-height:44px;padding:0 18px;font-weight:600;box-shadow:0 1px 2px rgba(14,26,43,.06);transition:.15s}
.btn.p{background:linear-gradient(180deg,#F7B91F,#F2A900);box-shadow:0 6px 16px -6px rgba(242,169,0,.7)}
.wrap{padding:22px 20px 130px}
.h1{font:700 44px/1 'Barlow Condensed';margin:6px 0 16px}.h1.s{font-size:30px;margin:0}
.search{height:52px;border-radius:15px;padding:0 18px;background:var(--sf);box-shadow:var(--sh);font-size:15px}
.search:focus{outline:2px solid var(--bl)}
.cont{display:flex;gap:16px;align-items:center;margin-top:18px;padding:18px;border-radius:22px;color:#fff;background:radial-gradient(120% 140% at 100% 0,#1F4FD8 0,transparent 55%),#0E1A2B;box-shadow:0 18px 40px -18px rgba(14,26,43,.8)}
.pg{flex:none;width:76px;height:102px;background:#fff;border-radius:7px;padding:9px 8px;box-shadow:0 8px 18px #0006;transform:rotate(-3deg)}
.pg i{display:block;height:4px;background:#ddd;margin-top:8px;border-radius:2px}.pg i:first-child{height:5px;background:#111;margin-top:12px}.pg i:nth-child(2){width:60%;background:#F2A900}
.ci small{font:600 12px Inter;color:#F2A900;letter-spacing:.06em;text-transform:uppercase}
.ci h2{font:700 24px/1.1 'Barlow Condensed';margin:5px 0 3px}.ci p{margin:0 0 12px;color:#B7C3D6;font-size:12.5px}
.sec{font:700 24px 'Barlow Condensed';margin:30px 0 12px}
.grid{grid-template-columns:repeat(2,1fr);gap:12px}
.tile{padding:10px 10px 14px;gap:3px;border-radius:var(--r);min-height:0;align-items:stretch}
.tile b{font:600 14.5px Inter;margin-top:8px}.tile span{font-size:12px;line-height:1.35}
.thm{height:66px;border-radius:9px;background:#fff;border:1px solid var(--ln);position:relative;overflow:hidden}
.thm b{position:absolute;display:block;left:9px;right:9px;height:5px;margin:0;background:#D9D9D9;border-radius:1px;font-size:0}
.thm b:nth-child(1){top:11px;height:5px;background:#111;left:0;right:0}.thm b:nth-child(2){top:23px;width:45%;right:auto;background:#F2A900}
.thm b:nth-child(3){top:37px}.thm b:nth-child(4){top:48px;height:1px;background:#999}
.t-trn .thm b:nth-child(1),.t-jcf .thm b:nth-child(1){background:#F2A900}.t-tsh .thm b:nth-child(3){height:12px;top:35px}.t-ut .thm b:nth-child(3){height:14px;top:37px;border:1px solid #999;background:none}
.row{border-radius:14px;padding:10px 8px 10px 12px;gap:12px;box-shadow:var(--sh);margin:0 0 10px}
.ri{width:40px;height:40px;border-radius:11px;background:var(--sf2);display:grid;place-items:center;color:var(--bl);flex:none}[data-t=dark] .ri{color:#F2A900}
.rt{flex:1;min-width:0}.rt b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rt small{color:var(--mu)}
.empty{color:var(--mu);padding:18px;text-align:center;border:1.5px dashed var(--ln);border-radius:14px}
.nav{position:fixed;z-index:20;left:0;right:0;bottom:0;display:flex;justify-content:space-around;padding:8px 12px calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--sf) 88%,transparent);backdrop-filter:blur(18px);border-top:1px solid var(--ln)}
.nav button{border:0;background:none;color:var(--mu);width:76px;height:54px;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font:500 11px Inter}
.nav button.on{color:var(--bl);font-weight:600;background:color-mix(in srgb,var(--bl) 10%,transparent)}[data-t=dark] .nav button.on{color:#F2A900;background:#F2A9001A}
.pane{border-radius:20px;padding:20px}.lead{color:var(--mu);margin:0 0 16px;font-size:14px}
.pane h3{font:700 20px 'Barlow Condensed'}
input,textarea,select{border-radius:12px;padding:11px 13px;min-height:44px}
.slot-ed{gap:10px}.slot-ed label{border-radius:14px;line-height:1.3;transition:.15s}.slot-ed label:hover{border-color:var(--ac);background:#F2A9000F}
#ttl{max-width:none;flex:1;font:700 20px 'Barlow Condensed';background:transparent;border-color:transparent;padding:0 8px}#ttl:focus{background:var(--sf2)}
.stage{background:linear-gradient(180deg,#8E98AC,#7A8499);border-radius:20px}
.tabs{padding:4px;background:var(--sf2);border-radius:14px;margin-bottom:14px}.tabs .btn{border:0;background:transparent;box-shadow:none;min-height:40px}
.toast{border-radius:14px;box-shadow:0 12px 30px #0006}
@media(min-width:600px){.grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}.wrap{padding:30px 32px 60px}}
@media(min-width:900px){.nav{top:0;right:auto;width:88px;flex-direction:column;justify-content:flex-start;align-items:center;gap:6px;padding-top:96px;border-top:0;border-right:1px solid var(--ln)}
 body:has(.nav){padding-left:88px}body:has(.nav) .top{margin-left:-88px;padding-left:106px}.wrap{padding-bottom:60px}.h1{font-size:54px}}
@media(max-width:900px){.tabs{display:flex}.wrap:has(.ed){padding-bottom:40px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{.nav,.top{display:none!important}body{padding:0!important}}
.cont{max-width:820px}.search{max-width:820px}
/* ---- in-place editing ---- */
.ew{max-width:none;padding:12px 8px 150px}.hint{text-align:center;color:var(--mu);font-size:13px;margin:4px 0 12px}
.stage{flex-direction:column;align-items:center;padding:14px 10px;overflow-x:hidden}
.sheet [data-ed]{caret-color:#1F4FD8;cursor:text;-webkit-user-select:text;user-select:text;-webkit-tap-highlight-color:transparent}
.sheet [data-ed]:empty::after{content:'\00a0'}
.sheet .cki,.sheet .rc{cursor:pointer}
.addrow{display:block;margin:6px auto 2px;border:1.5px dashed #999;background:none;border-radius:8px;padding:6px 16px;font:600 10px Inter;color:#555;cursor:pointer}
@media screen{.sheet [data-ed]:hover{background:#F2A90022;outline:1.5px dashed #F2A900;outline-offset:1px;border-radius:2px}
.sheet [data-ed].on{outline:2px solid #1F4FD8!important;outline-offset:2px;background:#1F4FD812!important;border-radius:2px}
.sheet .rc:hover,.sheet .cki:hover{background:#F2A90033}}
.etb{position:fixed;left:0;right:0;bottom:0;z-index:30;max-width:560px;margin:0 auto;transform:translateY(115%);transition:transform .22s;background:var(--sf);border-radius:22px 22px 0 0;padding:14px 16px calc(14px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px #0003}
.etb.show{transform:none}.eh{display:flex;justify-content:space-between;align-items:center;min-height:26px}
.eh small{font:600 12px Inter;color:var(--mu);letter-spacing:.03em}.eh button{border:0;background:none;color:var(--bl);font-weight:600;padding:6px 4px}[data-t=dark] .eh button{color:#F2A900}
.er{display:flex;gap:8px;margin-top:8px}.ab{flex:none;width:48px;height:48px;border-radius:12px;border:1px solid var(--ln);background:var(--sf2);display:grid;place-items:center}
.ab.on{background:var(--bl);color:#fff;border-color:transparent}
.nx{flex:1;min-width:0;height:48px;border-radius:12px;border:1px solid var(--ln);background:var(--sf2);font-weight:600}.nx.dk{background:#F2A900;color:#0E1A2B;border:0}
/* ---- logo drag ---- */
.sheet [data-slot],.slot-ed label[data-slot]:has(img){touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}
.lift{opacity:.35}.dt{outline:2.5px solid #F2A900!important;outline-offset:-3px;background:#F2A9001F!important}
.ghost{position:fixed;z-index:200;pointer-events:none;width:76px;height:auto;transform:translate(-50%,-50%) rotate(-4deg);background:#fff;padding:5px;border-radius:10px;filter:drop-shadow(0 10px 16px #0007)}
@media print{.sheet [data-ed]{outline:0!important;background:none!important}.addrow,.etb,.hint{display:none!important}.sheet{zoom:1!important}.stage{padding:0!important;background:none!important}}
.top:has(#ttl) .sp{display:none}#ttl{flex:1 1 auto;min-width:0;text-overflow:ellipsis}
.top:has(#ttl) .btn.p{flex:none;padding:0 14px}.nx{white-space:nowrap}.nx.dk{flex:1.5}
/* ---- logo controls ---- */
.lp{background:#fff;border-radius:12px;padding:6px;margin:0 0 14px;box-shadow:var(--sh)}.lp .logos{background:#fff;min-height:22mm}
.lp .slot{cursor:pointer}.lp .slot.sel,.slot-ed label.sel{outline:2.5px solid #F2A900;outline-offset:-3px;background:#FFF7E0}
.lc{background:var(--sf2);border-radius:16px;padding:14px;margin-bottom:6px;display:flex;flex-direction:column;gap:12px}
.lm{display:flex;gap:10px}.lm .btn{flex:1;display:grid;place-items:center;text-align:center;cursor:pointer;height:48px}
.sz{font-weight:600;font-size:13px;display:block}.sz b{float:right;color:var(--mu);font-weight:600}
.sz input{padding:0;min-height:30px;margin-top:8px;accent-color:#1F4FD8;background:none;border:0}
.tip{color:var(--mu);font-size:13px;margin:0 0 6px}
.lm .btn{padding:0 8px;font-size:13.5px;white-space:nowrap}
/* ===== design pass 2: real document previews, calmer desk, trust cues ===== */
.sub{margin:-8px 0 16px;color:var(--mu);font-size:13.5px}
.mini{position:relative;overflow:hidden;background:#fff;flex:none}
.mini .sheet{position:absolute;left:0;top:0;width:794px!important;min-height:0;transform-origin:0 0;pointer-events:none;zoom:1!important;box-shadow:none;margin:0}
.tmn{aspect-ratio:1/.9;border-radius:10px;border:1px solid var(--ln);box-shadow:inset 0 -40px 30px -30px rgba(14,26,43,.14)}
.tile{padding:10px 10px 14px;gap:2px;transition:transform .18s,box-shadow .18s}.tile:hover{transform:translateY(-3px);box-shadow:0 2px 4px rgba(14,26,43,.06),0 22px 40px -18px rgba(14,26,43,.32)}
.tile b{margin-top:10px;font:600 14.5px/1.25 Inter;letter-spacing:-.01em}
.cpg{width:92px;height:122px;border-radius:7px;box-shadow:0 12px 24px #0008;transform:rotate(-3deg);border:1px solid #ffffff40}
.cont{align-items:center;padding:18px 18px 18px 22px}
.rmi{width:42px;height:56px;border-radius:6px;border:1px solid var(--ln);background:#fff}
.row{padding:10px 8px 10px 10px}
[data-t=dark] .tmn,[data-t=dark] .rmi{border-color:#ffffff22}
/* editor */
body:has(.ew){background:#E2E6EE}[data-t=dark] body:has(.ew){background:#060D18}
.ctx{display:flex;align-items:center;gap:10px;margin:2px 6px 4px}.tp{font:600 13px Inter;color:var(--tx);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sv{font:600 12px Inter;padding:5px 10px 5px 24px;border-radius:99px;background:var(--sf);border:1px solid var(--ln);color:var(--mu);position:relative}
.sv::before{content:'';position:absolute;left:10px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#2FA866;transition:.2s}.sv.w::before{background:#F2A900}
.zm{display:flex;border:1px solid var(--ln);border-radius:12px;overflow:hidden;background:var(--sf)}.zm button{width:40px;height:34px;border:0;background:none;font-size:18px;font-weight:500}.zm button+button{border-left:1px solid var(--ln)}
.hint{margin:2px 0 10px;font-size:12px}
.stage{background:transparent;padding:6px 0 10px;overflow-x:auto;align-items:flex-start;border-radius:0}
.stage .sheet{margin:0 auto;flex:none;box-shadow:0 1px 3px #0003,0 24px 50px -20px #0a1a3a88}
.ew{padding:10px 10px 150px}
/* backup */
.bkc{display:flex;gap:14px;align-items:center;justify-content:space-between;padding:16px;border-radius:16px;background:var(--sf2);margin-top:12px}
.bkc b{display:block;font-weight:600}.bkc small{display:block;color:var(--mu);margin-top:2px;line-height:1.4}.bkc .btn{flex:none;display:grid;place-items:center;cursor:pointer;min-width:92px}
@media print{body:has(.ew){background:#fff!important}.ctx{display:none!important}}
/* ---- dynamic report header: [logos] | title | [logos], columns set per document ---- */
.rh{display:grid;border:1px solid #111;min-height:18mm}
.rh>*+*{border-left:1px solid #111}
.rh .slot{padding:2mm}
.rt{display:flex;align-items:center;justify-content:center;text-align:center;padding:2mm 3mm;min-width:0}
.rt h2{font:700 12px/1.25 Lato,Arial,sans-serif;text-transform:uppercase;overflow-wrap:break-word;hyphens:none}
.stage [data-lgo]{cursor:pointer;transition:background .15s}.stage [data-lgo]:hover{background:#F2A90022}
.lgbtn{margin-left:auto;margin-right:8px;border:1px solid var(--ln);background:var(--sf2);color:var(--tx);border-radius:999px;font:600 12px Inter,sans-serif;padding:6px 12px;white-space:nowrap}
.lgbtn:hover{border-color:#F2A900}
/* ---- per-document logo panel ---- */
.lgp{position:fixed;inset:0;z-index:60}
.lgp .lgb{position:absolute;inset:0;background:#0006}
.lgs{position:absolute;left:0;right:0;bottom:0;max-width:560px;margin:0 auto;max-height:82vh;overflow:auto;background:var(--sf);color:var(--tx);border-radius:22px 22px 0 0;padding:16px 16px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px #0004}
.lgh{display:flex;justify-content:space-between;align-items:center}.lgh b{font:700 16px Inter,sans-serif}
.lgh button{border:0;background:none;color:var(--bl);font-weight:600;padding:6px 4px}[data-t=dark] .lgh button{color:#F2A900}
.lgn{color:var(--mu);font-size:13px;margin:6px 0 12px;line-height:1.4}
.lgr{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.lgc{width:84px;height:58px;border-radius:12px;border:1.5px solid var(--ln);background:#fff;display:grid;place-items:center;padding:6px;cursor:pointer}
.lgc img{max-width:100%;max-height:100%;object-fit:contain}
.lgc.sel{outline:2.5px solid #F2A900;outline-offset:-3px;background:#FFF7E0}
.lgc.up{background:var(--sf2);color:var(--mu);border-style:dashed;align-content:center;gap:0;text-align:center}.lgc.up span{font-size:20px;line-height:1}.lgc.up small{font-size:11px}
.lgx{background:var(--sf2);border-radius:16px;padding:14px;margin-bottom:12px;display:flex;flex-direction:column;gap:12px}
.lgx .btn[disabled]{opacity:.4}
.lgp h3{margin:6px 0 8px}
/* ---- logo library page ---- */
.libg{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;margin:8px 0 18px}
.libc{position:relative;background:#fff;border:1.5px solid var(--ln);border-radius:14px;aspect-ratio:1.5;display:grid;place-items:center;padding:12px;color:#555}
.libc img{max-width:100%;max-height:100%;object-fit:contain}
.libc small{position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:10px;color:#777}
.libc.up{background:var(--sf2);color:var(--mu);border-style:dashed;cursor:pointer;align-content:center;text-align:center}.libc.up span{font-size:24px;line-height:1}.libc.up small{position:static;font-size:12px}
.libx{position:absolute;top:4px;right:4px;width:26px;height:26px;border-radius:50%;border:0;background:#111;color:#fff;font-size:16px;line-height:1}
.logos .slot:only-child{justify-content:flex-start;padding-left:4mm}
/* ---- editable labels / row + field tools ---- */
.nx.dl{color:#D64545;flex:1}
.sheet [data-ed^="o:"]:empty{min-height:1.2em}
.sheet [data-ed^="o:"]:empty::after{content:"\200b"}
.sheet .addrow+.addrow{margin-left:8px}
/* ---- row delete handle (tap the red x at the end of a table row) + undo ---- */
#stage tr[data-rr]{position:relative}
#stage tr[data-rr]::after{content:"\00d7";position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:3px;width:30px;height:30px;border-radius:50%;background:#D64545;color:#fff;text-align:center;font:700 22px/29px Arial,sans-serif;cursor:pointer}
@media print{#stage tr[data-rr]::after{display:none}}
.toast{display:flex;align-items:center;gap:14px}.toast button{border:0;background:none;color:#F2A900;font-weight:700;padding:2px 4px}
.eh button[disabled],.lgbtn[disabled]{opacity:.4}
.eh span{display:flex;gap:6px}
/* transmittal: label column is the same width on every row, whatever the box spans (e.g. the full-width Location row) */
.st-trn .c .l{width:calc(72% / var(--sp,2));max-width:none}
/* name / signing rows are pinned to the bottom of the page */
.sheet .body{min-height:calc(297mm - 16mm)}
.sheet .bot{margin-top:auto;display:flex;flex-direction:column;gap:7px}

/* ===== elegant.css ===== */
/* Elegant layer: loads last. Public Sans throughout, ink-navy + amber, hairline structure, calm spacing. */
:root{
--font:'Public Sans',Inter,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
--bg:#F3F5F8;--sf:#fff;--sf2:#EFF2F6;--tx:#0B1424;--mu:#66748A;--ln:#E1E5EC;--ac:#F2A900;--bl:#1B4BD0;
--desk:#E4E8EF;--sh:0 1px 2px rgba(11,20,36,.04),0 12px 28px -14px rgba(11,20,36,.16)}
[data-t=dark]{--bg:#050A13;--sf:#0C1525;--sf2:#111D32;--tx:#ECF0F7;--mu:#8696B0;--ln:#192840;--desk:#03060C;
--sh:0 1px 0 #ffffff08 inset,0 18px 36px -18px #000d}

body,button,input,textarea,select{font-family:var(--font)}
body{font-size:15px;line-height:1.55;letter-spacing:-.005em;background:var(--bg);color:var(--tx)}
h1,h2,h3,.brand,.mark,.wm,.h1,.sec,.ci h2,.pane h3,#ttl,.tile b,.hero h1,.nav button,.sub,.empty{font-family:var(--font)}
:focus-visible{outline:2px solid var(--ac);outline-offset:3px;border-radius:8px}

/* ---- top bar ---- */
.top{gap:14px;padding:calc(10px + env(safe-area-inset-top)) 20px 10px;background:color-mix(in srgb,var(--bg) 80%,transparent);border-bottom:1px solid var(--ln);backdrop-filter:saturate(1.6) blur(22px)}
.bl{padding:4px 9px;border-radius:10px;border:1px solid var(--ln);box-shadow:none}.bl img{height:24px}
.wm{font:600 15px/1 var(--font);letter-spacing:-.01em;text-transform:none;color:var(--tx);display:flex;align-items:center}
.wm::before{content:'';width:1px;height:20px;background:var(--ln);margin:0 12px 0 2px}
.ib{width:40px;height:40px;border-radius:12px;border:1px solid var(--ln);background:var(--sf);box-shadow:none;transition:border-color .2s,background .2s}
.ib:hover{border-color:color-mix(in srgb,var(--tx) 28%,var(--ln))}
.ib.d{border-color:transparent;background:transparent}
.btn{min-height:42px;padding:0 18px;border-radius:11px;border:1px solid var(--ln);background:var(--sf);font:600 14px var(--font);letter-spacing:-.005em;box-shadow:none}
.btn.p{background:var(--ac);border-color:transparent;color:#1B1300;box-shadow:0 1px 0 #ffffff66 inset,0 10px 20px -12px rgba(242,169,0,.9)}
.btn.p:hover{filter:brightness(1.05)}

/* ---- home ---- */
.wrap{max-width:1180px;padding:36px 28px 140px}
.h1{font:700 40px/1.05 var(--font);letter-spacing:-.04em;margin:4px 0 8px}
.h1.s{font:700 19px/1 var(--font);letter-spacing:-.02em;margin:0}
.sub{margin:0 0 24px;color:var(--mu);font-size:14px}
input,textarea,select{font-family:var(--font);min-height:44px;border-radius:11px;background:var(--sf2);border:1px solid var(--ln);color:var(--tx)}
input:focus,textarea:focus,select:focus{outline:0;border-color:var(--ac);box-shadow:0 0 0 4px color-mix(in srgb,var(--ac) 22%,transparent)}
.search{max-width:none;height:50px;padding:0 18px;border-radius:13px;background:var(--sf);box-shadow:none;font-size:14.5px}
.cont{max-width:none;margin-top:22px;padding:22px 28px;gap:24px;border-radius:20px;position:relative;overflow:hidden;color:#fff;
 background:linear-gradient(135deg,#102A52 0%,#0A1A36 62%,#081327 100%);border:1px solid #ffffff14;box-shadow:0 28px 50px -30px rgba(8,18,40,.8)}
.cont::before{content:'';position:absolute;left:0;top:24px;bottom:24px;width:3px;border-radius:0 3px 3px 0;background:var(--ac)}
.cpg{border-radius:6px;transform:rotate(-2deg);box-shadow:0 16px 30px -10px #0009;border:0}
.ci small{font:600 12.5px var(--font);letter-spacing:0;text-transform:none;color:#F4BC3F}
.ci h2{font:700 26px/1.15 var(--font);letter-spacing:-.03em;margin:6px 0 4px;color:#fff}
.ci p{color:#A8B6CD;font-size:13.5px;margin:0 0 16px}
.sec{font:700 18px/1.2 var(--font);letter-spacing:-.025em;margin:42px 0 16px}
.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tile{padding:8px 8px 16px;gap:2px;border-radius:16px;background:var(--sf);border:1px solid var(--ln);box-shadow:none;transition:border-color .2s,box-shadow .2s}
.tile:hover{transform:none;border-color:color-mix(in srgb,var(--ac) 65%,var(--ln));box-shadow:var(--sh)}
.tile:active{transform:scale(.985)}
.tmn{border-radius:10px;border:1px solid var(--ln);box-shadow:none}
.tile b{margin-top:12px;padding:0 6px;font:600 14.5px/1.3 var(--font);letter-spacing:-.015em}
.tile span{padding:0 6px;font-size:12.5px;line-height:1.45;color:var(--mu)}
.row{padding:10px;gap:14px;border-radius:14px;background:var(--sf);border:1px solid var(--ln);box-shadow:none;transition:border-color .2s}
.row:hover{border-color:color-mix(in srgb,var(--tx) 24%,var(--ln))}
.rmi{border-radius:5px}
.rt b{font:600 14.5px var(--font);letter-spacing:-.012em}.rt small{font-size:12.5px;color:var(--mu)}
.empty{border-radius:14px;font-size:14px}
@media(min-width:640px){.grid{grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:16px}.h1{font-size:46px}}

/* ---- navigation: floating bar on phones, slim rail on desktop ---- */
.nav{left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));max-width:440px;margin:0 auto;padding:6px;gap:2px;
 border:1px solid var(--ln);border-radius:22px;background:color-mix(in srgb,var(--sf) 95%,transparent);backdrop-filter:blur(22px) saturate(1.6);box-shadow:0 20px 44px -20px rgba(11,20,36,.4)}
.nav button{position:relative;flex:1;width:auto;height:50px;border-radius:16px;font:600 11px var(--font);letter-spacing:0;color:var(--mu);transition:background .2s,color .2s}
.nav button.on{color:var(--tx);background:var(--sf2)}
[data-t=dark] .nav button.on{color:var(--ac);background:#F2A9001A}
@media(min-width:900px){
 .nav{top:0;bottom:0;left:0;right:auto;width:88px;max-width:none;margin:0;padding:92px 12px 0;gap:6px;border:0;border-right:1px solid var(--ln);border-radius:0;background:color-mix(in srgb,var(--bg) 72%,transparent);box-shadow:none;flex-direction:column;align-items:center;justify-content:flex-start}
 .nav button{flex:none;width:64px;height:60px}
 .nav button.on::before{content:'';position:absolute;left:-12px;top:16px;bottom:16px;width:3px;border-radius:0 3px 3px 0;background:var(--ac)}
}

/* ---- editor ---- */
body:has(.ew){background:var(--desk)}
#ttl{font:700 17px var(--font);letter-spacing:-.02em}
.ctx{gap:8px;margin:6px 4px 8px}
.tp{font:600 13px var(--font);letter-spacing:-.01em}
.lgbtn{margin:0;padding:7px 13px;border-radius:10px;background:var(--sf);border:1px solid var(--ln);font:600 12.5px var(--font)}
.lgbtn:hover{border-color:color-mix(in srgb,var(--ac) 70%,var(--ln))}
.sv{background:transparent;border:0;padding:5px 4px 5px 18px;font:600 12.5px var(--font)}.sv::before{left:4px}
.zm{border-radius:10px;border:1px solid var(--ln)}.zm button{color:var(--tx)}
.hint{color:var(--mu);font-size:12.5px}
.stage .sheet{box-shadow:0 1px 2px #0003,0 34px 64px -30px rgba(8,16,36,.6)}
.etb{border:1px solid var(--ln);border-bottom:0;border-radius:22px 22px 0 0;box-shadow:0 -18px 44px -18px #0005}
.ab,.nx{border-radius:12px;font-family:var(--font);border-color:var(--ln)}
.eh small{font-family:var(--font);letter-spacing:0}
.nx.dk{background:var(--ac);color:#1B1300}

/* ---- logo panel, library, backup ---- */
.pane{padding:24px;border-radius:18px;background:var(--sf);border:1px solid var(--ln);box-shadow:none}
.pane h3{font:700 16px var(--font);letter-spacing:-.02em}
.lead{font-size:14px;line-height:1.6;max-width:62ch}
.bkc{border-radius:14px;background:var(--sf2);border:1px solid var(--ln)}
.libc,.lgc{border-radius:12px}
.lgs{border-radius:22px 22px 0 0}
.toast{border-radius:12px;font:500 14px var(--font)}

/* ---- report sheets: same family on screen as the app ---- */
.sheet,.sheet *{font-family:var(--font)!important;letter-spacing:0}
.sheet{line-height:1.35}
@media print{.sheet,.sheet *{font-family:var(--font)!important}}
.sheet .bx{display:inline-flex;align-items:center;justify-content:center;line-height:1;font-size:12px;padding:0}
.sheet .o{vertical-align:middle}

/* ================= v15: true-black dark mode ================= */
[data-t=dark]{--bg:#000;--sf:#0B0B0C;--sf2:#151517;--tx:#F4F4F5;--mu:#8F8F96;--ln:#242427;--desk:#000;
--sh:0 1px 0 #ffffff0a inset,0 18px 36px -18px #000}
html{background:var(--bg)}
[data-t=dark] body:has(.ew){background:#000}
[data-t=dark] .cont{background:linear-gradient(135deg,#1C1C1F 0%,#0E0E10 62%,#070708 100%);border-color:#ffffff14;box-shadow:0 28px 50px -30px #000}
[data-t=dark] .top{background:color-mix(in srgb,#000 82%,transparent)}
[data-t=dark] .nav{background:color-mix(in srgb,#0B0B0C 94%,transparent)}
[data-t=dark] .etb,[data-t=dark] .lgs{background:#0B0B0C}
[data-t=dark] .lgc.up{background:var(--sf2)}

/* ================= v15: Recent = slideable tiles ================= */

/* ================= v15: bold / size controls + signatures ================= */
.ab.fb b{font:800 18px/1 var(--font)}
.fsv{flex:1.2}
.nx[disabled]{opacity:.35}
.fhn{display:block;margin:6px 2px 0;color:var(--mu);font-size:12px}
.nx.sgb{flex:1}
.sheet .sgi{position:relative;align-self:stretch}
.sheet .sgi::before{content:'';position:absolute;left:2px;right:2px;top:50%;height:calc(var(--sgh,100) * 1%);transform:translateY(-50%);background:var(--sg) var(--sgp,left) center/contain no-repeat;pointer-events:none}
.sheet .sl .ln.sgi{min-height:14mm}
.sheet .bxs .br:has(.sgi){min-height:18mm}
.sgp0{background:#fff;border-radius:14px;border:1px solid var(--ln);padding:10px;margin:0 0 12px;display:grid;place-items:center;height:96px}
.sgp0 img{max-width:100%;max-height:100%;object-fit:contain}
.sgc{position:relative;padding:0;width:96px}
.sgc>button:first-child{border:0;background:none;width:100%;height:100%;display:grid;place-items:center;padding:6px;cursor:pointer}
.sgc img{max-width:100%;max-height:100%;object-fit:contain}

/* ===== workspace.css ===== */
/* ===== v16: visible signature rows, Files folders, PDF preview, send sheet ===== */
.sheet .sgr{min-height:20mm!important}
.sheet .sgr .v,.sheet .sgr .ln{min-height:16mm}
.sheet .bxs .br.sgr{background:linear-gradient(#c9c9c9,#c9c9c9) 8px calc(100% - 8px)/calc(100% - 16px) 1px no-repeat}
.sheet .sxg>div.sgr{background:linear-gradient(#d4d4d4,#d4d4d4) 6px calc(100% - 7px)/calc(100% - 12px) 1px no-repeat}
.sheet .sl>div.sgr .ln{min-height:16mm}

.fgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.ftile{min-height:132px;padding:16px;justify-content:flex-start;gap:4px}
.ftile .fi{color:var(--ac);display:block;margin-bottom:8px}
.ftile .fi svg{display:block}
.ftile b{font-size:15px;line-height:1.25;overflow-wrap:anywhere}
.ftile span:last-child{font-size:13px;color:var(--mu)}
.ftile.fnew{border-style:dashed;align-items:flex-start}
.ftile .fi.plus{font:300 30px/30px var(--font);width:30px;height:30px;text-align:center}
.frow{align-items:center}
.frow .fic{flex:none;width:40px;height:40px;border-radius:12px;background:var(--sf2);display:grid;place-items:center;color:var(--ac)}
.frow .fmeta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.frow .fmeta b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.pvw{padding-bottom:110px}
.pvs{display:flex;flex-direction:column;align-items:center;gap:6px;max-width:820px;margin:0 auto}
.pvp{display:block;background:#fff;border-radius:6px;border:1px solid var(--ln);box-shadow:var(--sh);max-width:100%}
.pvn{font-size:12px;color:var(--mu);margin:0 0 14px}
.pvbar{position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));max-width:560px;margin:0 auto;display:flex;gap:8px;padding:8px;background:var(--sf);border:1px solid var(--ln);border-radius:18px;box-shadow:var(--sh);z-index:20}
.pvbar .btn{flex:1}.pvbar .btn.p{flex:1.4}

.snd{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.55);display:flex;align-items:flex-end;justify-content:center}
.snb{background:var(--sf);color:var(--tx);width:100%;max-width:520px;max-height:92vh;overflow:auto;border-radius:22px 22px 0 0;padding:10px 16px calc(18px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px}
.sgrip{width:38px;height:4px;border-radius:2px;background:var(--ln);margin:0 auto 2px}
.sfile{display:flex;gap:12px;align-items:center}.sfile small{display:block;color:var(--mu);font-size:12px}
.sfi{width:40px;height:40px;border-radius:10px;background:var(--ac);color:#1B1300;font:700 12px var(--font);display:grid;place-items:center}
.sgo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sbt{min-height:56px;border-radius:14px;border:1px solid var(--ln);font:600 15px var(--font);display:flex;align-items:center;justify-content:center}
.sbt.wa{background:#E6F7EC;color:#0F6B35;border-color:#A8DDBC}.sbt.em{background:#E6F0FC;color:#1F4FD8;border-color:#B2CCF3}
[data-t=dark] .sbt.wa{background:#0F2A1A;color:#7BE0A4;border-color:#1F5A35}[data-t=dark] .sbt.em{background:#10223A;color:#8FC1FF;border-color:#244A7A}
.sfl{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600}.sfl small{font-weight:400;color:var(--mu)}
.sfl input,.sfl textarea{font:400 15px var(--font);color:var(--tx);background:var(--bg);border:1px solid var(--ln);border-radius:12px;padding:10px 12px;width:100%;resize:vertical}
.snote{margin:0;font-size:12px;color:var(--mu);line-height:1.5}

.fact{display:flex;gap:8px;margin:-10px 0 14px}.lgbtn.dn{color:#D64545}

/* ===== v17: larger, brighter logo; Workspace label closer ===== */
.brand{gap:2px!important}
.brand .bl,.bl{background:#fff!important;border:1px solid #fff!important;border-radius:12px;padding:7px 14px!important;box-shadow:0 1px 10px rgba(255,255,255,.18),0 2px 8px rgba(0,0,0,.25)!important}
.brand .bl img,.bl img{height:34px!important;width:auto;filter:contrast(1.12) saturate(1.1)}
.wm::before{margin:0 8px 0 0!important}
@media(max-width:600px){.brand .bl img,.bl img{height:30px!important}.bl{padding:6px 12px!important}}

/* ===== v25: send dialog tabs, taller auto-sizing message, message settings ===== */
.stabs{display:flex;gap:4px;padding:4px;background:var(--bg);border:1px solid var(--ln);border-radius:14px}
.stabs button{flex:1;border:0;background:transparent;color:var(--mu);font:600 14px var(--font);padding:10px 8px;border-radius:10px;cursor:pointer}
.stabs button.on{background:var(--sf);color:var(--tx);box-shadow:0 1px 6px rgba(0,0,0,.25)}
.spn{display:flex;flex-direction:column;gap:12px}.spn[hidden]{display:none}
.spn .sbt{width:100%;min-height:48px}
.sfl textarea{line-height:1.5;min-height:150px;resize:vertical;overflow:auto}
.mrs{align-self:flex-start;background:none;border:0;color:var(--ac);font:600 13px var(--font);padding:2px 0;cursor:pointer}
.mph{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 8px}
.mchip{font:600 13px ui-monospace,Menlo,Consolas,monospace;color:var(--tx);background:var(--sf2);border:1px solid var(--ln);border-radius:999px;padding:8px 12px;cursor:pointer}
.pane .sfl{margin:12px 0}.pane .sfl textarea{min-height:170px}

/* v26: instant theme switch - no colour fades while the theme changes */
.nt,.nt *,.nt *::before,.nt *::after{transition:none!important;animation:none!important}
.bl img{image-rendering:auto;transform:translateZ(0)}

/* ===== mix.css ===== */
/* ===== v28 "Field Mix": rounded, roomy controls + warm paper and amber. Loads before mobile.css. ===== */
:root{--bg:#FFFFFF;--sf:#fff;--sf2:#F4F5F7;--tx:#111317;--mu:#5C616B;--ln:#E3E6EB;--ac:#F2A900;--bl:#111317;--desk:#ECEEF1;--rc:20px;--rb:16px;
--sh:0 1px 2px rgba(17,19,23,.05),0 14px 30px -16px rgba(17,19,23,.18)}
[data-t=dark]{--bg:#000;--sf:#111113;--sf2:#1A1A1D;--tx:#F5F5F6;--mu:#9A9AA2;--ln:#26262A;--ac:#FFB81C;--bl:#FFB81C;--desk:#000;
--sh:0 1px 0 #ffffff0a inset,0 18px 36px -18px #000}
html,body{background:var(--bg)}
body:has(.ew){background:var(--desk)}[data-t=dark] body:has(.ew){background:#000}
[data-t=dark] .top{background:color-mix(in srgb,#000 82%,transparent)}
[data-t=dark] .nav{background:color-mix(in srgb,#111113 94%,transparent)}
[data-t=dark] .etb,[data-t=dark] .lgs{background:#111113}

/* controls */
.btn,.nx,.ab{border-radius:var(--rb)}.btn{min-height:48px}
.btn.p,.nx.dk{background:var(--ac);color:#16130E}
.ib{width:44px;height:44px;border-radius:var(--rb)}
.ib.av{font:800 13px var(--font);letter-spacing:.02em;color:var(--tx);background:var(--sf2);border-color:transparent}
.ib.av svg{display:block}
input,textarea,select{min-height:48px;border-radius:14px}
.ab.on,.al button.on{background:var(--ac);color:#16130E}
.eh button,.lgh button{color:var(--tx)}
.etb,.lgs,.snb{border-radius:26px 26px 0 0}

/* home */
.h1{font:800 36px/1.05 var(--font);letter-spacing:-.04em}
.sub{font-size:14px}
.search{height:54px;border-radius:var(--rc)}
.sec{font:700 12px/1 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--mu);margin:34px 0 12px}
.tile,.row,.pane,.bkc,.empty{border-radius:var(--rc)}
.tile{padding:10px 10px 16px}.tmn{border-radius:14px}
.pane{padding:20px}
.tile b{font-weight:700}

/* the whole Continue bar is one big button */
html[data-t] .cont{background:var(--ac);color:#16130E;border:0;border-radius:var(--rc);cursor:pointer;box-shadow:0 18px 36px -22px rgba(242,169,0,.85);transition:transform .15s}
html[data-t] .cont::before{display:none}
.cont:active{transform:scale(.99)}
.cont:focus-visible{outline:3px solid var(--tx);outline-offset:3px}
html[data-t] .ci small{color:#16130E;font-weight:800;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
html[data-t] .ci h2{color:#16130E}
html[data-t] .ci p{color:rgba(22,19,14,.8)}
html[data-t] .cont .btn.p{background:#16130E;color:var(--ac);box-shadow:none;border:0;pointer-events:none}

/* bottom bar */
.nav{border-radius:28px}
.nav button{border-radius:22px}
.nav button.on{color:var(--tx);background:color-mix(in srgb,var(--ac) 24%,transparent)}
[data-t=dark] .nav button.on{color:var(--ac);background:#FFB81C1F}

/* settings */
.stk{display:flex;flex-direction:column;gap:14px;max-width:640px;margin:0 auto;width:100%}
.stk .pane{margin:0}
.stk .pane .sfl{margin:0 0 12px}
.stk .pane h3{margin-bottom:8px}
.seg{display:flex;gap:4px;padding:4px;background:var(--sf2);border:1px solid var(--ln);border-radius:var(--rb);margin-top:10px}
.seg button{flex:1;min-height:46px;border:0;background:transparent;border-radius:12px;font:600 14px var(--font);color:var(--mu)}
.seg button.on{background:var(--sf);color:var(--tx);box-shadow:var(--sh)}
.stk .bkc{margin-top:10px}

/* ===== v30: premium logo pill ===== */
.brand{gap:12px!important}
.brand .bl,.bl{background:linear-gradient(180deg,#FFFFFF 0%,#F6F2E8 100%)!important;border:0!important;border-radius:999px!important;padding:8px 20px!important;
 box-shadow:0 0 0 1px rgba(242,169,0,.55),0 0 0 5px rgba(242,169,0,.10),inset 0 1px 0 #fff,inset 0 -1px 0 rgba(22,19,14,.07),0 12px 26px -12px rgba(22,19,14,.5)!important;
 transition:box-shadow .25s,transform .2s}
.brand:hover .bl{box-shadow:0 0 0 1px rgba(242,169,0,.8),0 0 0 6px rgba(242,169,0,.16),inset 0 1px 0 #fff,inset 0 -1px 0 rgba(22,19,14,.07),0 14px 30px -12px rgba(22,19,14,.55)!important}
.brand:active .bl{transform:scale(.98)}
.brand .bl img,.bl img{height:30px!important;filter:contrast(1.08) saturate(1.05)}
.wm{font:700 10.5px/1 var(--font)!important;letter-spacing:.22em;text-transform:uppercase!important;color:var(--mu)}
.wm::before{width:5px!important;height:5px!important;border-radius:50%;background:var(--ac)!important;margin:0 10px 0 0!important}
@media(max-width:600px){.brand .bl,.bl{padding:7px 16px!important}.brand .bl img,.bl img{height:26px!important}}
@media(max-width:380px){.wm{display:none}}

/* ===== v31: Files, Send sheet and editor header, as in the mockups ===== */
/* Files: amber folder tab cards, dashed "New project" card */
.fgrid{gap:12px}
.ftile{min-height:124px;padding:16px;border-radius:var(--rc);gap:4px}
.ftile .fi:not(.plus){width:30px;height:22px;border-radius:5px 6px 6px 6px;background:var(--ac);position:relative;margin:6px 0 10px}
.ftile .fi:not(.plus)::before{content:'';position:absolute;left:0;top:-5px;width:14px;height:7px;border-radius:5px 5px 0 0;background:var(--ac)}
.ftile .fi:not(.plus) svg{display:none}
.ftile b{font-size:15px;line-height:1.25}
.ftile.fnew{align-items:center;justify-content:center;text-align:center;gap:2px;background:transparent}
.ftile .fi.plus{margin:0;color:var(--mu)}
.frow{border-radius:var(--rc);padding:12px}
.frow .fic{border-radius:14px;background:color-mix(in srgb,var(--ac) 22%,transparent)}
.fact .lgbtn{min-height:40px;padding:0 16px}

/* Send sheet: file chip, segmented tabs, solid send buttons */
.snb{border-radius:26px 26px 0 0;gap:14px;padding:12px 18px calc(22px + env(safe-area-inset-bottom))}
.sfi{width:46px;height:46px;border-radius:var(--rb);background:var(--ac);color:#16130E;font-weight:800}
.sfile b{font-size:15px}
.stabs{border-radius:var(--rb);padding:4px}
.stabs button{border-radius:12px;min-height:44px}
.stabs button.on{background:var(--sf);color:var(--tx);box-shadow:var(--sh)}
.sfl{font-size:12.5px;font-weight:700;color:var(--tx)}
.sfl input,.sfl textarea{border-radius:14px;background:var(--bg)}
.sbt{min-height:54px;border-radius:var(--rb);font-size:15px;font-weight:700;border:0}
.sbt.wa,[data-t=dark] .sbt.wa{background:#1FA855;color:#fff;border:0}
.sbt.em,[data-t=dark] .sbt.em{background:var(--tx);color:var(--bg);border:0}
.snb>.btn{min-height:48px}

/* Editor header: status on the left, tools on the right */
.ctx{margin:4px 2px 8px;gap:8px;flex-wrap:wrap;justify-content:space-between}
.cx1{display:flex;align-items:center;gap:8px;flex:1 1 220px;min-width:0}
.cx2{display:flex;align-items:center;gap:8px;flex:none}
.cx1 .tp{font-weight:500;color:var(--mu);font-size:12.5px}
.sv{flex:none;background:transparent;border:0;color:var(--tx)}
.lgbtn{min-height:40px;border-radius:var(--rb)}
.zm{border-radius:var(--rb)}.zm button{height:40px}

/* ===== v32: automatic backup ===== */
.tgl{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;margin:0;border-bottom:1px solid var(--ln)}
.tgl b{font-weight:700;font-size:14.5px}.tgl small{display:block;color:var(--mu);font-size:12.5px;font-weight:400;margin-top:2px}
.tgl input{flex:none;width:26px;height:26px;min-height:0;accent-color:#F2A900}
.stk .pane .sfl small{display:block;font-weight:400;color:var(--mu)}
.stk .pane>.btn{margin:0 0 12px}
.bkbn{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin:0 0 14px;padding:14px 16px;border-radius:var(--rc);border:1px solid color-mix(in srgb,var(--ac) 55%,var(--ln));background:color-mix(in srgb,var(--ac) 14%,var(--sf));color:var(--tx)}
.bkbn span{flex:1;min-width:0}.bkbn b{display:block;font-size:14.5px}.bkbn small{display:block;color:var(--mu);font-size:12.5px;margin-top:2px}
.bkbn i{font-style:normal;flex:none;background:var(--ac);color:#16130E;font-weight:700;font-size:13px;padding:10px 14px;border-radius:var(--rb)}

/* ===== mobile.css ===== */
/* ===== v27: phone pass. Loads last. ===== */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}

/* the top bar already adds the safe-area gap; body no longer adds it a second time */
body{padding-top:0}

/* ---- editor sheet: true A4 layout, scaled with transform (matches the PDF exactly) ---- */
.wrap.ew{padding:8px 8px 170px}
body:has(.etb.show) .wrap.ew{padding-bottom:340px}
.stage{padding:6px 12px 10px;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch}
.shw{position:relative;flex:none;margin:0 auto}
.shw .sheet{position:absolute;left:0;top:0;margin:0!important;zoom:1!important;transform-origin:0 0}
/* red row-delete handle keeps a finger-sized target whatever the scale is */
#stage tr[data-rr]::after{width:calc(24px/var(--k,1));height:calc(24px/var(--k,1));margin-left:calc(3px/var(--k,1));font:700 calc(18px/var(--k,1))/calc(23px/var(--k,1)) Arial,sans-serif}
/* table headings never run into the next column */
.sheet .tb th,.sheet .rl{overflow-wrap:anywhere;word-break:normal;hyphens:manual}

/* ---- phones ---- */
@media(max-width:600px){
 .wrap{padding:22px 16px 130px}
 .cont{padding:16px 16px 16px 18px;gap:16px}
 .ctx{flex-wrap:wrap;row-gap:8px}.cx1{flex:1 1 100%}.cx2{margin-left:0;width:100%;justify-content:space-between}
 .h1{font-size:34px}
}
.ci{min-width:0}.ci h2{overflow-wrap:anywhere}

/* iOS zooms the whole page when a field under 16px gets focus */
@media(max-width:900px){input,textarea,select,.search,.sfl input,.sfl textarea{font-size:16px}}

/* touch screens have no hover: stop highlights sticking after a tap */
@media(hover:none){
 .tile:hover{transform:none;box-shadow:none;border-color:var(--ln)}
 .row:hover,.ib:hover,.lgbtn:hover{border-color:var(--ln)}
 .sheet [data-ed]:hover{background:none;outline:0}
 .sheet .rc:hover,.sheet .cki:hover,.stage [data-lgo]:hover{background:none}
 .slot-ed label:hover{border-color:var(--ln);background:var(--sf2)}
}

/* messages sit above the bottom bar; sheets respect the real phone viewport */
.toast{bottom:calc(92px + env(safe-area-inset-bottom));max-width:calc(100vw - 24px)}
@supports(height:100dvh){.snb{max-height:92dvh}.lgs{max-height:82dvh}}

@media print{
 .shw{width:auto!important;height:auto!important;margin:0}
 .shw .sheet{position:static!important;transform:none!important}
}

/* v37: flat plate logo */
.brand.bp{display:flex!important;align-items:center;gap:12px!important;background:#fff;border:1px solid rgba(22,19,14,.14);border-radius:8px;padding:6px 12px;cursor:pointer;transition:border-color .2s,transform .15s}
.brand.bp:hover{border-color:rgba(242,169,0,.85)}.brand.bp:active{transform:scale(.98)}
.brand.bp .bpi{height:30px;width:auto;display:block}
.brand.bp .bpv{width:1px;height:22px;background:rgba(22,19,14,.18);flex:none}
.brand.bp .bpw{font:600 12px/1 var(--font);letter-spacing:.02em;color:#16130E}
@media(max-width:600px){.brand.bp{padding:5px 9px;gap:9px!important}.brand.bp .bpi{height:24px}.brand.bp .bpv{height:18px}.brand.bp .bpw{font-size:11px}}
@media(max-width:380px){.brand.bp .bpv,.brand.bp .bpw{display:none}}

/* v38: edit bar stays put when the page is pinch-zoomed */
.etb{transform-origin:50% 100%;transform:translate(var(--vx,0px),calc(var(--vy,0px) + 115%)) scale(var(--vs,1))}
.etb.show{transform:translate(var(--vx,0px),var(--vy,0px)) scale(var(--vs,1))}
.etb.vz{transition:none}

/* v40: bottom menu docked to the very bottom edge on phones and tablets */
@media(max-width:899px){
 .nav{left:0!important;right:0!important;bottom:0!important;max-width:none!important;width:100%;margin:0!important;border-radius:0!important;border:0!important;border-top:1px solid var(--ln)!important;
  padding:6px 10px calc(6px + env(safe-area-inset-bottom))!important;background:var(--sf)!important;backdrop-filter:none!important;box-shadow:0 -6px 20px -14px rgba(0,0,0,.25)!important;justify-content:space-around}
 .nav button{border-radius:16px!important}
 .wrap:not(.ew){padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
}

/* v44: global header rows, avatar picture, profile editor */
.top{flex-direction:column!important;align-items:stretch!important;gap:8px!important}
.top .tr1,.top .tr2{display:flex;align-items:center;gap:10px;min-width:0}
.top .tr1 .sp{display:block!important;flex:1 1 auto}
.top .tr2 #ttl{flex:1 1 auto;min-width:0}
.ib.av{overflow:hidden;padding:0;flex:none}
.ib.av img{width:100%;height:100%;object-fit:cover;display:block}
#thm{flex:none}
.mev{display:flex;align-items:center;gap:14px;margin:4px 0 14px}
.mea{width:72px;height:72px;border-radius:50%;overflow:hidden;background:var(--sf2);border:1px solid var(--ln);display:grid;place-items:center;font:800 24px var(--font);color:var(--tx);flex:none}
.mea img{width:100%;height:100%;object-fit:cover;display:block}
.mea svg{width:30px;height:30px}
.mei{display:flex;flex-direction:column;gap:6px;align-items:flex-start;min-width:0}
.mei b{font-size:17px}.mei span{color:var(--mu);font-size:14px;overflow-wrap:anywhere}
.mea2{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.mea2 .btn,.mei .btn{display:inline-flex;align-items:center;gap:8px}
@media(max-width:600px){.top{padding-top:calc(8px + env(safe-area-inset-top))!important}}

/* Zoom lock: only documents/reports (html.zk) may be pinch-zoomed; all other pages stay at 1x */
html:not(.zk),html:not(.zk) body{touch-action:pan-x pan-y}

/* v48: home quick actions, attention strip, filter chips, pinned documents */
.qa{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 14px}
.qb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:76px;padding:10px 4px;border-radius:var(--rc,14px);border:1px solid var(--ln);background:var(--sf);color:var(--tx);font:600 12px/1.15 var(--font);text-align:center;min-width:0}
.qb svg{flex:none;display:block}.qb:active{transform:scale(.97)}
.bkbn.att{margin-top:0}
.chips{display:flex;gap:8px;overflow-x:auto;margin:12px 0 0;padding:2px 0 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.chips::-webkit-scrollbar{display:none}
.chip{flex:none;height:36px;padding:0 15px;border-radius:999px;border:1px solid var(--ln);background:var(--sf);color:var(--tx);font:600 13px/1 var(--font);white-space:nowrap}
.chip small{margin-left:7px;opacity:.65;font-weight:700}
.chip.on{background:var(--tx);color:var(--bg);border-color:var(--tx)}
@media(max-width:380px){.qb{font-size:11px;min-height:70px}}

/* v51: compact, grouped template tiles (Forms / Reports / Timesheets) */

/* v52: edit bar is collapsed on phones and tablets until "More" is tapped */
.mbx{display:none}
@media(max-width:899px){
 .mbx{display:inline-block!important}
 .etb.cl{padding-top:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}
 .etb.cl .er:not(.er0),.etb.cl .fhn,.etb.cl .er0 .ab{display:none!important}
 .etb.cl .er0{margin-top:4px}
 .etb.cl .er0 .nx{height:40px}
 .etb.cl .eh{min-height:24px}
 body:has(.etb.show.cl) .wrap.ew{padding-bottom:120px}
}

/* v53: signature library with a default signature */
.sgl{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px}
.sgcard{display:flex;flex-direction:column;gap:10px;padding:10px;border:1px solid var(--ln);border-radius:14px;background:var(--sf);min-width:0}
.sgcard.isdef{border-color:var(--ac);box-shadow:0 0 0 1px var(--ac) inset}
.sgpv{height:80px;display:grid;place-items:center;padding:8px;border-radius:10px;border:1px solid var(--ln);background:#fff}
.sgpv img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.sgmeta{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.sgmeta b{font:600 13.5px/1.2 var(--font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.dfb2{flex:none;padding:3px 9px;border-radius:999px;background:var(--ac);color:#16130E;font:700 10.5px/1.2 var(--font);letter-spacing:.03em;text-transform:uppercase}
.sgact{display:flex;flex-wrap:wrap;gap:6px}.sgact .lgbtn{flex:1 1 auto;margin:0;white-space:nowrap}
.sgcard.up{align-items:center;justify-content:center;text-align:center;gap:4px;min-height:112px;border-style:dashed;cursor:pointer}
.sgcard.up span{font-size:30px;line-height:1;color:var(--mu)}.sgcard.up b{font:600 13.5px var(--font)}.sgcard.up small{color:var(--mu);font-size:12px}
.sgauto{display:flex;gap:12px;align-items:flex-start;margin-top:16px;padding:14px;border:1px solid var(--ln);border-radius:14px;cursor:pointer}
.sgauto input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--ac)}
.sgauto b{display:block;font:600 14px/1.3 var(--font)}.sgauto small{display:block;margin-top:3px;color:var(--mu);font-size:12.5px;line-height:1.45}
/* inside the signature panel */
.lgr:has(.sgc){row-gap:24px}
.sgc{overflow:visible!important}.sgc.isdef{border-color:var(--ac)!important;box-shadow:0 0 0 1px var(--ac)}
.sgdf{position:absolute;left:4px;top:4px;width:28px;height:28px;padding:0;border-radius:50%;border:1px solid var(--ln);background:#fff;color:#b4b4b4;font-size:15px;line-height:1;display:grid;place-items:center;z-index:2}
.sgdf.on{color:#F2A900;border-color:#F2A900}
.sgc .dfl{position:absolute;left:0;right:0;bottom:-18px;text-align:center;font:700 10px/1 var(--font);font-style:normal;letter-spacing:.04em;text-transform:uppercase;color:var(--mu)}
.nx.dfb{background:var(--ac);color:#16130E;border-color:transparent}

/* v53: header icon buttons never shrink or squash; WORKSPACE label in capitals */
.brand.bp .bpw{text-transform:uppercase;letter-spacing:.12em;white-space:nowrap;font-weight:700}
.brand.bp{flex:none;min-width:0}
.top .ib{flex:0 0 auto!important;width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;padding:0;box-sizing:border-box}
.top .ib.d{width:40px!important;min-width:40px!important;height:40px!important;min-height:40px!important}
.top .ib svg{flex:none;display:block}
.top .tr2 .h1.s{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top .tr2 .btn{flex:none;white-space:nowrap}
@media(max-width:600px){.brand.bp .bpw{font-size:10px;letter-spacing:.1em}}
.lgr:has(.sgc){padding-bottom:22px}

/* =====================================================================
   HOME: New document + Pinned + Recent
   One shared row design (.drow) so every list on Home looks and behaves
   the same: page thumbnail, title, small meta, one clear action.
   ===================================================================== */
.shd{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:36px 0 14px}
.shd .sec{margin:0;font:700 20px/1.15 var(--font);letter-spacing:-.025em;text-transform:none;color:var(--tx)}
.shs{margin:4px 0 0;color:var(--mu);font-size:13px;line-height:1.35}
.shr{flex:none;padding-bottom:3px;color:var(--mu);font:600 12.5px/1 var(--font);white-space:nowrap}

/* group label above each list of templates */
.dgl{display:flex;align-items:center;gap:8px;margin:18px 2px 8px;color:var(--mu);font:700 11.5px/1 var(--font);letter-spacing:.09em;text-transform:uppercase}
#ngrid>.dgl:first-child{margin-top:0}
.dgl em{font:700 11px/1 var(--font);font-style:normal;letter-spacing:0;padding:3px 7px;border-radius:999px;background:var(--sf2);border:1px solid var(--ln)}

/* the list container: one rounded panel on phones, separate cards on wide screens */
.dlist{background:var(--sf);border:1px solid var(--ln);border-radius:var(--rc);box-shadow:var(--sh);overflow:hidden}
.dlist>.empty{margin:0;border:0;border-radius:0;background:transparent}

/* the row */
.drow{position:relative;display:flex;align-items:center;gap:14px;width:100%;min-height:96px;margin:0;padding:12px 14px;border:0;border-bottom:1px solid var(--ln);border-radius:0;background:transparent;color:var(--tx);text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,opacity .2s}
.drow.lv,.dlist>.drow:last-child{border-bottom:0}
.drow:active{background:var(--sf2);transform:none}
.drow:focus-visible{outline:2px solid var(--ac);outline-offset:-2px}
@media(hover:hover){.drow:hover{background:var(--sf2)}}

/* page thumbnail */
.drow .dth{flex:none;width:56px;aspect-ratio:1/1.3;border-radius:8px;border:1px solid var(--ln);box-shadow:none;background:#fff}
[data-t=dark] .drow .dth{border-color:#ffffff26}

/* text */
.dtx{flex:1;min-width:0;display:block}
.dtx b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font:600 15px/1.3 var(--font);letter-spacing:-.01em;color:var(--tx);overflow-wrap:anywhere}
.dmeta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;margin-top:6px;color:var(--mu);font-size:12.5px;line-height:1.3}
.dsub{display:block;margin-top:4px;color:var(--mu);font-size:12px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kd{font:600 11px/1.2 var(--font);font-style:normal;letter-spacing:.02em;padding:3px 8px;border-radius:999px;border:1px solid var(--ln);background:var(--sf2);color:var(--mu);white-space:nowrap}
.kd.warn{border-color:color-mix(in srgb,var(--ac) 60%,transparent);background:color-mix(in srgb,var(--ac) 22%,transparent);color:var(--tx)}

/* actions: template rows get a plus, document rows get pin and delete */
.dadd{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--ac);color:#16130E;font-style:normal;box-shadow:0 8px 16px -10px rgba(242,169,0,.9)}
.dadd svg{display:block}
.dact{flex:none;display:flex;align-items:center;gap:2px;margin-right:-6px}
.drow .ib.dpin,.drow .ib.ddel{width:40px;height:40px;min-width:40px;min-height:40px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--mu);display:grid;place-items:center}
.drow .ib.dpin.on{color:var(--ac)}.drow .ib.dpin.on svg{fill:currentColor}
.drow .ib.ddel:active{color:#D64545;background:color-mix(in srgb,#D64545 12%,transparent)}
@media(hover:hover){.drow .ib.dpin:hover{color:var(--tx);background:var(--sf2)}.drow .ib.ddel:hover{color:#D64545;background:color-mix(in srgb,#D64545 12%,transparent)}}

/* filter chips sit directly under the Recent heading */
.shd+.chips{margin:0 0 12px}

/* "Show all" */
.dmore{display:block;width:100%;margin:12px 0 0;height:48px;border-radius:var(--rb);border:1px solid var(--ln);background:var(--sf);color:var(--tx);font:600 14px var(--font)}
.dmore:active{background:var(--sf2)}
#rail[data-all]+.dmore{display:none}
#rail:not([data-all])>.drow.rcard:nth-child(n+7){display:none}

/* quick-action highlight (New report / New form buttons) */
#ngrid[data-hl=rep] .drow[data-kind=form],#ngrid[data-hl=form] .drow[data-kind=rep]{opacity:.38}
#ngrid[data-hl=rep] .drow[data-kind=rep],#ngrid[data-hl=form] .drow[data-kind=form]{background:color-mix(in srgb,var(--ac) 14%,var(--sf))}

/* wide screens: rows become separate cards in a responsive grid */
@media(min-width:760px){
 .dlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:12px;background:transparent;border:0;box-shadow:none;overflow:visible}
 .drow,.drow.lv,.dlist>.drow:last-child{border:1px solid var(--ln);border-radius:var(--rc);background:var(--sf);box-shadow:var(--sh)}
 .dlist>.empty{grid-column:1/-1;border:1.5px dashed var(--ln);border-radius:var(--rc)}
 @media(hover:hover){.drow:hover{border-color:color-mix(in srgb,var(--ac) 65%,var(--ln))}}
}
@media(max-width:380px){.drow{gap:12px;padding:10px 12px}.drow .dth{width:50px}.dtx b{font-size:14px}}

/* ===== Continue editing: Open sits beside the write-up, bold ===== */
.cont{align-items:center;gap:16px}
.cont .ci{flex:1 1 auto;min-width:0}
.cont .ci p{margin:0}
.cont .ci h2{margin:4px 0 6px;font-size:22px;line-height:1.18;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
html[data-t] .cont .btn.p.cop{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 20px;border-radius:var(--rb);background:#16130E;color:var(--ac);font:800 16px/1 var(--font);letter-spacing:.01em;box-shadow:0 10px 20px -10px rgba(22,19,14,.7)}
.cont .cop svg{display:block;flex:none}
@media(max-width:600px){
 .cont{gap:12px;padding:16px 14px 16px 16px}
 .cont .cpg{width:64px;height:84px}
 .cont .ci h2{font-size:18px}
 html[data-t] .cont .btn.p.cop{flex-direction:column;gap:6px;min-height:68px;width:60px;padding:0;font-size:13px}
}
@media(max-width:360px){
 .cont .cpg{width:46px;height:60px}
 html[data-t] .cont .ci small{white-space:nowrap;font-size:10px;letter-spacing:.05em}
 .cont .ci h2{font-size:16px}
 html[data-t] .cont .btn.p.cop{width:54px}
}

/* ===== signature size control: fine steps, minus/plus, presets ===== */
.sz.szh{margin-bottom:2px}
.szr{display:flex;align-items:center;gap:10px;margin:6px 0 4px}
.szr input[type=range]{flex:1 1 auto;min-width:0;min-height:44px;margin:0;padding:0;accent-color:var(--ac);background:none;border:0;touch-action:pan-y}
.szb{flex:none;width:46px;height:46px;min-width:46px;padding:0;border-radius:50%;font:700 22px/1 var(--font);display:grid;place-items:center;user-select:none;-webkit-user-select:none;touch-action:manipulation}
.szq{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 12px}
.szq .chip{height:34px;padding:0 13px}
.szr input[type=range]{border:0!important;outline:0;box-shadow:none;border-radius:0;background:transparent}
.szr input[type=range]:focus-visible{outline:0}
.szq{flex-wrap:nowrap;gap:6px}
.szq .chip{flex:1 1 0;min-width:0;padding:0;text-align:center;justify-content:center}

/* ===== v57: bottom menu locked to the screen edge + redesigned Settings ===== */
@media(max-width:899px){
 /* The page itself no longer scrolls on screens with the menu. Header, scrolling content and menu are
    three stacked parts of one screen-high column, so the menu can never drift away from the bottom. */
 html:has(.nav){height:100%;overflow:hidden;overscroll-behavior:none}
 body:has(.nav){height:100vh;height:100dvh;box-sizing:border-box;overflow:hidden;overscroll-behavior:none;padding:env(safe-area-inset-top) 0 0!important}
 body:has(.nav) #app{display:flex;flex-direction:column;height:100%;min-height:0}
 body:has(.nav) .top{position:relative;flex:none}
 body:has(.nav) main.wrap{flex:1 1 auto;min-height:0;width:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-bottom:32px!important}
 body:has(.nav) .nav{position:relative!important;flex:none;width:100%;order:3}
}

/* settings */
.cfgp{gap:16px;padding-bottom:8px}
.cfgp .pane{padding:18px;border-radius:20px}
.cfgp .ch{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.cfgp .ch h3{margin:0;padding:0;border:0;font:700 17px/1.2 var(--font);letter-spacing:-.02em}
.cfgp .ch small{display:block;color:var(--mu);font-size:13px;margin-top:2px;line-height:1.3}
.cfgp .ci2{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ac) 16%,transparent);color:var(--ac)}
.cfgp .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:14px;cursor:pointer;white-space:nowrap}
.cfgp .btn svg{flex:none}
.cfgp .btn.wide{width:100%;margin-top:12px;background:var(--sf2)}
.cfgp .btn.wide:disabled{opacity:.6}
.cfgp .btnrow{display:flex;gap:10px;margin-top:14px}
.cfgp .btnrow .btn{flex:1;min-width:0}
.cfgp .btnrow .btn:not(.p){background:var(--sf2)}
.cfgp .hint{margin:12px 0 0;font-size:12.5px;line-height:1.45;color:var(--mu)}
.cfgp .hint b{color:var(--tx);font-weight:600;word-break:break-all}

/* theme picker */
.cfgp .seg{margin-top:0}
.cfgp .seg button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:62px;font-size:13px}
.cfgp .seg button.on{color:var(--tx)}
.cfgp .seg button.on svg{color:var(--ac)}

/* backup summary */
.cfgp .stat{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cfgp .stat>div{background:var(--sf2);border-radius:14px;padding:12px 8px;text-align:center}
.cfgp .stat b{display:block;font:700 24px/1 var(--font);letter-spacing:-.03em}
.cfgp .stat span{display:block;margin-top:5px;font-size:12px;color:var(--mu)}
.cfgp .bkst{display:flex;align-items:center;gap:8px;margin:14px 0 0;font-size:13.5px;font-weight:600}
.cfgp .bkst i,.cfgp .vst i{width:9px;height:9px;border-radius:50%;background:#1FA971;flex:none}
.cfgp .bkst.old i{background:var(--ac)}
.cfgp .bkst.old{color:var(--mu)}

/* switches */
.cfgp .tgl{padding:14px 0;border-bottom:0;border-top:1px solid var(--ln);margin-top:0}
.cfgp .ch+.tgl{border-top:0;padding-top:2px}
.cfgp .tgl input{-webkit-appearance:none;appearance:none;flex:none;width:51px;height:31px;min-height:0;border-radius:99px;background:color-mix(in srgb,var(--mu) 35%,transparent);position:relative;transition:background .2s;cursor:pointer;margin:0;border:0}
.cfgp .tgl input::after{content:'';position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.3);transition:transform .2s}
.cfgp .tgl input:checked{background:var(--ac)}
.cfgp .tgl input:checked::after{transform:translateX(20px)}
.cfgp .bkc{margin-top:12px}

/* about / version */
.cfgp .verc{display:flex;align-items:center;gap:14px;padding:14px;border-radius:16px;background:var(--sf2);flex-wrap:wrap}
.cfgp .verc img{flex:none;width:52px;height:52px;border-radius:13px;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.cfgp .vm{flex:1;min-width:0}
.cfgp .vn{display:flex;align-items:baseline;gap:8px}
.cfgp .vn small{color:var(--mu);font-size:13px;font-weight:600}
.cfgp .vn b{font:700 30px/1 var(--font);letter-spacing:-.04em}
.cfgp .vm code{display:inline-block;margin-top:6px;padding:2px 8px;border-radius:7px;background:color-mix(in srgb,var(--mu) 16%,transparent);color:var(--mu);font:500 12px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace}
.cfgp .vst{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:99px;font-size:12.5px;font-weight:600;background:color-mix(in srgb,#1FA971 14%,transparent);color:#188A5B;margin-left:auto}
.cfgp .vst em{font-style:normal}
.cfgp .vst.rdy,.cfgp .vst.chk{background:color-mix(in srgb,var(--ac) 18%,transparent);color:#9A6A00}
.cfgp .vst.rdy i,.cfgp .vst.chk i{background:var(--ac)}
.cfgp .vst.off{background:color-mix(in srgb,#D64545 14%,transparent);color:#C03636}
.cfgp .vst.off i{background:#D64545}
[data-t=dark] .cfgp .vst.ok{color:#4AD59B}
[data-t=dark] .cfgp .vst.rdy,[data-t=dark] .cfgp .vst.chk{color:#FFC94D}
[data-t=dark] .cfgp .vst.off{color:#FF8A8A}

/* ===== v58 additions ===== */
.offc{display:none;align-items:center;gap:6px;padding:5px 10px;border-radius:99px;font:600 12px var(--font);background:color-mix(in srgb,#D64545 14%,transparent);color:#C03636}
.offc::before{content:'';width:7px;height:7px;border-radius:50%;background:#D64545}
html.offl .offc{display:inline-flex}
[data-t=dark] .offc{color:#FF8A8A}
.ndot{position:absolute;top:7px;left:calc(50% + 8px);width:10px;height:10px;border-radius:50%;background:#E5484D;border:2px solid var(--sf)}
.bkbn.bad{border-color:#D64545;background:color-mix(in srgb,#D64545 12%,var(--sf))}
.bkbn.bad b{color:#C03636}
[data-t=dark] .bkbn.bad b{color:#FF8A8A}
.cfgp .subh{margin:20px 0 8px;padding-top:16px;border-top:1px solid var(--ln);font:700 14px var(--font);letter-spacing:-.01em}
.cfgp .hint.warn{color:#C03636}
[data-t=dark] .cfgp .hint.warn{color:#FF8A8A}
.cfgp .bkst.bad{color:#C03636}.cfgp .bkst.bad i{background:#D64545}
.cfgp .sbar{height:8px;border-radius:99px;background:var(--sf2);overflow:hidden}
.cfgp .sbar i{display:block;height:100%;border-radius:99px;background:#1FA971}
.cfgp .sbar i.mid{background:var(--ac)}.cfgp .sbar i.bad{background:#D64545}
.cfgp .snap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--ln)}
.cfgp .snap:first-of-type{border-top:0}
.cfgp .snap b{display:block;font-size:14px}.cfgp .snap small{display:block;color:var(--mu);font-size:12.5px;margin-top:1px}
.cfgp .snap .btn{min-height:38px;padding:0 14px;background:var(--sf2)}
.cfgp .navrow{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;padding:14px 0;border:0;border-top:1px solid var(--ln);background:none;color:var(--tx);font:inherit;cursor:pointer;min-height:56px}
.cfgp .navrow b{display:block;font-weight:700;font-size:14.5px}
.cfgp .navrow small{display:block;color:var(--mu);font-size:12.5px;margin-top:2px;font-weight:400}
.cfgp .navrow>svg{flex:none;color:var(--mu)}
.cfgp .chg{margin-top:12px;border-top:1px solid var(--ln);padding-top:12px}
.cfgp .chg summary{cursor:pointer;font-weight:600;font-size:14px;min-height:32px;display:flex;align-items:center}
.cfgp .chg ul{margin:8px 0 0;padding-left:20px;color:var(--mu);font-size:13.5px;line-height:1.5}
.cfgp .chg li{margin:4px 0}
.cfgp .danger .ci2.r{background:color-mix(in srgb,#D64545 14%,transparent);color:#D64545}
.cfgp .btn.dng{background:color-mix(in srgb,#D64545 10%,var(--sf));border-color:color-mix(in srgb,#D64545 40%,var(--ln));color:#C03636}
[data-t=dark] .cfgp .btn.dng{color:#FF8A8A}
.cfgp .stk .tgl,.cfgp .tgl{min-height:56px}
@media(max-width:899px){
 /* notches in landscape */
 body:has(.nav) .nav{padding-left:calc(10px + env(safe-area-inset-left))!important;padding-right:calc(10px + env(safe-area-inset-right))!important}
 body:has(.nav) .top{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
 body:has(.nav) main.wrap{padding-left:max(16px,env(safe-area-inset-left))!important;padding-right:max(16px,env(safe-area-inset-right))!important}
}
@media(max-height:480px) and (max-width:899px){
 body:has(.nav) .nav button{height:42px;flex-direction:row;gap:8px}
}
.cfgp .hint,.cfgp .snap,.cfgp .navrow,.cfgp .chg{text-align:left}

/* ===== v59: PDF editor ===== */
.qa{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:8px!important}
.qb{font-size:11px!important;padding:10px 2px!important}
.pe{max-width:900px}
.pe-pick{display:flex;flex-direction:column;gap:12px;max-width:640px;margin:0 auto}
.pe-pick .ch{display:flex;align-items:center;gap:12px}.pe-pick .ch h3{margin:0;padding:0;border:0;font:700 17px var(--font)}.pe-pick .ch small{display:block;color:var(--mu);font-size:13px}
.pe-pick .ci2{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ac) 16%,transparent);color:var(--ac)}
.pe-pick .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:14px;cursor:pointer}
.pe-pick .btn.wide{width:100%}
.pe-tips{margin:4px 0 0;padding-left:20px;color:var(--mu);font-size:13.5px;line-height:1.5;text-align:left}.pe-tips li{margin:6px 0}.pe-tips b{color:var(--tx)}
.pe-tb{position:sticky;z-index:9;display:flex;align-items:center;gap:6px;padding:8px;margin:0 -4px 8px;background:color-mix(in srgb,var(--sf) 94%,transparent);backdrop-filter:blur(14px);border:1px solid var(--ln);border-radius:16px;overflow-x:auto}
.pe-tb i{flex:1}
.pe-t{flex:none;min-width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 10px;border:1px solid var(--ln);border-radius:12px;background:var(--sf);color:var(--tx);font:600 14px var(--font)}
.pe-t:disabled{opacity:.35}.pe-t.on{background:color-mix(in srgb,var(--ac) 22%,var(--sf));border-color:var(--ac)}
.pe-t.p{background:var(--ac);border-color:transparent;color:#1B1300}
.pe-name{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px;color:var(--mu);font-size:13px}.pe-name span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pe-pages{display:flex;flex-direction:column;align-items:center;gap:14px;padding-bottom:60px}
.pe-pg{position:relative;background:#fff;box-shadow:0 2px 14px rgba(0,0,0,.18);border-radius:3px;max-width:100%;overflow:hidden}
.pe-cv{position:absolute;inset:0;width:100%;height:100%}
.pe-ov{position:absolute;inset:0}
.pe-n{position:absolute;right:8px;bottom:6px;font:600 11px var(--font);color:#fff;background:rgba(0,0,0,.45);padding:2px 7px;border-radius:99px;pointer-events:none}
.pe-b{position:absolute;white-space:pre;font-family:'Public Sans',Inter,sans-serif;box-sizing:content-box;padding:0 1.5px;margin:0;outline:0;cursor:text;-webkit-user-select:text;user-select:text;-webkit-tap-highlight-color:transparent;color:transparent;overflow:visible}
.pe-pages.hl .pe-b:not(.ed){box-shadow:0 0 0 1px rgba(242,169,0,.65);background:rgba(242,169,0,.12)}
.pe-b.act{box-shadow:0 0 0 2px var(--ac)!important;z-index:2}
.pe-b.add{background:rgba(255,255,255,.0);box-shadow:0 0 0 1px dashed var(--ac)}
body:has(#pe) .wrap{padding-bottom:40px}
.pe-tb{flex-wrap:wrap;overflow:visible}
.pe-tb i{flex-basis:100%;height:0;order:0}
.pe-t.w,.pe-t.p{flex:1}

/* v60: light mode - app background slightly dimmer than the white cards and panels */
:root[data-t=light]{--bg:#EDEFF2}
:root[data-t=light] .nav{background:color-mix(in srgb,var(--sf) 94%,transparent)}

/* v60: Edit PDF extras */
.pe-note{position:absolute;left:12px;right:12px;top:12px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#000 72%,transparent);color:#fff;font:500 12.5px/1.4 var(--font);text-align:center;pointer-events:none;z-index:3}
.pe-opt{display:flex;align-items:flex-start;gap:12px;margin:0 0 12px;padding:10px 12px;border:1px solid var(--ln);border-radius:14px;background:var(--sf);cursor:pointer;text-align:left}
.pe-opt input{flex:none;width:20px;height:20px;margin-top:2px;accent-color:var(--ac)}
.pe-opt b{display:block;font-size:13.5px}.pe-opt small{display:block;color:var(--mu);font-size:12px;margin-top:2px;line-height:1.4}

/* v60: transparent previews and logo delete buttons */
.sgpv{background-color:#fff;background-image:linear-gradient(45deg,#e9ebee 25%,transparent 25%,transparent 75%,#e9ebee 75%),linear-gradient(45deg,#e9ebee 25%,transparent 25%,transparent 75%,#e9ebee 75%);background-size:14px 14px;background-position:0 0,7px 7px}
.lgw{position:relative;width:84px;height:58px}.lgw .lgc{width:100%;height:100%}
.lgw .libx,.libx{width:26px;height:26px;display:grid;place-items:center;top:-6px;right:-6px;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.libc .libx{top:4px;right:4px}

/* v61: Edit PDF and editor chrome - lighter, tucks away, nothing blurred over the pages */
.top{transition:transform .24s cubic-bezier(.2,.8,.2,1);will-change:transform}
.top.hide{transform:translateY(-101%)}
body:has(#pe) .top,body:has(.etb) .top{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:var(--bg)!important}
/* Edit PDF: one slim header row (Back + title); the brand row is dropped on this screen */
body:has(#pe) .top{padding-top:calc(6px + env(safe-area-inset-top))!important;padding-bottom:6px!important;gap:0!important}
body:has(#pe) .top .tr1{display:none}
body:has(#pe) .wrap{padding-top:12px;padding-bottom:calc(104px + env(safe-area-inset-bottom))}
.pe-name{margin:0 0 8px;gap:8px}.pe-name .lgbtn{flex:none;min-height:34px}.pe-name .lgbtn.on{color:var(--ac);border-color:var(--ac)}
.pe-opt{margin-bottom:10px;padding:8px 12px}
.pe-pages{gap:12px;padding-bottom:24px}
/* pages: drawn into place, faded in, isolated so scrolling never re-lays out the page */
.pe-pg{contain:layout paint style;transform:translateZ(0)}
.pe-cv{opacity:0;transition:opacity .16s ease-out}.pe-cv.rd{opacity:1}
/* floating tool dock */
.pe-dock{position:fixed;z-index:25;left:8px;right:8px;margin:0 auto;width:max-content;max-width:calc(100% - 16px);bottom:calc(10px + env(safe-area-inset-bottom));transform:translateY(calc(var(--kb,0px) * -1));display:flex;align-items:center;gap:2px;padding:5px;border-radius:999px;background:var(--sf);border:1px solid var(--ln);box-shadow:0 10px 30px -10px rgba(0,0,0,.5);overflow-x:auto;scrollbar-width:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.pe-dock::-webkit-scrollbar{display:none}
.pe-dock .pd-g{display:contents}
.pe-dock .pd-fmt{display:none}.pe-dock.fmt .pd-fmt{display:contents}.pe-dock.fmt .pd-idle{display:none}
.pe-dock .pe-t{flex:none!important;min-width:42px;height:42px;padding:0 11px;border:0;border-radius:999px;background:transparent;font-size:14px}
.pe-dock .pe-t.on{background:color-mix(in srgb,var(--ac) 26%,transparent)}
.pe-dock .pe-t.p{background:var(--ac);color:#1B1300;padding:0 16px}
.pe-dock .pe-t:disabled{opacity:.35}
.pe-dock .sep{flex:none;width:1px;height:22px;margin:0 3px;background:var(--ln)}
@media(max-width:360px){.pe-dock .pe-t[data-pe=add] span{display:none}}
/* bottom edit sheet: a compact floating card instead of a full-width sheet */
.etb{bottom:calc(8px + env(safe-area-inset-bottom))!important;border:1px solid var(--ln)!important;border-radius:20px!important;padding:10px 12px!important;transform:translate(var(--vx,0px),calc(var(--vy,0px) + 150%)) scale(var(--vs,1))!important;box-shadow:0 12px 34px -12px rgba(0,0,0,.55)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.etb.show{transform:translate(var(--vx,0px),var(--vy,0px)) scale(var(--vs,1))!important}
@media(max-width:899px){.etb.cl{padding:8px 10px!important}}
@media(prefers-reduced-motion:reduce){.top,.pe-cv{transition:none}}

/* v62: Bento Charcoal - Danholsen logo colours (charcoal #1B1B1B, amber #F2A900), dark theme; Bento Pro as the light theme */
:root[data-t=light]{--bg:#F5F4F0;--sf:#fff;--sf2:#ECEAE3;--tx:#1B1B1B;--mu:#5C5C57;--ln:#DAD7CD;--ac:#F2A900;--bl:#1B1B1B;--desk:#E7E5DE;--rc:24px;--rb:16px;--sh:0 10px 28px -18px rgba(27,27,27,.28)}
:root[data-t=dark]{--bg:#141414;--sf:#222221;--sf2:#2E2E2B;--tx:#F4F2EC;--mu:#A8A59C;--ln:#34332F;--ac:#F2A900;--bl:#F2A900;--desk:#0C0C0C;--rc:24px;--rb:16px;--sh:0 14px 30px -18px #000}
html[data-t] .top{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:0}
html[data-t] .h1{font:700 42px/1 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.02em}
html[data-t] .shd .sec,html[data-t] .sec{font:700 24px/1.1 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.03em;color:var(--tx)}
html[data-t] .search{height:52px;border-radius:16px;border:1px solid var(--ln);box-shadow:none;background:var(--sf)}
html[data-t] .search:focus{outline:2px solid var(--ac);border-color:var(--ac)}
/* Home quick actions as bento tiles: one wide amber tile, then a two-column grid */
html[data-t] .qa{grid-template-columns:1fr 1fr!important;gap:10px!important}
html[data-t] .qb{flex-direction:row;justify-content:flex-start;gap:12px;min-height:64px;padding:0 16px;border-radius:20px;text-align:left;font-weight:700;font-size:14px;box-shadow:none}
html[data-t] .qb svg{color:#B57F00}html[data-t][data-t=dark] .qb svg{color:var(--ac)}
html[data-t] .qb:first-child{grid-column:span 2;min-height:76px;background:var(--ac);border-color:var(--ac);color:#1B1B1B;font:700 24px 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.03em}
html[data-t] .qb:first-child span{font-size:26px;line-height:1}
html[data-t] .qb:first-child svg{color:#1B1B1B;width:28px;height:28px}
html[data-t] .cont{border-radius:var(--rc)}
html[data-t] .dlist{border-radius:var(--rc)}
html[data-t] .btn.p{background:var(--ac);color:#1B1B1B}
html[data-t] .etb{background:var(--sf)}
/* bottom bar: a floating charcoal pill with an amber active tab */
html[data-t] .nav button{color:#A8A59C}
html[data-t] .nav button.on{background:#F2A900;color:#1B1B1B;font-weight:700}
@media(max-width:899px){
 html[data-t] .nav{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;width:auto!important;max-width:none!important;margin:2px 16px calc(12px + env(safe-area-inset-bottom))!important;border:1px solid transparent!important;border-radius:99px!important;padding:6px!important;gap:4px;background:#1B1B1B!important;box-shadow:0 14px 34px -12px rgba(0,0,0,.55)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
 html[data-t=dark] .nav{background:#222221!important;border-color:var(--ln)!important}
 html[data-t] .nav button{flex:1;width:auto;height:52px;border-radius:99px!important}
}

/* ===== v63 redesign: "Site Office" - blueprint paper, charcoal hero with hazard stripe, amber accents ===== */
:root[data-t=light]{--bg:#EFEDE6;--sf:#FFFFFF;--sf2:#F5F3EC;--ln:#E0DDD2;--rc:22px;--rb:15px;--sh:0 1px 0 rgba(27,27,27,.04),0 16px 30px -22px rgba(27,27,27,.45);--grid:rgba(27,27,27,.055)}
:root[data-t=dark]{--bg:#111110;--sf:#1B1B19;--sf2:#252522;--ln:#2E2E2A;--rc:22px;--rb:15px;--sh:0 1px 0 rgba(255,255,255,.03),0 18px 30px -22px #000;--grid:rgba(255,255,255,.04)}
html[data-t] body{background-color:var(--bg);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:32px 32px;background-attachment:fixed}
html[data-t] .top{background:color-mix(in srgb,var(--bg) 78%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
html[data-t] .wrap{padding-top:14px}

/* hero */
.hero2{position:relative;overflow:hidden;border-radius:28px;padding:30px 20px 20px;color:#fff;background:radial-gradient(80% 90% at 100% 0,rgba(242,169,0,.38),transparent 62%),radial-gradient(60% 80% at 0 100%,rgba(242,169,0,.10),transparent 70%),linear-gradient(165deg,#2A2A27 0%,#161615 70%);border:1px solid rgba(255,255,255,.07);box-shadow:0 30px 50px -34px rgba(0,0,0,.85)}
.hero2::before{content:'';position:absolute;left:0;right:0;top:0;height:9px;background:repeating-linear-gradient(135deg,#F2A900 0 14px,#1B1B1B 14px 28px)}
.hero2::after{content:'';position:absolute;right:-46px;top:34px;width:150px;height:150px;border-radius:50%;border:26px solid rgba(242,169,0,.13);pointer-events:none}
.h2k{position:relative;display:inline-flex;align-items:center;gap:8px;font:700 11.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#F2A900}
.h2k::before{content:'';width:7px;height:7px;border-radius:50%;background:#F2A900;box-shadow:0 0 0 4px rgba(242,169,0,.22)}
html[data-t] .hero2 .h1{position:relative;margin:12px 0 6px;font:700 clamp(34px,10.5vw,50px)/.98 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.015em;color:#fff}
.h2p{position:relative;margin:0 0 18px;max-width:34ch;color:#B9B6AB;font-size:14px;line-height:1.45}
.h2s{position:relative;display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 16px;border-radius:18px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08)}
.h2s>*{padding:12px 6px 11px;text-align:center;background:none;border:0;color:#fff;font-family:inherit;position:relative}
.h2s>*+*::before{content:'';position:absolute;left:0;top:22%;bottom:22%;width:1px;background:rgba(255,255,255,.12)}
.h2s b{display:block;font:700 30px/1 'Barlow Condensed',sans-serif;letter-spacing:.01em}
.h2s span{display:block;margin-top:5px;font:600 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#A9A699}
.h2s .us b{color:#F2A900}.h2s .us{cursor:pointer}.h2s .us span{color:#F2A900}
.h2c{position:relative;display:grid;grid-template-columns:1.35fr 1fr;gap:10px}
.h2b{display:flex;align-items:center;justify-content:center;gap:9px;height:58px;border-radius:17px;border:1.5px solid rgba(255,255,255,.22);background:rgba(255,255,255,.05);color:#fff;font:700 21px/1 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.04em;transition:transform .12s}
.h2b:active{transform:scale(.97)}
.h2b.p{background:#F2A900;border-color:#F2A900;color:#1B1B1B;box-shadow:0 14px 26px -14px rgba(242,169,0,.9)}
.h2b svg{width:22px;height:22px}

/* quick tiles */
html[data-t] .qa{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:10px!important;margin:14px 0 0}
html[data-t] .qb,html[data-t] .qb:first-child{flex-direction:column;align-items:flex-start;justify-content:space-between;gap:14px;min-height:104px;padding:14px;border-radius:var(--rc);text-align:left;grid-column:auto;background:var(--sf);border:1px solid var(--ln);color:var(--tx);font:inherit;text-transform:none;letter-spacing:0;box-shadow:var(--sh)}
html[data-t] .qb:first-child span{font-size:inherit}
.qic{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:color-mix(in srgb,var(--ac) 20%,transparent);color:#B57F00}
html[data-t=dark] .qic{color:var(--ac)}
html[data-t] .qb svg,html[data-t] .qb:first-child svg{width:21px;height:21px;color:inherit}
.qt{display:block}.qt b{display:block;font:700 14.5px/1.15 Inter,system-ui,sans-serif;letter-spacing:-.01em}.qt small{display:block;margin-top:3px;color:var(--mu);font:500 11.5px/1.2 Inter,system-ui,sans-serif}

/* search */
html[data-t] .search{margin-top:14px;height:54px;padding:0 18px 0 48px;border-radius:999px;background:var(--sf) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%238A877D' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 18px center;box-shadow:var(--sh)}

/* continue card */
html[data-t] .cont{margin-top:14px;background:linear-gradient(135deg,#F2A900,#E39A00);color:#1B1B1B;border:0;box-shadow:0 22px 34px -24px rgba(242,169,0,.9)}
html[data-t] .cont::before{display:none}
html[data-t] .cont .ci small{color:#1B1B1B;opacity:.7;font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:11px}
html[data-t] .cont .ci h2{color:#1B1B1B}html[data-t] .cont .ci p{color:rgba(27,27,27,.72)}
html[data-t] .cont .cpg{transform:rotate(-4deg);box-shadow:0 12px 20px -10px rgba(0,0,0,.5);border-radius:6px}
html[data-t] .cont .btn.p.cop{background:#1B1B1B;color:#F2A900}

/* section headings */
html[data-t] .shd{margin:34px 0 14px;align-items:flex-end}
html[data-t] .shd .sec{position:relative;padding-left:16px;font:700 26px/1.05 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.025em}
html[data-t] .shd .sec::before{content:'';position:absolute;left:0;top:2px;bottom:2px;width:7px;border-radius:2px;background:var(--ac);transform:skewX(-14deg)}
html[data-t] .shs{padding-left:16px}
html[data-t] .shr{padding:5px 10px;border-radius:999px;background:var(--sf);border:1px solid var(--ln);font-size:11.5px}
html[data-t] .dgl{margin:18px 0 10px}
html[data-t] .dgl span{font:800 11px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--mu)}

/* template rails: big page cards you swipe through */
html[data-t] #ngrid .dlist{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -20px;padding:4px 20px 16px;background:transparent;border:0;box-shadow:none;border-radius:0;scrollbar-width:none}
html[data-t] #ngrid .dlist::-webkit-scrollbar{display:none}
html[data-t] #ngrid .drow.tpc{flex:0 0 164px;flex-direction:column;align-items:stretch;gap:12px;min-height:0;padding:10px 10px 14px;border:1px solid var(--ln);border-radius:24px;background:var(--sf);box-shadow:var(--sh);scroll-snap-align:start}
html[data-t] #ngrid .drow.tpc .dth{width:100%;aspect-ratio:1/1.18;border-radius:16px;overflow:hidden;border:0;background:#EDEAE0;box-shadow:inset 0 0 0 1px rgba(27,27,27,.08)}
html[data-t] #ngrid .drow.tpc .dtx{padding:0 4px}
html[data-t] #ngrid .drow.tpc .dtx b{font:700 15px/1.2 Inter,system-ui,sans-serif;-webkit-line-clamp:2;min-height:36px}
html[data-t] #ngrid .drow.tpc .dmeta span{display:none}
html[data-t] #ngrid .drow.tpc .dadd{position:absolute;right:16px;top:calc(10px + (164px - 20px) * 1.18 - 46px);width:40px;height:40px;box-shadow:0 10px 18px -8px rgba(0,0,0,.55)}
@media(min-width:760px){html[data-t] #ngrid .dlist{margin:0;padding:4px 4px 16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));overflow:visible}html[data-t] #ngrid .drow.tpc{flex:initial}html[data-t] #ngrid .drow.tpc .dadd{top:calc(10px + (100% - 20px) * 0)}}

/* document cards: separate cards with a coloured spine */
@media(max-width:759px){
 html[data-t] .dlist:not(.rail){background:transparent;border:0;box-shadow:none;overflow:visible;display:grid;gap:10px}
 html[data-t] #prail .drow,html[data-t] #rail .drow{border:1px solid var(--ln);border-radius:var(--rc);background:var(--sf);box-shadow:var(--sh)}
}
html[data-t] .rcard{padding-left:20px}
html[data-t] .rcard::before{content:'';position:absolute;left:0;top:16px;bottom:16px;width:5px;border-radius:0 5px 5px 0;background:color-mix(in srgb,var(--tx) 22%,transparent)}
html[data-t] .rcard[data-k=rep]::before{background:var(--ac)}
html[data-t] .rcard .dth{border-radius:9px;box-shadow:0 8px 14px -9px rgba(0,0,0,.5);transform:rotate(-2.5deg)}
html[data-t] .rcard .dtx b{font:700 15.5px/1.25 Inter,system-ui,sans-serif}
html[data-t] .kd{border:0;font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:10px;padding:4px 8px;border-radius:7px}
html[data-t] .rcard[data-k=rep] .kd:first-child{background:color-mix(in srgb,var(--ac) 28%,transparent);color:var(--tx)}
html[data-t] .kd.warn{background:#D64545;color:#fff}

/* filter chips */
html[data-t] .chip{height:38px;border-radius:12px;font-weight:700}
html[data-t] .chip.on{background:var(--ac);border-color:var(--ac);color:#1B1B1B}

/* bottom bar */
@media(max-width:899px){html[data-t] .nav{box-shadow:0 18px 34px -12px rgba(0,0,0,.6)!important}}
html[data-t] .nav button.on{box-shadow:0 8px 16px -8px rgba(242,169,0,.8)}

/* other screens share the same cards */
html[data-t] .pane{border-radius:var(--rc);box-shadow:var(--sh)}
html[data-t] .h1.s{font:700 24px/1 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.03em}
html[data-t] .btn.p{box-shadow:0 12px 22px -14px rgba(242,169,0,.95)}

html[data-t] .qb,html[data-t] .qb:first-child{padding:14px!important;font-size:inherit!important}
html[data-t] .h2b{white-space:nowrap;font-size:19px;gap:8px;padding:0 10px}
html[data-t] .h2b svg{width:20px;height:20px}
.h2c{grid-template-columns:1.25fr 1fr}
html[data-t] #ngrid .drow.tpc .dth{border-radius:14px}
html[data-t] #ngrid .drow.tpc .dadd,html[data-t] #ngrid .drow.tpc .dadd{top:auto!important;bottom:14px;right:14px}
html[data-t] #ngrid .drow.tpc .dtx{padding-right:46px;min-height:62px}
html[data-t] #ngrid .drow.tpc .dtx b{min-height:0}
html[data-t] #ngrid .drow.tpc .dadd{top:18px!important;bottom:auto!important;right:18px;width:36px;height:36px;box-shadow:0 0 0 3px rgba(255,255,255,.92),0 10px 18px -8px rgba(0,0,0,.6)}
html[data-t] #ngrid .drow.tpc .dtx{padding-right:4px;min-height:0}
html[data-t] .hero2+.bkbn{margin-top:12px}
html[data-t] .bkbn{border-radius:var(--rc)}

/* v64: logo cropper, Saved badge and download button */
.lgcrop{position:fixed;inset:0;z-index:80}
.lgcrop .lcb{position:absolute;inset:0;background:#0008}
.lcs{position:absolute;left:0;right:0;bottom:0;max-width:560px;margin:0 auto;max-height:94vh;overflow:auto;background:var(--sf);color:var(--tx);border-radius:22px 22px 0 0;padding:16px 16px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px #0004}
.lcwb{display:grid;place-items:center;background:repeating-conic-gradient(#d9dde5 0 25%,#f4f6f9 0 50%) 0 0/16px 16px;border-radius:12px;padding:10px;margin-bottom:10px}
.lcw{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;line-height:0}
.lcw img{display:block;max-width:none;pointer-events:none;-webkit-user-drag:none}
.lcf{position:absolute;box-sizing:border-box;border:2px solid #F2A900;box-shadow:0 0 0 9999px rgba(0,0,0,.48);cursor:move;touch-action:none}
.lcf i{position:absolute;width:26px;height:26px;background:#F2A900;border:3px solid #fff;border-radius:50%;box-sizing:border-box;touch-action:none}
.lcf i[data-h=nw]{left:-13px;top:-13px;cursor:nwse-resize}.lcf i[data-h=ne]{right:-13px;top:-13px;cursor:nesw-resize}
.lcf i[data-h=sw]{left:-13px;bottom:-13px;cursor:nesw-resize}.lcf i[data-h=se]{right:-13px;bottom:-13px;cursor:nwse-resize}
.lcc{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.lcc .lgbtn{margin:0}.lgbtn.on{background:#F2A900;border-color:#F2A900;color:#1a1300}
.lcp{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.lcph{background:#fff;color:#111;border:1px solid #cfd5df;border-radius:6px;padding:10px 12px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);align-items:center;gap:10px;min-height:56px}
.lcpl{display:grid;place-items:center;height:40px}.lcpl img{max-width:100%;max-height:40px;object-fit:contain}
.lcpt{text-align:center}.lcpt b{display:block;font:700 14px Inter,sans-serif}.lcpt small{font-size:11px;color:#667}
.lcpo{display:flex;align-items:center;gap:10px;color:var(--mu);font-size:12px}
.lcpo img{height:64px;max-width:60%;object-fit:contain;background:#fff;border:1px solid var(--ln);border-radius:8px;padding:4px}
.lcx{display:flex;gap:10px;justify-content:flex-end;position:sticky;bottom:0}
.lcx .btn{min-width:110px}
.kd.ok{background:color-mix(in srgb,#1E9E5A 22%,transparent);border-color:color-mix(in srgb,#1E9E5A 55%,transparent);color:var(--tx)}
.kd.old{border-color:color-mix(in srgb,var(--ac) 60%,transparent);background:color-mix(in srgb,var(--ac) 22%,transparent);color:var(--tx)}
html[data-t] .kd.ok{background:#1E9E5A;color:#fff}
html[data-t] .kd.old{background:color-mix(in srgb,var(--ac) 35%,transparent);color:var(--tx)}
.drow .ib.ddl{width:40px;height:40px;min-width:40px;min-height:40px;padding:0;border:0;border-radius:50%;background:transparent;color:#1E9E5A;display:grid;place-items:center}
.drow .ib.ddl svg,.frow .ib.ddl svg{width:20px;height:20px}
.frow .ib.ddl{width:40px;height:40px;padding:0;border:0;background:transparent;color:#1E9E5A;display:grid;place-items:center}
.frow .kd{margin-left:6px}
@media(hover:hover){.drow .ib.ddl:hover,.frow .ib.ddl:hover{background:color-mix(in srgb,#1E9E5A 14%,transparent)}}
.frow .fmeta .kd{display:inline-block;margin:4px 0 0;align-self:flex-start;width:fit-content}

/* v64: Settings redesign - tabs, profile card, grouped rows */
.cfgp{gap:14px}
.ctabs{display:flex;gap:4px;padding:4px;background:var(--sf2);border:1px solid var(--ln);border-radius:16px;position:sticky;top:8px;z-index:5;backdrop-filter:blur(10px)}
.ctabs button{position:relative;flex:1;min-height:44px;border:0;background:transparent;border-radius:12px;font:700 13.5px var(--font);color:var(--mu);cursor:pointer;white-space:nowrap}
.ctabs button.on{background:var(--sf);color:var(--tx);box-shadow:var(--sh)}
.ctabs .ndot{top:8px;left:auto;right:8px;width:9px;height:9px}
.ctabs .ndot.warn{background:var(--ac)}
.cfgp .pane.prof{padding:20px;background:linear-gradient(135deg,color-mix(in srgb,var(--ac) 18%,var(--sf)),var(--sf) 62%);position:relative;overflow:hidden}
.cfgp .pane.prof::after{content:'';position:absolute;right:-40px;top:-40px;width:140px;height:140px;border-radius:50%;border:18px solid color-mix(in srgb,var(--ac) 14%,transparent);pointer-events:none}
.cfgp .prof .mev{margin:0 0 16px;gap:16px}
.cfgp .prof .mea{width:78px;height:78px;border:3px solid var(--sf);box-shadow:0 0 0 2px var(--ac),0 8px 18px -8px rgba(0,0,0,.4)}
.cfgp .prof .mei{gap:3px}.cfgp .prof .mei b{font:800 20px/1.2 var(--font);letter-spacing:-.02em}
.cfgp .prof .mei span{font-size:13.5px}
.cfgp .prof .mea2{margin:0}.cfgp .prof .mea2 .btn{flex:1;background:var(--sf);min-height:42px}
.cfgp .pane{padding:0;overflow:hidden}
.cfgp .pane>.ch{padding:16px 18px 12px;margin:0}
.cfgp .pane>*:not(.ch):not(.tgl):not(.navrow){margin-left:18px;margin-right:18px}
.cfgp .pane>.tgl,.cfgp .pane>.navrow{padding-left:18px;padding-right:18px;width:100%;box-sizing:border-box}
.cfgp .pane>*:last-child{margin-bottom:18px}
.cfgp .pane>.tgl:last-child,.cfgp .pane>.navrow:last-child{margin-bottom:0}
.cfgp .pane.prof{padding:20px}.cfgp .pane.prof>*{margin-left:0;margin-right:0}
.cfgp .pane:not(.prof):has(.sfl)>*:not(.ch){}
.cfgp .pane>.ch{border-bottom:1px solid var(--ln)}
.cfgp .pane>.ch+*{margin-top:14px}
.cfgp .pane>.ch+.tgl,.cfgp .pane>.ch+.navrow{margin-top:0;border-top:0}
.cfgp .pane>.seg{margin-top:14px}
.cfgp .pane.danger{border-color:color-mix(in srgb,#D64545 40%,var(--ln))}
.cfgp .pane.danger>.ch{border-bottom-color:color-mix(in srgb,#D64545 25%,var(--ln))}
.cfgp .navrow{transition:background .15s}.cfgp .navrow:active{background:var(--sf2)}
.cfgp .pane>.navrow:last-child{border-radius:0 0 20px 20px}
.cfgp .stat>div b{font:800 22px var(--font)}
.cfgp .pane.about .verc{margin-top:14px}
.cfgp .pane.prof>*:not(.ch):not(.tgl):not(.navrow){margin-left:0;margin-right:0}
.cfgp .pane>.btn.wide{width:calc(100% - 36px);box-sizing:border-box}
.cfgp .pane>.btnrow,.cfgp .pane>.bkc,.cfgp .pane>.verc,.cfgp .pane>.stat,.cfgp .pane>.sbar{box-sizing:border-box;width:auto}
.cfgp .pane>.chg{margin-bottom:0;padding-bottom:12px}
.ctabs .ndot{position:static;display:inline-block;margin:0 0 3px 7px;vertical-align:middle}
.cfgp .meedit{padding:0}.cfgp .meedit>h3{margin-top:18px;margin-bottom:0}

/* v64: desktop alignment - header, content, Settings and dialogs share one column */
@media(min-width:900px){
 body:has(.nav) .top{padding-left:88px;padding-right:0}
 body:has(.nav) .top .tr1,body:has(.nav) .top .tr2{width:100%;max-width:1180px;margin:0 auto;padding:0 28px;box-sizing:border-box}
 .stk.cfgp{max-width:none;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
 .cfgp>.ctabs{grid-column:1/-1;justify-self:start;width:100%;max-width:520px}
 .cfgp>.pane.prof,.cfgp>.pane.about,.cfgp>.pane.meedit{grid-column:1/-1}
 .cfgp .pane.prof{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:24px 28px}
 .cfgp .prof .mev{margin:0}.cfgp .prof .mea2{flex:none;width:320px}
 .cfgp .meedit{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;padding:0 28px 24px}
 .cfgp .meedit>*{margin-left:0;margin-right:0}
 .cfgp .meedit>h3,.cfgp .meedit>.lead,.cfgp .meedit>.mev,.cfgp .meedit>.mea2{grid-column:1/-1}
 .cfgp .pane>.btn.wide{display:inline-flex;width:auto;min-width:240px}
 .cfgp .pane.about .verc{max-width:560px}
 .lcs,.lgs{top:50%;bottom:auto;transform:translateY(-50%);border-radius:22px;max-height:88vh;max-width:640px;box-shadow:0 30px 80px #0007}
}
.cfgp .pane>.ch+.tgl{padding-top:14px}

/* v64: Home on desktop - the three template groups sit side by side instead of leaving the right of the page empty */
@media(min-width:900px){
 html[data-t] #ngrid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,2fr) minmax(0,1fr);grid-template-rows:auto auto;grid-auto-flow:column;column-gap:20px;align-items:start}
 html[data-t] #ngrid>.dgl{margin:0 0 10px}
 html[data-t] #ngrid .dlist{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));padding:4px 0 16px;gap:14px}
}

/* v65: desktop side bar (Home, Files...) is a flat, square-edged strip - no curves */
@media(min-width:900px){
 html[data-t] .nav,html[data-t=dark] .nav{border-radius:0!important}
}

/* v65: Home has one "Choose a template" entry; the templates open on their own page, ungrouped */
.ntb{display:flex;align-items:center;gap:14px;width:100%;box-sizing:border-box;min-height:72px;padding:12px 16px;margin:0 0 18px;border:1px solid var(--ln);border-radius:var(--rc);background:var(--sf);box-shadow:var(--sh);color:var(--tx);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,transform .15s}
.ntb:hover{border-color:color-mix(in srgb,var(--ac) 70%,var(--ln))}
.ntb:active{transform:scale(.985)}
.ntb .nti{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--ac);color:#1B1B1B}
.ntb .nti svg{width:22px;height:22px}
.ntb .ntt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.ntb .ntt b{font:700 15.5px/1.2 var(--font);letter-spacing:-.012em}
.ntb .ntt small{font-size:12.5px;color:var(--mu)}
.ntb>svg{flex:none;color:var(--mu)}
@media(min-width:900px){
 html[data-t] #ngrid.flat{display:block}
 html[data-t] #ngrid.flat .dlist{grid-template-columns:repeat(auto-fill,minmax(176px,1fr));padding:4px 0 24px;gap:16px}
}

/* v67: edit bar sits at the TOP, just under the header, so the keyboard never covers it */
.etb{top:var(--eth,112px)!important;bottom:auto!important;transform-origin:50% 0!important;
 transform:translate(var(--vx,0px),calc(var(--vy,0px) - 150%)) scale(var(--vs,1))!important;
 visibility:hidden;pointer-events:none;transition:transform .22s,visibility 0s .22s!important;
 box-shadow:0 14px 34px -14px rgba(0,0,0,.55)!important}
.etb.show{transform:translate(var(--vx,0px),var(--vy,0px)) scale(var(--vs,1))!important;
 visibility:visible;pointer-events:auto;transition:transform .22s,visibility 0s!important}
.etb.vz{transition:none!important}
body:has(.etb.show) .wrap.ew{padding-bottom:340px}

/* v68: edit bar is docked to the very top of the screen while scrolling (under the header only while the header is on screen), and is compact */
.etb{top:max(var(--eth,0px),calc(env(safe-area-inset-top,0px) + 6px))!important;padding:8px 10px!important;border-radius:18px!important}
.etb .eh{min-height:22px}
.etb .er{margin-top:6px}
.etb .ab{width:40px;height:40px;border-radius:10px}
.etb .nx{height:40px;border-radius:10px}
.etb .eh button{padding:3px 4px}
body:has(.etb.show) .wrap.ew{padding-bottom:55vh}
@media(min-width:900px){
 .etb{display:flex;flex-wrap:wrap;column-gap:10px;align-items:center}
 .etb>.eh{flex:0 0 100%}
 .etb>.er{flex:1 1 auto}
 .etb>.fhn{flex:0 0 100%}
}

/* v68: logo crop - edge handles so the shape can also be changed from the sides */
.lcf b{position:absolute;touch-action:none;background:transparent}
.lcf b[data-h=n]{left:14px;right:14px;top:-9px;height:18px;cursor:ns-resize}
.lcf b[data-h=s]{left:14px;right:14px;bottom:-9px;height:18px;cursor:ns-resize}
.lcf b[data-h=e]{top:14px;bottom:14px;right:-9px;width:18px;cursor:ew-resize}
.lcf b[data-h=w]{top:14px;bottom:14px;left:-9px;width:18px;cursor:ew-resize}
.lcf i{z-index:1}