/* Lintel app styles. Tenant theme tokens (--accent, --on-accent, --chrome, --on-chrome, --font, --radius) come from /assets/theme.css. */
:root{
  --bg:var(--bg-light,#f5f6f8); --surface:#fff; --text:#1d1f23; --muted:#5b616b; --line:#d6d9de;
  --ok:#1b6e3c; --ok-bg:#e3f3ea; --warn:#8a5a00; --warn-bg:#fdf1d6; --bad:#a3231f; --bad-bg:#fbe5e4; --info:#1f46b3; --info-bg:#e4ebfa;
  /* ArchiMate layer tokens (fixed, not themeable) */
  --layer-business:#ffffb5; --layer-application:#b5ffff; --layer-technology:#c9e7b7; --layer-strategy:#f5deaa; --layer-motivation:#ccccff; --layer-implementation:#ffe0e0;
  --accent:#1f46b3; --on-accent:#fff; --chrome:#1d1f23; --on-chrome:#fff; --font:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; --radius:6px;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#14161a;--surface:#1c1f25;--text:#eceef1;--muted:#a3a9b3;--line:#363b44;
    --ok:#6fd49a;--ok-bg:#183626;--warn:#f0c264;--warn-bg:#3a2e12;--bad:#ff8f8a;--bad-bg:#40191a;--info:#9db6ff;--info-bg:#1b2745}
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:100%}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.5;display:flex;flex-direction:column;min-height:100vh}
a{color:var(--info)}
code{font-size:.9em;background:var(--bg);padding:.1em .35em;border-radius:4px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--accent);color:var(--on-accent);padding:.5rem 1rem;z-index:10}
.skip:focus{left:0}
.emustack{position:sticky;top:0;z-index:40;box-shadow:0 2px 6px rgba(0,0,0,.15)}
.emubar{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;padding:.4rem 1rem;background:var(--warn-bg);color:var(--warn);border-bottom:1px solid var(--warn)}
.emubar-tier,.emubar-user,.emubar-disc{background:var(--info-bg);color:var(--info);border-bottom-color:var(--info)}
.emubar-tier.emubar-on,.emubar-user.emubar-on,.emubar-disc.emubar-on{background:var(--info);color:#fff}
.emubar-on{background:var(--warn);color:#fff}
.emulabel{font-size:.8rem;font-weight:700;margin-right:.25rem}
.emuform{margin:0;display:inline}
.emuform select{max-width:22rem;padding:.2rem .4rem;font-size:.85rem}
.pill{font:inherit;font-size:.8rem;padding:.15rem .7rem;border-radius:999px;border:1px solid currentColor;background:transparent;color:inherit;cursor:pointer}
.pill:hover{background:rgba(255,255,255,.35)}
.pill-on,.pill-on:hover{background:var(--accent);color:var(--on-accent);border-color:var(--accent);font-weight:600}
.pill-end{background:var(--bad);color:#fff;border-color:var(--bad);font-weight:600}
.emuclose-form{margin:0 .25rem 0 0}
.emuclose{background:none;border:0;color:inherit;font:inherit;font-size:1.25rem;line-height:1;cursor:pointer;padding:.1rem .45rem;border-radius:var(--radius)}
.emuclose:hover,.emuclose:focus-visible{text-decoration:none;outline:2px solid currentColor;outline-offset:2px}
@media print{.emubar{display:none!important}}
:focus-visible{outline:3px solid var(--info);outline-offset:2px}
.muted{color:var(--muted)}

.top{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:var(--chrome);color:var(--on-chrome);flex-wrap:wrap}
.top .brandlink{display:inline-flex;align-items:center;gap:.5rem;color:inherit;text-decoration:none}
.top .brand{font-weight:700;letter-spacing:.12em}
.top .brandsub{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;opacity:.7;display:none}
@media (min-width:1100px){.top .brandsub{display:inline}}
.clientlogo{display:inline-flex;align-items:center;margin-left:.25rem}
.clientlogo img{max-height:36px;max-width:180px;display:block}
body.bare .top .clientlogo{margin-left:auto}
.clientlogo-ph{min-width:7rem;height:34px;padding:0 .75rem;border:1px dashed currentColor;border-radius:var(--radius);opacity:.75;align-items:center;justify-content:center;font-size:.78rem;color:inherit;text-decoration:none;display:inline-flex}
.logobox{display:flex;align-items:center;gap:1rem;margin:.5rem 0 .75rem;padding:.75rem;background:var(--chrome);color:var(--on-chrome);border:1px dashed var(--line);border-radius:var(--radius)}
.logobox .muted{color:inherit;opacity:.8}
.clientlogo-img{max-height:40px;max-width:220px}
.previewbar{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;border-radius:var(--radius);background:var(--chrome);color:var(--on-chrome)}
.previewhead{margin:0 0 .25rem!important;padding:.3rem .6rem;border-radius:var(--radius);background:var(--navhead);color:var(--on-navhead);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em}
.previewnav{width:12rem;margin:.75rem 0;padding:.5rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.previewnav p{margin:0}
.previewlink{padding:.3rem .6rem;border-radius:var(--radius)}
.previewon{background:var(--accent);color:var(--on-accent);font-weight:600}
.previewbtn{margin-top:.75rem}.previewbtn .btn{margin:0;pointer-events:none}
ul.schemes{list-style:none;margin:.75rem 0 0;padding:0;display:grid;gap:.5rem}
.scheme{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.5rem .75rem;border:1px solid var(--line);border-radius:var(--radius)}
.scheme-on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.swatch{display:inline-block;width:1.1rem;height:1.1rem;border-radius:50%;border:1px solid var(--line);margin-right:-.25rem}
.scheme .inline-form{margin:0}
.previewbar .grow{flex:1}
.previewbar .clientlogo-ph{opacity:.75}
.h1,.h2,.h3{font-family:var(--font-heading,var(--font))}
input[type=color]{width:5rem;height:2.4rem;padding:.15rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.top .tenant{opacity:.9}
.search{flex:1;min-width:12rem;max-width:34rem;margin-left:auto}
.search input{width:100%;padding:.4rem .6rem;border-radius:var(--radius);border:1px solid transparent}
.usermenu{position:relative;margin-left:auto}
.search+.usermenu{margin-left:0}
.usermenu summary{cursor:pointer;padding:.3rem .5rem;border-radius:var(--radius);list-style:none}
.usermenu summary::-webkit-details-marker{display:none}
.usermenu .menu{position:absolute;right:0;top:100%;z-index:5;min-width:14rem;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:var(--radius);padding:.75rem;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.usermenu .menu a,.linkbtn{display:block;padding:.3rem 0;color:var(--info);background:none;border:0;font:inherit;cursor:pointer;text-align:left;text-decoration:underline}

.chip{display:inline-block;padding:.05rem .55rem;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--text);font-size:.85rem}
.chip-env{border-color:currentColor;color:var(--on-chrome);background:transparent}
.chip-env-dev{background:var(--info-bg);color:var(--info);border-color:var(--info)}
.chip-env-staging{background:var(--warn-bg);color:var(--warn);border-color:var(--warn)}
.st-draft{background:var(--warn-bg);color:var(--warn);border-color:var(--warn)}
.st-published{background:var(--ok-bg);color:var(--ok);border-color:var(--ok)}
.st-retired{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}

.app{display:flex;flex:1;min-height:0}
.nav{overscroll-behavior:contain;width:14.5rem;flex:none;background:var(--surface);border-right:1px solid var(--line);padding:.75rem .5rem;overflow-y:auto}
.navsec{display:flex;align-items:center;justify-content:space-between;width:calc(100% - 1rem);margin:.9rem .5rem .25rem;padding:.35rem .6rem;border:0;border-radius:var(--radius);background:var(--navhead);color:var(--on-navhead);font:inherit;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;text-align:left;cursor:pointer}
.navsec::after{content:"\25BE";font-size:.8rem}
.navsec[aria-expanded="false"]::after{content:"\25B8"}
.navsec:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.navgrp[hidden]{display:none}
.navlink{display:flex;align-items:center;gap:.55rem;padding:.4rem .6rem;border-radius:var(--radius);color:var(--text);text-decoration:none}
.navico{flex:none;opacity:.85}
.navlink.on .navico{opacity:1}
.navlink:hover{background:var(--bg)}
.navlink.on{background:var(--accent);color:var(--on-accent);font-weight:600}
.pane{flex:1;min-width:0;display:flex;flex-direction:column}
.main{flex:1 0 auto;box-sizing:border-box;width:100%;padding:1.25rem 1.5rem;max-width:72rem;min-width:0}
.foot{flex:none}
.main.wide{max-width:none}
.center{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:2rem 1rem}
.foot{padding:.6rem 1rem;background:var(--chrome);color:var(--on-chrome);font-size:.85rem;text-align:center}
.foot a{color:inherit;text-decoration:underline}

.h1{font-size:1.5rem;margin:.2rem 0 1rem}
.h2{font-size:1.1rem;margin:.1rem 0 .6rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.25rem;margin:0 0 1rem}
.card.narrow{width:100%;max-width:30rem}
.notice,.alert{padding:.6rem .9rem;border-radius:var(--radius);border:1px solid;margin:0 0 1rem}
.notice{background:var(--info-bg);color:var(--info);border-color:var(--info)}
.alert{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}

label{display:block;font-weight:600;margin:.7rem 0 .2rem}
label.check{font-weight:400;display:flex;gap:.5rem;align-items:flex-start;margin:.25rem 0}
input[type=text],input[type=email],input[type=password],input[type=search]{width:100%;padding:.5rem .6rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit}
fieldset{border:1px solid var(--line);border-radius:var(--radius);margin:.8rem 0;padding:.4rem .8rem}
legend{font-weight:600;padding:0 .3rem}
.stack>*{margin-top:.3rem}
.method{margin:1rem 0;padding-top:1rem;border-top:1px solid var(--line)}
.method:first-of-type{border-top:0;padding-top:0}
.btn{display:inline-block;margin-top:.8rem;padding:.5rem 1rem;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--text);font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.btn:hover{border-color:var(--accent)}
.btn.pri{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.btn.wide{width:100%}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:.5rem .6rem;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.85rem;color:var(--muted)}
.scroll{overflow-x:auto}
.detail{font-size:.85rem;color:var(--muted);word-break:break-word;max-width:28rem}
details.inline summary{cursor:pointer;color:var(--info);text-decoration:underline}
details.inline form{margin-top:.5rem}
.pager{display:flex;gap:.5rem}
[hidden]{display:none!important}

/* S1 capability model */
select,textarea,input[type=file]{width:100%;padding:.45rem .6rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit}
input[type=file]{padding:.35rem}
.toolbar{display:flex;flex-wrap:wrap;gap:.75rem;align-items:flex-end}
.toolbar>div{min-width:11rem;flex:1 1 11rem}
.toolbar .btn{margin-top:0}
.actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.actions .btn,.inline-form .btn{margin-top:0}
.inline-form{display:inline}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:.25rem 1rem}
.h3{font-size:1rem;margin:1rem 0 .4rem}
.lv{display:inline-block;min-width:1.7rem;padding:0 .3rem;border-radius:4px;background:var(--bg);color:var(--muted);font-size:.75rem;font-weight:700;text-align:center}
.facts{display:grid;grid-template-columns:max-content 1fr;gap:.2rem .8rem}
.facts dt{font-weight:600;color:var(--muted)}
.facts dd{margin:0}
.cm{display:block}
.cm.with-panel{display:grid;grid-template-columns:var(--cmw,20%) .7rem minmax(0,1fr);gap:.3rem;align-items:start}
.cmsplit{align-self:stretch;min-height:22rem;cursor:col-resize;border-radius:var(--radius);background:var(--line);position:relative;touch-action:none}
.cmsplit::after{content:"";position:absolute;left:50%;top:50%;width:2px;height:2.4rem;margin:-1.2rem 0 0 -1px;background:var(--muted);border-radius:1px}
.cmsplit:hover,.cmsplit:focus-visible{background:var(--accent)}
.cmsplit:focus-visible{outline:3px solid var(--info)}
.cmdrag{user-select:none}
.panel{position:sticky;top:.5rem;max-height:calc(100vh - 1rem);overflow:auto}
.cmtree{list-style:none;margin:.3rem 0 0;padding-left:1.1rem;border-left:2px solid var(--line)}
.cmtree.root{padding-left:0;border-left:0}
.cmtree li{margin:.3rem 0}
.tile{display:inline-flex;gap:.75rem;justify-content:space-between;align-items:baseline;min-width:16em;max-width:100%;padding:.3rem .65rem;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--text);text-decoration:none}
a.tile:hover{border-color:var(--accent)}
.cmbar{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center}
.cmctl{display:inline-flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.cmctl[hidden]{display:none}
.cmzoom>.cmctl{position:sticky;top:0;z-index:2;display:flex;gap:.3rem;padding:0 0 .35rem;background:var(--surface);font-size:1rem}
.btn.sm{margin-top:0;padding:.1rem .5rem;font-size:.78rem;line-height:1.3;min-height:0}
.cmzoom{overflow:auto;resize:vertical;height:calc(100vh - 9rem);min-height:22rem;max-height:none;border:1px solid var(--line);border-radius:var(--radius);padding:.5rem;background:var(--surface)}
.cmzoom:focus-visible{outline:3px solid var(--info)}
.cmzoominner{width:max-content;min-width:100%}
.cmzoominner .card{border:0;padding:.25rem 0;box-shadow:none;background:transparent}
.cmhead{display:flex;flex-wrap:wrap;gap:.35rem;align-items:baseline}
summary.cmhead{cursor:pointer;list-style:none}
summary.cmhead::-webkit-details-marker{display:none}
summary.cmhead::before{content:"\25B8";display:inline-block;width:1.1rem;color:var(--muted);transition:transform .12s}
details[open]>summary.cmhead::before{transform:rotate(90deg)}
div.cmhead{padding-left:1.1rem}
.cmtip{position:fixed;z-index:50;max-width:26rem;padding:.6rem .8rem;background:var(--surface);color:var(--text);border:1px solid var(--accent);border-radius:var(--radius);box-shadow:0 4px 18px rgba(0,0,0,.22);font-size:.9rem;pointer-events:none}
.cmtip p{margin:.3rem 0}.cmtip ul{margin:.2rem 0 0;padding-left:1.1rem}.cmtip dl{margin:.3rem 0}
.tile.sel{outline:3px solid var(--info);outline-offset:1px}
.tile.mini{min-width:0;padding:.05rem .5rem;font-size:.85em}
.tname{font-weight:600}
.tlabel{font-size:.82em;white-space:nowrap}
.more{font-size:.85em;margin-left:.5rem}
.t-ok{background:var(--ok-bg);color:var(--ok);border-color:var(--ok)}
.t-info{background:var(--info-bg);color:var(--info);border-color:var(--info)}
.t-warn{background:var(--warn-bg);color:var(--warn);border-color:var(--warn)}
.t-bad{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}
.t-none{background:var(--surface);color:var(--muted);border-style:dashed}
.t-s1{background:color-mix(in srgb,var(--accent) 10%,var(--surface));color:var(--text)}
.t-s2{background:color-mix(in srgb,var(--accent) 24%,var(--surface));color:var(--text)}
.t-s3{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.t-s4{background:var(--chrome);color:var(--on-chrome);border-color:var(--chrome)}
@media (max-width:960px){.cm.with-panel{grid-template-columns:1fr}.cmsplit{display:none}.panel{position:static;max-height:none}.tile{min-width:0;flex-wrap:wrap}}

@media (max-width:760px){
  .app{flex-direction:column}
  .nav{width:auto;border-right:0;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:.25rem}
  .navsec{width:100%}
  .main{padding:1rem}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* S2 repository */
ul.tiles{display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;margin:.5rem 0;padding:0}
ul.tiles li{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);min-width:11rem}
ul.tiles li>a,ul.tiles li>span{display:block;padding:.45rem .75rem;color:var(--text);text-decoration:none}
ul.tiles li>a:hover{outline:2px solid var(--accent);outline-offset:-2px}
ul.tiles strong{font-size:1.35rem;margin-right:.35rem}
ins{text-decoration:none;font-weight:600}
del{opacity:.75}

.doc{max-width:62rem;margin:0 auto;padding:1rem 1.25rem}
.doc h2{margin-top:1.5rem}
.doc .item{border-top:2px solid var(--line);padding-top:.75rem;margin-top:1rem}
.doc .item,.doc table{break-inside:avoid}
progress{width:100%;height:.9rem}
.kpis{display:flex;flex-wrap:wrap;gap:.75rem;margin:0 0 1rem;padding:0;list-style:none}
.kpis li{border:1px solid var(--line);border-radius:var(--radius);padding:.6rem .9rem;min-width:9rem;background:var(--surface)}
.kpis strong{display:block;font-size:1.6rem}
.barrow{display:grid;grid-template-columns:12rem 1fr 3rem;gap:.5rem;align-items:center;margin:.25rem 0}
@media print{
 .noprint,.skip,.top,.nav,.foot.app{display:none!important}
 body,body.printdoc{background:#fff;color:#000}
 .card{border:0;padding:0}
 a{color:#000;text-decoration:none}
}

.heat{border-collapse:collapse;margin:.5rem 0}
.heat th,.heat td{border:1px solid var(--line);text-align:center;min-width:3.2rem;height:2.4rem;padding:.2rem}
.heat .h-low{background:rgba(46,160,67,.28)}
.heat .h-medium{background:rgba(210,153,34,.32)}
.heat .h-high{background:rgba(218,54,51,.36)}
.rate-high{font-weight:700}

/* Reports and dashboards (ADR 0015) */
form.inline{display:inline}
ul.plain{list-style:none;padding:0;margin:.25rem 0}
ul.plain li{margin:.3rem 0}
.frow{display:flex;gap:.5rem;flex-wrap:wrap;margin:.35rem 0}
.frow select,.frow input{flex:1 1 11rem;min-width:0}
div.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:1rem}
.big{font-size:3rem;font-weight:700;margin:.2rem 0}
td.num{text-align:right}
.checks{columns:14rem 3}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1rem}

/* Requirements and the AI interview (ADR 0016) */
dl.kv{display:grid;grid-template-columns:max-content 1fr;gap:.35rem 1rem;margin:.75rem 0}
dl.kv dt{font-weight:600}
dl.kv dd{margin:0}
.chat{display:flex;flex-direction:column;gap:.6rem;margin:.5rem 0}
.chat .msg{padding:.6rem .8rem;border:1px solid var(--line);border-radius:var(--radius,6px);max-width:46rem}
.chat .me{align-self:flex-end;background:rgba(31,70,179,.08)}
.chat .ai{align-self:flex-start}
.chat .who{font-size:.8rem;font-weight:600;margin:0 0 .2rem}
td.x{text-align:center;font-weight:700}
.cand{border:1px solid var(--line);border-radius:var(--radius,6px);padding:.6rem .8rem;margin:.6rem 0}
ol.steps{list-style:none;counter-reset:s;padding:0;margin:.25rem 0 .75rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:.4rem}
ol.steps li{counter-increment:s;padding:.35rem .6rem;border:1px solid var(--line);border-radius:var(--radius,6px);color:var(--muted,#555)}
ol.steps li::before{content:counter(s) ". "}
ol.steps li.done{text-decoration:line-through}
ol.steps li.now{font-weight:700;border-color:currentColor;color:inherit}
form.inline{display:inline}

/* Modules and licences: a compact list with an accordion row per module */
.modlist{border:1px solid var(--line,#d8d8d8);border-radius:var(--radius);margin:1rem 0;background:var(--card,#fff)}
.modrow{display:grid;grid-template-columns:minmax(11rem,2.2fr) 1fr .8fr 1.3fr 5rem;gap:.75rem;align-items:center;padding:.55rem .8rem}
.modhead{font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted,#666);border-bottom:1px solid var(--line,#d8d8d8)}
details.mod{border-bottom:1px solid var(--line,#d8d8d8)}
details.mod:last-child{border-bottom:0}
details.mod>summary{cursor:pointer;list-style:none}
details.mod>summary::-webkit-details-marker{display:none}
details.mod>summary:hover{background:rgba(0,0,0,.03)}
details.mod>summary .modname::before{content:"\25B8";display:inline-block;width:1.1em;transition:transform .12s}
details.mod[open]>summary .modname::before{transform:rotate(90deg)}
.modbody{padding:.2rem 1rem 1rem 1.9rem;border-top:1px dashed var(--line,#d8d8d8)}
.modform{margin:.6rem 0}
.warnt{color:var(--warn,#8a5a00);font-weight:600}
details.modsec{border:1px solid var(--line,#d8d8d8);border-radius:var(--radius);margin:.7rem 0;background:var(--card,#fff)}
details.modsec>summary.modrow{display:block}
@media (max-width:760px){.modrow{grid-template-columns:1fr 1fr}.modhead{display:none}}

/* Responsive layout (0.26.0): phones and narrow windows */
.navtoggle{display:none}
img,svg,video,canvas{max-width:100%}
pre{overflow-x:auto;max-width:100%}
@media (max-width:760px){
  html{-webkit-text-size-adjust:100%}
  .top{gap:.5rem;padding:.5rem .75rem}
  .top .tenant{display:none}
  .top .brandlink img{width:24px;height:24px}
  .navtoggle{display:inline-flex;align-items:center;gap:.4rem;min-height:2.5rem;padding:0 .8rem;border:1px solid currentColor;border-radius:var(--radius);background:transparent;color:inherit;font:inherit;font-weight:600;cursor:pointer;order:-1}
  .search{order:5;flex:1 1 100%;max-width:none;min-width:0;margin-left:0}
  .search input{font-size:1rem;min-height:2.5rem}
  .top .usermenu{margin-left:auto}
  .usermenu summary{max-width:9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .usermenu .menu{max-width:calc(100vw - 1.5rem)}
  .clientlogo img{max-height:28px;max-width:110px}
  .clientlogo-ph{min-width:0}
  .js .nav{display:none}
  .js.navopen .nav{display:block;max-height:70vh;overflow-y:auto}
  .nav{display:block;padding:.5rem}
  .navlink{padding:.65rem .75rem}
  .navsec{width:auto}
  .main{padding:.75rem;max-width:100%}
  .card{padding:.85rem}
  .h1{font-size:1.3rem}
  main table{display:block;position:relative;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .scroll{position:relative}
  th,td{padding:.45rem .5rem}
  input,select,textarea{font-size:1rem}
  input[type=checkbox],input[type=radio]{width:1.2rem;height:1.2rem}
  .btn,button{min-height:2.5rem}
  .actions .btn,.actions button{flex:1 1 auto}
  .tile{min-width:0;width:100%}
  ul.tiles li{min-width:0;flex:1 1 9rem}
  .toolbar>div{flex:1 1 100%;min-width:0}
  .facts,dl.kv{grid-template-columns:1fr}
  .facts dt{margin-top:.5rem}
  .barrow{grid-template-columns:7rem 1fr 2.5rem}
  .grid2{grid-template-columns:1fr}
  .detail{max-width:none}
  .card.narrow{max-width:none}
  .doc{padding:.75rem}
  .foot{padding:.6rem .75rem}
}
@media (max-width:420px){
  .top .brand{font-size:.95rem}
  ul.tiles li{flex:1 1 100%}
}

.applist{margin:.25rem 0 .75rem;padding-left:1.2rem;max-height:18rem;overflow:auto}
/* (?) guide links after headings */
a.help{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:1.35rem;height:1.35rem;margin-left:.45rem;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--muted);font-size:.8rem;font-weight:700;line-height:1;text-decoration:none;vertical-align:middle}
a.help:hover,a.help:focus-visible{border-color:var(--accent);color:var(--accent)}
@media print{a.help{display:none}}
.more-link{margin:.5rem 0 0}
.method + .method{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--line)}

label.check.dim{opacity:.5;cursor:not-allowed}

/* Sign-in page: the other ways in as two compact panels, with request pills */
.card.narrow.auth{max-width:44rem}
.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}
.auth-grid .authpanel{display:flex;flex-direction:column;gap:.75rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.auth-grid .method,.auth-grid .method + .method{margin:0;padding:0;border:0}
.auth-grid .h2{margin:0 0 .25rem;font-size:1rem}
.auth-grid .small{font-size:.85rem;margin:.15rem 0 .5rem}
.auth-grid label{display:block;margin-top:.5rem;font-size:.85rem}
.auth-grid .btn{margin-top:.75rem}
.pillbox{margin-top:auto;border-top:1px solid var(--line);padding-top:.75rem}
.pillbox .pill{display:inline-block;padding:.25rem .8rem;border:1px solid var(--accent);border-radius:999px;color:var(--accent);background:transparent;font-size:.85rem;font-weight:600;cursor:pointer;list-style:none}
.pillbox .pill::-webkit-details-marker{display:none}
.pillbox .pill:hover,.pillbox .pill:focus-visible{background:var(--accent);color:var(--on-accent)}
.pillbox[open]>.pill{background:var(--accent);color:var(--on-accent)}
.pillform{margin-top:.5rem}
@media (max-width:700px){.auth-grid{grid-template-columns:1fr}}
.auth-grid.auth-one{grid-template-columns:1fr}
.auth-grid .authpanel[hidden]{display:none}

/* The menu and the page scroll on their own: the window itself does not scroll on a desktop-width screen. The top bars take what they need
   and the menu and the page share exactly the rest of the screen, so the bottom of a long menu can always be scrolled into view. */
@media (min-width:761px){
  body:has(.app){height:100vh;height:100dvh;overflow:hidden}
  .app{align-items:stretch;overflow:hidden}
  .app>.nav{position:static;align-self:stretch;height:auto;box-sizing:border-box;overflow-y:auto}
  .app>.pane{min-height:0;overflow-y:auto}
}
@media print{body:has(.app){height:auto;overflow:visible}.app,.app>.pane{overflow:visible}.app>.nav{position:static;height:auto}}

/* Menu: shrink to icons only (desktop width), with a name tip on hover and focus. */
.navmini-btn{display:flex;align-items:center;gap:.5rem;width:calc(100% - 1rem);margin:0 .5rem .25rem;padding:.3rem .6rem;border:1px solid var(--line);border-radius:var(--radius);background:transparent;color:var(--text);font:inherit;font-size:.8rem;cursor:pointer}
.navmini-btn:hover{background:var(--bg)}
.navmini-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.navtip{position:fixed;z-index:50;padding:.25rem .6rem;border-radius:var(--radius);background:var(--chrome);color:var(--on-chrome);font-size:.85rem;white-space:nowrap;pointer-events:none;box-shadow:0 2px 6px rgba(0,0,0,.25)}
@media (max-width:760px){.navmini-btn{display:none}}
@media (min-width:761px){
  html.navmini .nav{width:3.6rem;padding:.75rem .3rem}
  html.navmini .navmini-btn{justify-content:center;width:100%;margin:0 0 .25rem;padding:.3rem 0}
  html.navmini .navmini-btn svg{transform:rotate(180deg)}
  html.navmini .navmini-txt,html.navmini .navtxt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  html.navmini .navsec{display:none}
  html.navmini .navgrp[hidden]{display:block}
  html.navmini .navgrp + .navsec + .navgrp{border-top:1px solid var(--line);margin-top:.4rem;padding-top:.4rem}
  html.navmini .navlink{justify-content:center;padding:.6rem 0}
}
body:has(.app)>.emustack,body:has(.app)>.top{flex:none}

/* Wide screens: the page uses the space. Panels (cards without a wide table) sit side by side; drag the divider to resize them. */
@media (min-width:1500px){
  .main.split{max-width:none;display:grid;grid-template-columns:minmax(0,var(--split,50%)) minmax(0,1fr);column-gap:1.25rem;align-items:start;position:relative}
  .main.split>*{grid-column:1/-1}
  .main.split>section.card:not(.full),.main.split>div.card:not(.full){grid-column:auto}
  .main.split>section.card:has(table):not(.half),.main.split>div.card:has(table):not(.half){grid-column:1/-1}
  .main.split>.card{margin-bottom:1.25rem}
  .splitter{position:absolute;top:0;width:12px;margin-left:-6.5px;cursor:col-resize;z-index:5;touch-action:none;background:transparent}
  .splitter::after{content:"";position:absolute;left:5px;top:3rem;bottom:1rem;width:2px;border-radius:1px;background:var(--line)}
  .splitter:hover::after,.splitter:focus-visible::after,.splitter.drag::after{background:var(--accent);width:3px;left:4.5px}
  .splitter:focus-visible{outline:2px solid var(--accent)}
}
@media (max-width:1499px){.splitter{display:none}}
@media print{.splitter{display:none}}
.demobar{background:var(--accent);color:var(--on-accent);text-align:center;padding:.3rem 1rem;font-size:.85rem;font-weight:600}
body:has(.app)>.demobar{flex:none}

/* Page grid: content is rows; a row is columns 1 and 2, or column 12. One page-wide divider moves every row's column 1 / column 2 edge. */
.rows{--c1w:33%;position:relative;display:flex;flex-direction:column;gap:1rem}
.rows>.row{display:grid;grid-template-columns:minmax(0,var(--c1w)) minmax(0,1fr);column-gap:1.25rem;align-items:start}
.rows>.row.r12{grid-template-columns:minmax(0,1fr)}
.rows>.row>.c1,.rows>.row>.c2,.rows>.row>.c12{min-width:0}
.rows.collapsed>.row,.rows.collapsed>.row.r12{grid-template-columns:minmax(0,1fr)}
.rowsplit{position:absolute;top:0;bottom:0;width:14px;margin-left:-7px;cursor:col-resize;touch-action:none;z-index:5}
.rowsplit::after{content:"";position:absolute;left:6px;top:0;bottom:0;width:2px;border-radius:1px;background:var(--accent);opacity:0;transition:opacity .15s}
.rowsplit:hover::after,.rowsplit:focus-visible::after,.rowsplit.drag::after{opacity:1}
.rowsplit:focus-visible{outline:2px solid var(--accent)}
@media (hover:none){.rowsplit::after{opacity:.35}}
.rows.collapsed>.rowsplit{display:none}
@media print{.rowsplit{display:none}.rows>.row{display:block}}