/* NPC HUB — global polish layer (ui-ux-pro-max review, 2026-10-13).
   Loaded after the inline styles; style only, no layout logic. Tokens from
   docs/design-system/MASTER.md. Lives in its own file so rewrites of
   index.html cannot drop it. */

/* ---- rhythm: one top gap under the app bar, section spacing 24 / 10 ---- */
.view.on{padding-top:16px}
#v-home.on{padding-top:0}
.sh{margin:24px 4px 10px;font:700 12px/1.2 var(--fs);letter-spacing:.08em;color:var(--ash)}
.view.on > .sh:first-child,.view.on > :first-child > .sh:first-child{margin-top:4px}
.sh[data-dup]{display:none}
.rowbtns{gap:8px;margin:12px 0}
.view p.foot,.view p[data-i18n$="_hint"],.view .hint,.view .foot{color:var(--ash);font:400 13px/1.5 var(--fs)}

/* ---- type: sans everywhere a person reads; mono only for ids, codes, numbers ---- */
.chip,.seg button,.btn,.cell,.kv{font-family:var(--fs)}
.ic-recent .chip{font-family:var(--fm)}
.kv .mono,.stat-n{font-variant-numeric:tabular-nums}

/* ---- inputs: 16px so iOS does not zoom; one control border; labelled height ---- */
input,textarea,select{font-size:16px}
.field input,.field textarea,.field select{min-height:48px;border-radius:12px;border:1px solid var(--ctl);background:var(--ink)}
.field textarea{min-height:96px;line-height:1.5}
.field input:focus,.field textarea:focus{border-color:var(--chalk)}

/* ---- surfaces: one card language (radius 16, hairline, raised) ---- */
.group,.res,.empty,.hl-card,.rg-panel,.ic-hero,.tcard,.cm-hero{border-radius:16px}
.group{border:1px solid var(--edge);overflow:hidden}
.cell{min-height:56px;padding:12px 16px;gap:12px}
.cell .bd b{font:600 15px/1.3 var(--fs)}
.cell .bd small{font:400 13px/1.35 var(--fs);color:var(--ash)}
.cell .val{color:var(--dim)}
.kv{min-height:48px;padding:12px 16px}
.empty,.res .idle{color:var(--ash);font:500 14px/1.5 var(--fs)}
.empty{padding:28px 16px;text-align:center}

/* ---- buttons: primary 48px, secondary 44px, icon + label aligned ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 15px/1 var(--fs);border-radius:14px}
.btn.filled{min-height:48px}
.btn.sm{min-height:44px;font-size:14px}
.btn .i{width:18px;height:18px;flex:none}
.vfoot{margin-top:20px}
.vfoot .btn{flex:1;color:var(--ash)}

/* ---- chips / segments ---- */
.chips{gap:8px}
.chip{min-height:40px;padding:0 14px;font:600 13.5px/1 var(--fs)}
.chip.on,.chip[aria-pressed="true"]{background:var(--chalk);color:var(--ink)}
.seg{gap:4px;padding:4px}
.seg button{min-height:40px;font:600 14px/1 var(--fs)}

/* ---- home ---- */
.greet p{font-family:var(--fs);font-size:14px}
.stat-l{display:inline-flex;align-items:center;gap:6px}
.stat-l .i{width:14px;height:14px;color:var(--ash)}
#home-mods-h{margin-top:28px}

/* ---- icons placed by polish.js into shared chrome ---- */
.ic-sm .i{width:20px;height:20px;color:var(--ash)}

/* ---- second pass (after screenshots) ---- */
html body .chip,html body .seg button{font-family:var(--fs)}
html body .ic-recent .chip,html body .ic-read + .ic-links .chip{font-family:var(--fm)}
html body .greet p{font-family:var(--fs);font-size:14px}
html body .stat-l{display:inline-flex;align-items:center;gap:6px}
/* trend parameters: label left, value right, padded rows inside one card */
#cfg-fields{padding:0}
#cfg-fields .field{display:flex;align-items:center;gap:12px;margin:0;padding:6px 8px 6px 16px;border-bottom:1px solid var(--edge)}
#cfg-fields .field:last-child{border-bottom:0}
#cfg-fields .field > span{flex:1;min-width:0!important;color:var(--ash)!important;font:500 14px/1.3 var(--fs)!important}
#cfg-fields .field input{flex:none;width:112px;min-height:44px;text-align:right;font:600 16px/1 var(--fs);font-variant-numeric:tabular-nums}
#cfg-save{width:100%;margin:12px 0}
#trend-clear{width:100%;margin-top:8px}
/* team header: the screen title is in the app bar; keep only the actions, on the right */
#v-access > .sh > span[data-i18n="access_title"]{display:none}
#v-access > .sh{justify-content:flex-end;gap:4px;margin:0 0 8px}
/* archive presets on one scrolling row */
html body .rg-presets{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
html body .rg-presets::-webkit-scrollbar{display:none}
html body .rg-presets button{flex:none}

/* ---- Archive cards: shorter preview, icon meta ---- */
html body .rg-thumb{aspect-ratio:4/3;max-height:62vh}
.rg-score .i{width:13px;height:13px;vertical-align:-.15em}
.rg-meta{display:flex;flex-wrap:wrap;gap:4px 12px;font:500 13px/1.35 var(--fs);color:var(--ash)}
.rg-meta span{display:inline-flex;align-items:center;gap:4px}
.rg-meta .i{width:14px;height:14px}
.rg-meta .rg-au{color:#93C5FD;font-weight:600}
.rg-title{font:600 16px/1.4 var(--fs)}
.rg-body{padding:12px 14px 6px}
.rg-acts{padding:8px 14px 14px;gap:8px}

/* ---- Home cockpit ---- */
.qa{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 0}
.qa-b{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:76px;padding:10px 6px;border-radius:16px;
  border:1px solid var(--edge);background:var(--slab);color:var(--chalk);font:600 13px/1.2 var(--fs);text-align:center;cursor:pointer}
.qa-b .i{width:22px;height:22px;color:var(--ash)}
.qa-b:active{transform:scale(.97);background:var(--slab2)}
.svc[data-ink="pass"] small{color:var(--pass)}
.svc[data-ink="hold"] small{color:var(--hold)}
.svc[data-ink="fail"] small{color:var(--fail)}
.bot-ic{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--slab2)}
.bot-ic .i{width:18px;height:18px;color:var(--chalk)}

/* ---- Team person cards ---- */
#user-list .cell{align-items:center}
#user-list .ava{flex:none}
.mods{display:inline-flex;flex-wrap:wrap;justify-content:flex-end;gap:4px;max-width:96px}
.mods i{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--slab2);color:var(--chalk);font-style:normal}
.mods i .i{width:14px;height:14px}
.mods em{font:500 12px/1.2 var(--fs);color:var(--dim);font-style:normal}
.pp-ban,.pp-lic{display:inline-flex;align-items:center;gap:4px;margin-top:2px}
.pp-ban{color:var(--fail)!important}
.pp-lic{color:var(--ash)} .pp-lic.soon{color:var(--hold)!important} .pp-lic.over{color:var(--fail)!important}
.pp-ban .i,.pp-lic .i{width:13px;height:13px}
html body .pp-ban,html body .pp-lic{display:flex;align-items:center;gap:5px}
#v-access > .sh a{margin-left:0;padding:0 10px}
#v-access > .sh a:first-of-type{margin-left:auto}
