/* DIAMDOR finance prototype. Tokens and look follow the warehouse app (sklad/app/static/styles.css): Manrope, light grey page,
   white panels, square corners, dark primary buttons, orange accent #ef7a38 / bar #FF6A00. The work area is an Excel-like grid. */
@font-face { font-family: 'Manrope'; font-weight: 400 800; font-display: swap; src: url('../fonts/manrope-v20-cyrillic.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Manrope'; font-weight: 400 800; font-display: swap; src: url('../fonts/manrope-v20-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-weight: 400 800; font-display: swap; src: url('../fonts/manrope-v20-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --bg: #f8f9fa; --fg: #1d2024; --card: #fff; --soft: #f1f2f4; --primary: #ef7a38; --muted: #6b7077; --border: #dfe2e6;
  --bad: #b9442f; --ok: #2f8f5b; --warn: #b7791f; --bar: #FF6A00;
  --ok-bg: #eaf7ee; --warn-bg: #fffaf0; --bad-bg: #fdf1ef; --primary-bg: #fff4ea;
  --grid-line: #e4e6ea; --head-bg: #eef0f3; --lock-bg: #f3f3f4; --lock-fg: #9a9ea5;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px;
  --fs-xs: 11px; --fs-sm: 13px; --fs-md: 15px;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 14px/1.4 'Manrope', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif; -webkit-font-smoothing: antialiased; overflow: hidden; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2 { margin: 0; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }

/* ---------------------------------------------------------------- shared controls */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 1px solid var(--fg); background: var(--fg); color: var(--bg); border-radius: 0; font-size: 14px; font-weight: 700; line-height: 1.2; }
.btn:hover { opacity: .9; }
.btn.light { background: var(--card); color: var(--fg); border-color: var(--border); }
.btn.light:hover { border-color: var(--fg); opacity: 1; }
.btn.gold { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn.sm { min-height: 28px; padding: 0 10px; font-size: 12px; }
.btn[disabled] { opacity: .45; pointer-events: none; }
.input { width: 100%; height: 40px; border: 1px solid var(--border); background: var(--card); border-radius: 0; padding: 0 12px; font-size: 14px; outline: none; }
.input:focus { border-color: var(--primary); }
.fld { display: grid; gap: 6px; font-size: 13px; font-weight: 600; color: var(--muted); }
.fld .input { font-weight: 400; color: var(--fg); }
.err { color: var(--bad); font-size: 13px; margin: 8px 0 0; }
.note { color: var(--muted); font-size: 12.5px; margin: 8px 0; line-height: 1.45; }
.toast { position: fixed; left: 50%; top: 44px; z-index: 400; max-width: min(560px, calc(100vw - 28px)); padding: 10px 16px; background: var(--fg); color: var(--bg); font-size: 13px; font-weight: 600; opacity: 0; pointer-events: none; transform: translate(-50%, -8px); transition: opacity .15s, transform .15s; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast.bad { background: var(--bad); color: #fff; }

/* ---------------------------------------------------------------- login / pin screens */
.gate { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; background: var(--bg); padding: 24px; overflow: auto; }
.gate-card { width: 100%; max-width: 400px; display: grid; gap: 14px; padding: 28px; background: var(--card); border: 1px solid var(--border); }
.gate-card img.logo { height: 28px; width: auto; justify-self: start; }
.gate-card h1 { font-size: 20px; font-weight: 700; }
.gate-card .sub { color: var(--muted); font-size: 13px; margin-top: -6px; }

.lock { position: fixed; inset: 0; z-index: 350; display: grid; place-items: center; background: rgba(248, 249, 250, .86); -webkit-backdrop-filter: blur(26px) saturate(1.1); backdrop-filter: blur(26px) saturate(1.1); padding: 20px; overflow: auto; }
.pinbox { width: 100%; max-width: 330px; display: grid; justify-items: center; gap: 14px; text-align: center; }
.pinbox .who { font-weight: 700; font-size: 16px; }
.pinbox .hint { color: var(--muted); font-size: 13px; min-height: 36px; }
.pinbox .hint.bad { color: var(--bad); font-weight: 600; }
.dots { display: flex; gap: 16px; height: 18px; }
.dots i { width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid var(--fg); transition: background .1s, transform .1s; }
.dots i.on { background: var(--fg); transform: scale(1.1); }
.dots.shake { animation: shake .35s; }
@keyframes shake { 20%, 60% { transform: translateX(-9px); } 40%, 80% { transform: translateX(9px); } }
.pad { display: grid; grid-template-columns: repeat(3, 68px); gap: 12px; margin-top: 4px; }
.pad button { height: 68px; border-radius: 50%; border: 0; font-size: 24px; font-weight: 600; color: var(--fg);
  background: linear-gradient(180deg, #fff, #eef0f2); box-shadow: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06), 0 6px 12px -9px rgba(0,0,0,.4); }
.pad button:hover { background: linear-gradient(180deg, #fff, #e6e9ec); }
.pad button:active { transform: scale(.95); }
.pad button.ghost { background: none; box-shadow: none; font-size: 15px; color: var(--muted); }
.pad button.empty { visibility: hidden; }
.pinbox .link { background: none; border: 0; color: var(--muted); font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.pinbox .link:hover { color: var(--fg); }

/* ---------------------------------------------------------------- app shell */
#app { height: 100%; display: flex; flex-direction: column; }
.appbar { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 32px; padding: 0 14px; background: var(--bar); color: #fff; font-size: 12.5px; }
.appbar .brand { font-weight: 800; letter-spacing: .16em; text-transform: uppercase; font-size: 12px; white-space: nowrap; }
.appbar .env { margin-left: 12px; padding: 1px 8px; background: rgba(255,255,255,.22); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.appbar .who { display: flex; align-items: center; gap: 14px; font-size: 13px; }
.appbar .saved { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; opacity: .95; white-space: nowrap; }
.appbar .saved::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #fff; }
.appbar .saved.busy::before { background: transparent; border: 1.5px solid #fff; border-top-color: transparent; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.appbar .countdown { font-variant-numeric: tabular-nums; background: rgba(0,0,0,.25); padding: 1px 8px; font-size: 11px; }
.appbar button.out { background: none; border: 0; padding: 0; color: #fff; font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.shell { flex: 1; min-height: 0; display: flex; }
.main { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 10px 14px 12px 6px; gap: 8px; }

/* dock: vertical, magnifies on hover like the macOS dock */
.dock { flex: none; width: 82px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 10px 0; position: relative; z-index: 20; }
.dock-in { display: flex; flex-direction: column; gap: 7px; padding: 10px 8px; border-radius: 22px; position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(240,242,244,.8)); box-shadow: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(0,0,0,.07), 0 10px 30px -14px rgba(0,0,0,.35); }
.dk { --c: #9a8f86; --ic: color-mix(in srgb, var(--c) 78%, #000); position: relative; display: block; width: 46px; height: 46px; padding: 0; border: 0; border-radius: 14px; isolation: hidden; transform-origin: left center; transition: transform .12s ease-out;
  background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--c) 17%, #fff));
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(0,0,0,.05), inset 0 0 0 1px color-mix(in srgb, var(--c) 38%, transparent), 0 1px 2px rgba(0,0,0,.06), 0 6px 12px -9px color-mix(in srgb, var(--c) 60%, transparent); }
.dk::after { content: ''; position: absolute; left: 8%; right: 8%; top: 1px; height: 45%; border-radius: 12px; pointer-events: none; background: linear-gradient(rgba(255,255,255,.72), rgba(255,255,255,0)); }
.dk svg { position: relative; z-index: 1; width: 24px; height: 24px; margin: 11px; color: var(--ic); fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.dk .lb { position: absolute; left: calc(100% + 12px); top: 50%; transform: translateY(-50%); z-index: 5; white-space: nowrap; padding: 5px 10px; background: var(--fg); color: var(--bg); font-size: 12.5px; font-weight: 600; opacity: 0; pointer-events: none; transition: opacity .1s; }
.dk:hover .lb { opacity: 1; }
.dk .lb small { display: block; font-size: 10.5px; opacity: .65; font-weight: 500; }
.dk.on { box-shadow: inset 0 1px 0 #fff, inset 0 0 0 2px var(--c), 0 8px 14px -8px color-mix(in srgb, var(--c) 60%, transparent); }
.dk.on::before { content: ''; position: absolute; left: -9px; top: 50%; width: 5px; height: 5px; margin-top: -2.5px; border-radius: 50%; background: var(--primary); }
.dock .sep { height: 1px; background: rgba(0,0,0,.1); margin: 2px 6px; }

.tbar { flex: none; display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.tbar .ttl { display: grid; gap: 1px; margin-right: 8px; }
.tbar h1 { font-size: 19px; font-weight: 700; line-height: 1.2; }
.tbar .sub { font-size: 12px; color: var(--muted); }
.filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.filters label { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); font-weight: 600; }
.filters select, .filters input[type=search] { height: 28px; border: 1px solid var(--border); background: var(--card); border-radius: 0; padding: 0 8px; font-size: 12.5px; color: var(--fg); outline: none; }
.filters input[type=search] { width: 150px; }
.filters select:focus, .filters input:focus { border-color: var(--primary); }
.view { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.qlist { overflow: auto; }

/* ---------------------------------------------------------------- the grid: «Excel 2003» (classic grey chrome, column letters, formula bar) */
.gx { --gl: #d0d7e5; --chrome: #ece9d8; --chrome2: #d4d0c8; position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; background: #fff; border: 1px solid #808080; outline: none; font: 12.5px/1.25 Tahoma, 'Segoe UI', Verdana, 'Manrope', sans-serif; }
.gx.emb { flex: none; border: 1px solid #808080; }
.gx-fb { flex: none; display: flex; align-items: stretch; height: 24px; background: linear-gradient(#f7f6f1, #e6e3d6); border-bottom: 1px solid #a7a392; }
.gx-fb .fb-name { width: 78px; display: flex; align-items: center; padding: 0 8px; background: #fff; border: 1px solid #7f9db9; margin: 2px 4px; font-weight: 700; font-variant-numeric: tabular-nums; }
.gx-fb .fb-fx { width: 26px; display: flex; align-items: center; justify-content: center; font: italic 700 13px Georgia, serif; color: #555; border-left: 1px solid #b0ad9c; border-right: 1px solid #b0ad9c; margin: 2px 0; }
.gx-fb .fb-val { flex: 1; min-width: 0; margin: 2px 4px 2px 6px; padding: 0 8px; display: flex; align-items: center; background: #fff; border: 1px solid #7f9db9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gx-sc { position: relative; flex: 1; min-height: 0; overflow: auto; background: #fff; }
.gx.emb .gx-sc { overflow: visible; }
.gx-head { position: sticky; top: 0; z-index: 6; display: flex; flex-direction: column; background: var(--chrome2); }
.gx.emb .gx-head { position: static; }
.gx-hl, .gx-hn { display: flex; }
.gx-hl { height: var(--lh); }
.gx-hn { height: var(--nh); }
.gx-lc { flex: none; display: flex; align-items: center; justify-content: center; font-size: 11px; color: #222; background: linear-gradient(#fbfbf8, #dcd9cb); border-right: 1px solid #8b8878; border-bottom: 1px solid #8b8878; user-select: none; cursor: pointer; }
.gx-lc:hover { background: linear-gradient(#fff, #eae7da); }
.gx-lc.hot { background: linear-gradient(#f4d9a6, #e9bd72); font-weight: 700; }
.gx-hc { position: relative; flex: none; display: flex; align-items: center; gap: 4px; padding: 0 6px; font-weight: 700; color: #111; background: linear-gradient(#fbfbf8, #e3e0d3); border-right: 1px solid #8b8878; border-bottom: 1px solid #5f5d52; user-select: none; overflow: hidden; white-space: nowrap; cursor: pointer; }
.gx-hc.r { justify-content: flex-end; }
.gx-hc:hover { background: linear-gradient(#fff, #efece0); }
.gx-hc.hot { background: linear-gradient(#f9e3b8, #efc885); }
.gx-hc .ar { font-size: 9px; color: #b45309; }
.gx-hc .rs { position: absolute; right: 0; top: 0; bottom: 0; width: 6px; cursor: col-resize; z-index: 2; }
.gx-hc .rs:hover, .gx-hc .rs.on { background: #316ac5; opacity: .5; }
.gx-rn { position: sticky; left: 0; z-index: 4; flex: none; width: var(--rnw); display: flex; align-items: center; justify-content: center; gap: 3px; font-size: 11px; color: #222; background: linear-gradient(90deg, #fbfbf8, #e3e0d3); border-right: 1px solid #5f5d52; user-select: none; cursor: default; font-variant-numeric: tabular-nums; }
.gx-hl .gx-rn.corner { z-index: 7; border-bottom: 1px solid #8b8878; background: linear-gradient(#fbfbf8, #dcd9cb); }
.gx-hn .gx-rn { z-index: 7; border-bottom: 1px solid #5f5d52; }
.gx-row .gx-rn { border-bottom: 1px solid #8b8878; cursor: pointer; }
.gx-row .gx-rn:hover { background: linear-gradient(90deg, #fff, #eae7da); }
.gx-rn.hot { background: linear-gradient(90deg, #f9e3b8, #efc885); font-weight: 700; }
.gx-rn svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.gx-body { position: relative; }
.gx-win { position: absolute; left: 0; top: 0; }
.gx-row { display: flex; height: var(--rh); background: #fff; }
.gx-row.lk { background: #f2f1ec; color: #8f8e86; }
.gx-row.lk .gx-rn { color: #7a7a72; }
.gx-row.flash { animation: flash 1.4s ease-out; }
@keyframes flash { 0%, 30% { background: #fff1c9; } 100% { background: #fff; } }
.gx-c { flex: none; display: flex; align-items: center; padding: 0 5px; border-right: 1px solid var(--gl); border-bottom: 1px solid var(--gl); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: cell; user-select: none; min-width: 0; }
.gx-c > span { overflow: hidden; text-overflow: ellipsis; }
.gx-c.r { justify-content: flex-end; font-variant-numeric: tabular-nums; }
.gx-c.neg { color: #b4281a; }
.gx-c.pos { color: #1a7a43; }
.gx-c.ph { color: #aeb2b8; }
.gx-c.ro { background: #f7f7f2; }
.gx-c.mute { color: #70757c; }
.gx-c.bad { box-shadow: inset 0 0 0 1.5px var(--bad); background: var(--bad-bg); }
.gx-row.lk .gx-c { color: #8f8e86; cursor: not-allowed; }
.gx-c .chkb { width: 13px; height: 13px; border: 1px solid #5f5d52; background: #fff; display: inline-grid; place-items: center; }
.gx-c .chkb.on::after { content: ''; width: 7px; height: 4px; border-left: 2px solid #111; border-bottom: 2px solid #111; transform: rotate(-45deg) translate(1px, -1px); }
.gx-c .exp { font-size: 11px; color: #333; cursor: pointer; padding: 4px 6px; }
.gx-c .nm { color: #70757c; margin-left: 8px; }
.gx-c .q { flex: none; font-weight: 700; margin: 0 8px; }
.gx-c .tag, .pp .tag { font-size: 10.5px; font-weight: 700; border: 1px solid #b9bcc2; padding: 0 5px; color: #555; background: #fff; flex: none; }
.gx-c .tag.ok, .pp .tag.ok { color: #1a7a43; border-color: #1a7a43; background: #eaf7ee; }
.gx-c .tag.gold, .pp .tag.gold { color: #c2540a; border-color: #e8975a; background: #fff4ea; }
.gx-detail { display: block; padding: 6px 12px 8px 46px; background: #f6f5ef; border-bottom: 1px solid #8b8878; overflow: hidden; }
.gx-detail .dtl { display: flex; align-items: center; gap: 18px; height: 26px; margin: 0; font-size: 12px; color: #444; }
.gx-detail .dtl > b { font-size: 12.5px; }
.gx-detail .dtl .neg { color: #b4281a; }
.gx-newbar { position: sticky; z-index: 5; bottom: var(--toth); display: flex; height: var(--newh); background: #fffdf3; border-top: 2px solid #316ac5; }
.gx.emb .gx-newbar, .gx.emb .gx-totbar { position: static; }
.gx-newbar .gx-rn { background: #e8f0fb; color: #316ac5; font-weight: 800; font-size: 15px; border-bottom: 0; cursor: pointer; }
.gx-newbar .gx-c { border-bottom: 0; background: #fffdf3; }
.gx-newbar .gx-c.ph { color: #b9b19a; font-style: italic; }
.gx-totbar { position: sticky; z-index: 5; bottom: 0; display: flex; height: var(--toth); background: var(--chrome2); border-top: 1px solid #5f5d52; font-weight: 700; }
.gx-totbar .gx-rn { background: var(--chrome2); border: 0; }
.gx-totbar .gx-c { border-bottom: 0; cursor: default; background: var(--chrome2); border-right-color: #b8b4a4; }
.gx-cur { position: absolute; z-index: 3; pointer-events: none; border: 2px solid #000; }
.gx-cur::after { content: ''; position: absolute; right: -4px; bottom: -4px; width: 6px; height: 6px; background: #000; border: 1px solid #fff; }
.gx-rng { position: absolute; z-index: 2; pointer-events: none; background: rgba(120, 160, 230, .22); border: 2px solid #000; }
.gx-ed { position: absolute; z-index: 8; border: 2px solid #000; background: #fff; padding: 0 4px; font: inherit; outline: none; box-shadow: 0 3px 10px rgba(0,0,0,.18); }
.gx-ed.r { text-align: right; }
.gx-ed.bad { border-color: var(--bad); }
.gx-edmsg { position: absolute; z-index: 9; background: var(--bad); color: #fff; font-size: 12px; font-weight: 600; padding: 4px 9px; white-space: nowrap; max-width: 420px; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.gx-chips { position: absolute; z-index: 9; display: flex; gap: 6px; white-space: nowrap; }
.gx-chips .chip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; background: #fffbe6; border: 1px solid #c9a227; box-shadow: 0 2px 8px rgba(0,0,0,.18); cursor: pointer; font-size: 12px; }
.gx-chips .chip:hover { background: #fff4bd; }
.gx-chips .chip kbd { font: 10.5px Tahoma, sans-serif; background: #fff; border: 1px solid #aaa; padding: 0 4px; color: #555; }
.gx-chips .chip em { font-style: normal; color: #70757c; }
.gx-status { flex: none; display: flex; align-items: center; gap: 16px; min-height: 24px; padding: 0 8px; background: linear-gradient(#ece9d8, #d9d5c3); border-top: 1px solid #fff; box-shadow: inset 0 1px 0 #fff; font-size: 12px; color: #222; font-variant-numeric: tabular-nums; }
.gx-status .st-l { display: flex; gap: 14px; align-items: center; }
.gx-status .st-ready { padding-right: 14px; border-right: 1px solid #a7a392; font-weight: 600; }
.gx-status .st-r { margin-left: auto; color: #5a5a52; font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gx-status b { font-weight: 700; }
.gx-status .sel { background: #fff; border: 1px solid #7f9db9; padding: 0 8px; }
.gx-status .neg { color: #b4281a; }
.gx-status .pos { color: #1a7a43; }
.gx-status button.mini { height: 18px; padding: 0 8px; border: 1px solid #8b8878; background: #f3f1e7; font-size: 11.5px; color: #b4281a; }
.gx.emb .gx-status { display: none; }

/* popup list (dropdowns, item picker, suggestions) */
.pp { position: fixed; z-index: 250; background: var(--card); border: 1px solid #8d939b; box-shadow: 0 10px 28px rgba(0,0,0,.2); max-height: 296px; overflow: auto; font-size: 13px; }
.pp-i { display: flex; align-items: center; gap: 10px; min-height: 28px; padding: 3px 10px; cursor: pointer; white-space: nowrap; }
.pp-i:hover { background: var(--soft); }
.pp-i.hi { background: var(--primary-bg); box-shadow: inset 3px 0 0 var(--primary); }
.pp-i b { font-variant-numeric: tabular-nums; min-width: 56px; }
.pp-i .nm { flex: 1; overflow: hidden; text-overflow: ellipsis; color: #3d434a; }
.pp-i .st { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.pp-i .sd { color: var(--bad); font-size: 11.5px; font-weight: 600; }
.pp-i.none { color: var(--muted); font-style: italic; }
.pp-i.act { border-top: 1px solid var(--border); color: var(--primary); font-weight: 700; }
.pp-h { padding: 4px 10px; font-size: 11px; color: var(--muted); background: var(--soft); border-bottom: 1px solid var(--border); }
.ctx { position: fixed; z-index: 260; min-width: 190px; background: var(--card); border: 1px solid var(--fg); box-shadow: 0 10px 28px rgba(0,0,0,.2); }
.ctx button { display: block; width: 100%; text-align: left; padding: 8px 14px; border: 0; background: none; font-size: 13px; font-weight: 600; }
.ctx button:hover:not([disabled]) { background: var(--soft); }
.ctx button[disabled] { color: var(--lock-fg); cursor: not-allowed; }

/* quarters screen */
.qtab { border-collapse: collapse; background: var(--card); width: 100%; max-width: 980px; font-size: 13px; }
.qtab th { position: sticky; top: 0; background: var(--head-bg); text-align: left; font-size: 12px; padding: 6px 10px; border: 1px solid #d3d6db; }
.qtab td { padding: 5px 10px; border: 1px solid var(--grid-line); height: 28px; }
.qtab td.r, .qtab th.r { text-align: right; font-variant-numeric: tabular-nums; }
.qtab tr.open td { background: #fffdf8; font-weight: 600; }
.qtab .badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; padding: 0 7px; border: 1px solid var(--border); color: var(--muted); }
.qtab .badge.locked { color: var(--fg); background: var(--soft); border-color: #c9cdd3; }
.qtab .badge.ok { color: var(--ok); border-color: var(--ok); background: var(--ok-bg); }
.qtab .badge.gold { color: var(--primary); border-color: var(--primary); background: var(--primary-bg); }
.err:empty { display: none; }

.gx-c .art { flex: none; font-variant-numeric: tabular-nums; }
.gx-c .nm { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.gx-c.r > * { flex: none; }
.gx-c .tag { flex: none; }

.gx-c.expc { padding: 0; justify-content: center; }
.gx-row.lk .gx-c .nm { color: inherit; }
.gx-newbar .gx-c .nm, .gx-c.mute .nm { color: var(--muted); }

.pp-i b + b { margin-left: 4px; }
.pp-i .q { flex: none; font-weight: 700; margin: 0 4px; }
.pp-i.act { color: #c2540a; }

/* ---------------------------------------------------------------- shield mark, view chrome */
.appbar .shield { height: 22px; width: 22px; margin-right: 10px; }
.gate-card img.logo.shield { height: 52px; width: 52px; }
.main { padding-bottom: 0; }
#views { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.view { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 6px; }
.tbar .ttl h1 { display: flex; align-items: center; gap: 10px; }
.kbadge { font-size: 11px; font-weight: 700; padding: 1px 8px; border: 1px solid #b9bcc2; color: #555; background: #fff; letter-spacing: .02em; }
.kbadge.arch { background: #e8e8e8; color: #666; border-color: #aaa; }
.tbar .cfg { align-self: flex-end; }
.sheets { flex: none; display: flex; align-items: flex-end; gap: 2px; padding: 4px 0 0 2px; overflow-x: auto; background: transparent; }
.sheet { height: 24px; padding: 0 16px; border: 1px solid #8b8878; border-top: 0; background: linear-gradient(#e4e1d3, #cfcbb9); font: 12px Tahoma, 'Segoe UI', sans-serif; color: #333; border-radius: 0 0 6px 6px; white-space: nowrap; }
.sheet:hover { background: linear-gradient(#f1efe4, #dcd8c7); }
.sheet.on { background: #fff; font-weight: 700; color: #000; border-top: 1px solid #fff; margin-top: -1px; height: 25px; box-shadow: 0 2px 0 #fff; }

/* dock additions */
.dkw { position: relative; }
.dkw.sm .dk { width: 34px; height: 34px; border-radius: 11px; margin: 0 6px; }
.dkw.sm .dk svg { width: 18px; height: 18px; margin: 8px; }
.dkw .lb { position: absolute; top: 50%; left: calc(46px * var(--sc, 1) + 12px); transform: translateY(-50%); white-space: nowrap; padding: 5px 10px; background: var(--fg); color: var(--bg); font-size: 12.5px; font-weight: 600; opacity: 0; pointer-events: none; transition: opacity .1s; z-index: 30; }
.dkw .lb small { display: block; font-size: 10.5px; opacity: .65; font-weight: 500; }
.dcap { font-size: 9.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #8d939b; text-align: center; margin: -2px 0 -2px; }
.dk .lb { display: none; }

/* ---------------------------------------------------------------- summary panel */
.panel { flex: none; display: flex; align-items: stretch; gap: 14px; flex-wrap: wrap; padding: 6px 10px; background: linear-gradient(#fbfbf8, #efede2); border: 1px solid #a7a392; font-family: Tahoma, 'Segoe UI', sans-serif; }
.pper { display: flex; align-items: center; gap: 6px; padding-right: 14px; border-right: 1px solid #c9c5b3; }
.pper .seg { display: flex; }
.pper .seg button { height: 26px; padding: 0 10px; border: 1px solid #8b8878; background: linear-gradient(#fbfbf8, #dcd9cb); font: 12px Tahoma, sans-serif; }
.pper .seg button + button { border-left: 0; }
.pper .seg button.on { background: linear-gradient(#cfd9ee, #b4c4e4); border-color: #3a5a99; font-weight: 700; }
.pper select { height: 26px; border: 1px solid #7f9db9; background: #fff; font: 12px Tahoma, sans-serif; padding: 0 4px; }
.pcells { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pc { padding: 2px 10px; min-width: 112px; background: #fff; border: 1px solid #c9c5b3; }
.pc .pl { font-size: 10.5px; color: #666; text-transform: none; }
.pc .pv { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pc.strong { border-color: #316ac5; background: #f2f6fd; }
.pc.now { margin-left: 8px; background: #fffbe6; border-color: #c9a227; }
.pc .neg { color: #b4281a; }
.pc .pos { color: #1a7a43; }
.pcells .op { font-size: 18px; font-weight: 700; color: #777; }
.pnote { margin-left: auto; align-self: flex-end; font-size: 10.5px; color: #888; }

/* ---------------------------------------------------------------- dialogs */
.mdl-ov { position: fixed; inset: 0; z-index: 320; display: flex; align-items: flex-start; justify-content: center; padding: 8vh 16px 16px; background: rgba(20, 22, 26, .45); overflow: auto; }
.mdl { width: 100%; display: grid; gap: 12px; padding: 20px; background: #fff; border: 1px solid #333; box-shadow: 0 20px 50px rgba(0,0,0,.35); }
.mdl h2 { font-size: 18px; margin: 0; }
.mdl .frm { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
.mdl .frm .wide { grid-column: 1 / -1; }
.mdl .frm label, .mdl .lbl { display: grid; gap: 4px; font-size: 12.5px; font-weight: 600; color: #555; }
.mdl .frm .input { height: 34px; font-size: 13.5px; font-weight: 400; color: var(--fg); }
.mdl .mdl-act { display: flex; gap: 8px; justify-content: flex-end; }
.mdl .mdl-act .btn { min-height: 36px; }
.icopick { display: flex; gap: 8px; flex-wrap: wrap; }
.icopick .ic { width: 42px; height: 42px; border: 1px solid var(--border); background: #fff; display: grid; place-items: center; }
.icopick .ic svg { width: 22px; height: 22px; fill: none; stroke: #444; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.icopick .ic.on { border-color: #000; box-shadow: inset 0 0 0 1px #000; background: var(--primary-bg); }
.mdl label.radio { display: flex; align-items: flex-start; gap: 8px; font-weight: 400; color: var(--fg); padding: 6px 0; }
.mdl label.radio input { margin-top: 3px; accent-color: var(--primary); }

/* ---------------------------------------------------------------- dictionaries screen */
.dictwrap { flex: 1; min-height: 0; overflow: auto; padding-bottom: 20px; }
.dict-note { padding: 8px 12px; background: var(--primary-bg); border: 1px solid #f3cfb4; font-size: 13px; line-height: 1.5; margin-bottom: 10px; max-width: 1200px; }
.dict-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(520px, 1fr)); gap: 12px; max-width: 1240px; }
.dict { background: #fff; border: 1px solid #a7a392; padding: 10px 12px; }
.dict h2 { font-size: 15px; margin: 0; }
.dict .sub { font-size: 12px; color: var(--muted); margin: 2px 0 8px; }
.dtab { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.dtab th { text-align: left; font-size: 11px; color: #666; padding: 3px 6px; background: #f1efe4; border: 1px solid #d0d7e5; }
.dtab td { padding: 2px 6px; border: 1px solid #d0d7e5; height: 28px; }
.dtab tr.hid td { opacity: .5; }
.dtab td.r, .dtab th.r { text-align: right; white-space: nowrap; }
.dtab td.mv { width: 44px; white-space: nowrap; }
.dtab td.mv button { border: 0; background: none; font-size: 10px; color: #666; padding: 2px 3px; }
.dtab td.mv button:disabled { opacity: .25; }
.dtab td.act { white-space: nowrap; text-align: right; }
.dtab td.act button { border: 1px solid #b9bcc2; background: #fff; font-size: 11.5px; padding: 2px 8px; margin-left: 4px; }
.dtab td.act button.danger { color: var(--bad); border-color: var(--bad); }
.dtab td.act button:disabled { opacity: .4; }
.dinp, .dsel { height: 26px; border: 1px solid transparent; background: transparent; padding: 0 5px; font: inherit; width: 100%; }
.dinp:hover, .dsel:hover { border-color: #b9bcc2; background: #fff; }
.dinp:focus, .dsel:focus { border-color: #316ac5; background: #fff; outline: none; }
.dinp[readonly] { cursor: default; }
.dadd { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 12.5px; }
.dadd .dinp, .dadd .dsel { border-color: #b9bcc2; background: #fff; width: auto; flex: 1; max-width: 220px; }

.dtab .dsel { min-width: 128px; }
.dtab td:nth-child(3) { min-width: 140px; }

/* confirm box, new-row reset, changed-cell marker, stone line button */
.cfm { position: fixed; z-index: 340; width: 330px; background: #fff; border: 1px solid #000; box-shadow: 0 10px 28px rgba(0,0,0,.3); font: 13px/1.4 'Manrope', sans-serif; }
.cfm .cm { padding: 10px 12px 6px; font-weight: 700; }
.cfm .df { font-weight: 400; margin-top: 4px; color: #333; }
.cfm .cb { display: flex; gap: 8px; padding: 6px 12px 10px; }
.cfm kbd { font: 10.5px Tahoma, sans-serif; background: rgba(255,255,255,.7); border: 1px solid rgba(0,0,0,.25); padding: 0 4px; margin-left: 4px; color: #333; }
.nbpill { position: absolute; left: 52px; top: -26px; height: 24px; padding: 0 10px; background: #fff3f0; border: 1px solid var(--bad); color: var(--bad); font: 600 12px Tahoma, sans-serif; cursor: pointer; z-index: 9; display: inline-flex; align-items: center; gap: 6px; }
.nbpill:hover { background: #ffe3dd; }
.nbpill kbd { font: 10.5px Tahoma, sans-serif; border: 1px solid #d99; padding: 0 4px; background: #fff; }
.gx-c.chg { position: relative; }
.gx-c.chg::after { content: ''; position: absolute; right: 0; top: 0; border-top: 8px solid #c0392b; border-left: 8px solid transparent; }
.gx-c .addst { flex: none; margin-left: 8px; height: 18px; padding: 0 8px; border: 1px solid #316ac5; background: #eef3fc; color: #1d4a99; font: 600 11.5px Tahoma, sans-serif; cursor: pointer; }
.gx-c .addst:hover { background: #316ac5; color: #fff; }
.gx-c .tag.red { color: #fff; background: #c0392b; border-color: #c0392b; }
.tbar { margin-bottom: 12px; }
.filters { padding: 5px 10px; background: #fff; border: 1px solid var(--border); }
.kbadge.draft { background: #fff7d6; border-color: #c9a227; color: #7a5b00; font-size: 10.5px; }

.pdate { width: 92px; height: 22px; border: 1px solid #7f9db9; font: 13px Tahoma, sans-serif; padding: 0 4px; }
.pc.bal { background: #f6fff9; border-color: #9bc9ad; }
.pc .eq { color: #777; }
.pcells.hang { flex-basis: 100%; padding-top: 6px; border-top: 1px dashed #c9c5b3; }
.pcells.hang .hl { font-weight: 700; font-size: 12px; color: #7a2d1a; line-height: 1.2; }
.pcells.hang small { font-weight: 400; color: #888; }
.fchip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; background: #eef3fc; border: 1px solid #316ac5; font-size: 12px; cursor: pointer; }
.pvwrap { max-height: 46vh; overflow: auto; border: 1px solid #c9c5b3; }
.pvt { width: 100%; border-collapse: collapse; font: 12.5px Tahoma, 'Segoe UI', sans-serif; }
.pvt th { position: sticky; top: 0; background: #e9e6d6; text-align: left; padding: 3px 8px; border: 1px solid #c9c5b3; }
.pvt td { padding: 3px 8px; border: 1px solid #e3e1d3; }
.pvt .r, .pvt th.r { text-align: right; font-variant-numeric: tabular-nums; }
.pvt .neg, .qt .neg { color: #b4281a; } .pvt .pos, .qt .pos { color: #1a7a43; }
.pvt tr.bad td { background: #fdf1ef; } .pvt tr.dup td { background: #fffbe6; color: #7a5b00; }
.pvt tfoot td { font-weight: 600; background: #f6f5ef; } .pvt tr.tot td { background: #fffbe6; font-size: 14px; }
.pvsum { margin-right: auto; font-size: 13px; align-self: center; }
.pcsearch { position: relative; } .pcsearch .sugg { position: absolute; left: 0; right: 0; top: 36px; z-index: 5; background: #fff; border: 1px solid #888; } .pcsearch .sugg:empty { display: none; }
.pcsearch .sugg button { display: block; width: 100%; text-align: left; border: 0; background: #fff; padding: 5px 10px; font-size: 13px; } .pcsearch .sugg button:hover { background: var(--primary-bg); }
.pctitle { margin: 8px 0; font-size: 14px; } .pctitle .muted { font-size: 12px; }
.qsum { overflow: auto; flex: 1; min-height: 0; padding-bottom: 20px; max-width: 1060px; }
.qsum h3 { font-size: 14px; margin: 16px 0 6px; } .qsum h3 .muted { font-weight: 400; font-size: 12px; }
.qhead { display: flex; align-items: center; gap: 10px; } .qname { font-size: 22px; min-width: 90px; text-align: center; }
.qnav { width: 32px; height: 32px; border: 1px solid #8b8878; background: linear-gradient(#fbfbf8, #dcd9cb); font-size: 20px; line-height: 1; } .qnav:disabled { opacity: .35; }
.qt { width: 100%; border-collapse: collapse; background: #fff; font: 13px Tahoma, 'Segoe UI', sans-serif; border: 1px solid #a7a392; }
.qt th { background: #e9e6d6; text-align: left; padding: 4px 10px; border: 1px solid #c9c5b3; font-size: 12px; } .qt th.r, .qt td.r { text-align: right; font-variant-numeric: tabular-nums; }
.qt td { padding: 5px 10px; border: 1px solid #e3e1d3; height: 28px; } .qt tr.clk { cursor: pointer; } .qt tr.clk:hover td { background: #eef3fc; }
.qt tr.tot td { background: #f6f5ef; font-weight: 700; } .qt .muted { color: #777; font-size: 12px; }

.qhead .badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; padding: 1px 8px; border: 1px solid var(--border); color: var(--muted); background: #fff; }
.qhead .badge.locked { color: var(--fg); background: var(--soft); border-color: #c9cdd3; } .qhead .badge.ok { color: var(--ok); border-color: var(--ok); background: var(--ok-bg); } .qhead .badge.gold { color: var(--primary); border-color: var(--primary); background: var(--primary-bg); }
.filters select { max-width: 150px; }
.tbar .cfg { align-self: flex-end; }

/* ================= round 3: compact top, explicit save, pending / session states ================= */
:root { --rnw: 62px; }
.main { padding: 6px 14px 0 6px; gap: 5px; }
.view { gap: 5px; position: relative; }
.tbar { position: relative; display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; min-height: 34px; margin: 0; }
.tbar .ttl { display: flex; margin: 0; }
.tbar h1 { font-size: 17px; white-space: nowrap; gap: 8px; }
.qm { display: inline-grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; border: 1px solid #b9bcc2; color: #777; font: 700 11px Tahoma, sans-serif; cursor: help; background: #fff; }
.filters { margin-left: auto; display: flex; gap: 6px; flex-wrap: nowrap; padding: 3px 6px; background: #fff; border: 1px solid var(--border); }
.filters select, .filters input[type=search] { height: 26px; font-size: 12px; max-width: 150px; }
.filters input[type=search] { width: 100px; }
.filters .btn.sm { min-height: 26px; padding: 0 8px; }
.tbar .cfg { align-self: center; white-space: nowrap; min-height: 32px; }
.pbar { position: absolute; inset: 0; z-index: 12; display: flex; align-items: center; gap: 12px; padding: 0 10px; background: #fff3b8; border: 1px solid #c9a227; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.pbar.ok { background: #e6f6ec; border-color: #2f8f5b; color: #1a6b3f; font-weight: 700; }
.pbar.hidden { display: none; }
.pbar .pt { font-weight: 700; font-size: 13.5px; margin-right: auto; }
.pbar .btn { min-height: 30px; font-size: 13px; }
.pbar .btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.pbar kbd, .nbsave kbd, .nbpill kbd { font: 10.5px Tahoma, sans-serif; background: rgba(255,255,255,.7); border: 1px solid rgba(0,0,0,.25); padding: 0 4px; margin-left: 4px; color: #333; }
.appbar .saved.pend { background: #fff; color: #c2410c; padding: 1px 10px; font-weight: 800; }
.appbar .saved.pend::before { background: #ea580c; }
/* thin summary strip */
.panel.thin { display: flex; align-items: center; gap: 12px; flex-wrap: nowrap; height: 30px; padding: 0 8px; overflow: hidden; }
.panel.thin .pper { padding-right: 10px; }
.panel.thin .pper .seg button { height: 22px; padding: 0 8px; font-size: 11.5px; }
.panel.thin .pper select { height: 22px; font-size: 11.5px; }
.pstrip { display: flex; align-items: center; gap: 8px; font: 12.5px Tahoma, 'Segoe UI', sans-serif; white-space: nowrap; overflow: hidden; }
.pstrip .si b { font-variant-numeric: tabular-nums; } .pstrip .so { color: #777; font-weight: 700; }
.pstrip .si.em { background: #f2f6fd; border: 1px solid #316ac5; padding: 0 6px; } .pstrip .si.now { color: #7a5b00; }
.pstrip .neg, .pc .neg { color: #b4281a; } .pstrip .pos, .pc .pos { color: #1a7a43; }
.pstrip .hang { color: #7a2d1a; } .pstrip .sm { font-size: 11px; }
.ptog { margin-left: auto; width: 26px; height: 22px; border: 1px solid #8b8878; background: linear-gradient(#fbfbf8, #dcd9cb); cursor: pointer; font-size: 11px; }
.panel.open { position: relative; }
.panel.open .ptog { position: absolute; right: 8px; top: 6px; margin: 0; }
/* thin bars */
.gx-fb { height: 22px; } .gx-fb .fb-name { margin: 1px 4px; } .gx-fb .fb-val { margin: 1px 4px 1px 6px; } .gx-fb .fb-fx { margin: 1px 0; }
.gx-status { min-height: 22px; font-size: 11.5px; }
.sheet { height: 22px; font-size: 11.5px; } .sheet.on { height: 23px; }
.sheets { padding-top: 2px; }
/* pending / session states: yellow = not saved, green = saved in this session, plain = old */
.gx-newbar { background: #fffbe0; } .gx-newbar .gx-c { background: #fffbe0; }
.gx-row.pnew .gx-c { background: #fff6bf; } .gx-row.pnew .gx-rn { background: linear-gradient(90deg, #fff6bf, #f6e27a); }
.gx-c.pend { background: #ffefa0 !important; box-shadow: inset 0 0 0 1px #d9b300; }
.gx-row.pdel .gx-c { background: #fbeaea !important; color: #a66 !important; text-decoration: line-through; }
.gx-row.snew .gx-c { background: #effaf2; }
.gx-rn .rnn { min-width: 16px; text-align: right; }
.gx-rn .tg { font: 700 9px Tahoma, sans-serif; padding: 0 3px; border-radius: 2px; letter-spacing: .02em; }
.gx-rn .tg.tn { background: #2f8f5b; color: #fff; } .gx-rn .tg.te { background: #8fb7ee; color: #123; }
.legend { display: inline-flex; align-items: center; gap: 5px; color: #555; font-size: 11px; }
.legend .lg { width: 10px; height: 10px; border: 1px solid #aaa; background: #fff; display: inline-block; margin-left: 6px; } .legend .lg.y { background: #ffefa0; border-color: #d9b300; margin-left: 0; } .legend .lg.g { background: #cfeedb; border-color: #2f8f5b; }
.sessn { background: #effaf2; border: 1px solid #2f8f5b; padding: 0 8px; }
.nbpills { position: absolute; left: calc(var(--rnw) + 6px); top: -27px; display: flex; gap: 6px; z-index: 9; }
.nbpills .nbpill { position: static; }
.nbsave { height: 24px; padding: 0 10px; background: #e8f0fb; border: 1px solid #316ac5; color: #1d4a99; font: 700 12px Tahoma, sans-serif; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.nbsave svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.nbsave:hover { background: #316ac5; color: #fff; }
.gx-detail { padding-left: 62px; }
.pvt .was { color: #b4281a; text-decoration: line-through; } .pvt tr.d td { background: #fbeaea; }
/* dock */
.dock-in.scroll { max-height: calc(100% - 4px); overflow-y: auto; overflow-x: hidden; scrollbar-width: none; }
.dock-in.scroll::-webkit-scrollbar { display: none; }
.dtip { position: fixed; z-index: 400; transform: translateY(-50%); padding: 5px 10px; background: var(--fg); color: var(--bg); font-size: 12.5px; font-weight: 600; white-space: nowrap; pointer-events: none; }
.dtip.hidden { display: none; }
.dkw .lb { display: none !important; }
.qsum, .dictwrap { margin-top: 2px; }

.pper .seg button { white-space: nowrap; }
@media (max-width: 1400px) { .pstrip .si.now { display: none; } }
.pstrip { min-width: 0; }
.gx-status .st-l { flex-wrap: nowrap; white-space: nowrap; gap: 10px; } .gx-status .st-r { min-width: 0; }

/* round 3b: header even thinner */
.panel.thin { height: 26px; padding: 0 8px; gap: 10px; }
.pperiod { height: 20px; font: 12px Tahoma, sans-serif; border: 1px solid #7f9db9; background: #fff; }
.panel.thin .ptog { height: 20px; }
.pstrip .sep1 { color: #999; } .pstrip .pdate { height: 18px; width: 82px; font-size: 12px; }
.panel.open .pperiod { margin-right: 10px; }
.gx-fb { height: 24px; } .gx-fb .fb-name, .gx-fb .fb-val { margin-top: 2px; margin-bottom: 2px; }
.tbar { min-height: 32px; }

/* round 3c: quarter checks, report card, reconciliation, reminders */
.dkw .dbadge { position: absolute; right: -4px; top: -4px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: #d32f2f; color: #fff; font: 700 11px Tahoma, sans-serif; display: grid; place-items: center; z-index: 6; box-shadow: 0 0 0 2px #fff; }
.rbanner { display: flex; align-items: center; gap: 10px; padding: 6px 12px; background: #fdecea; border: 1px solid #d32f2f; color: #8a1c1c; font-size: 13.5px; margin-bottom: 4px; }
.rbanner .sp { flex: 1; } .rbanner .btn.sm { min-height: 28px; }
#banner.hidden { display: none; }
.chks { background: #fff; border: 1px solid #a7a392; }
.chk-row { display: flex; gap: 10px; padding: 7px 10px; border-bottom: 1px solid #e3e1d3; }
.chk-row:last-child { border-bottom: 0; }
.chk-row .ck { flex: none; width: 22px; height: 22px; border-radius: 50%; background: #e9e6d6; display: grid; place-items: center; font: 700 12px Tahoma, sans-serif; }
.chk-row.good .ck { background: #cfeedb; color: #1a7a43; } .chk-row.warn .ck { background: #ffe1b3; color: #8a4b00; }
.chk-row .cb { flex: 1; font: 13px Tahoma, 'Segoe UI', sans-serif; }
.chk-row .okline { color: #1a7a43; } .chk-row .muted { color: #777; font-size: 12px; }
.plist { display: grid; gap: 2px; margin-top: 4px; }
.plist a { cursor: pointer; padding: 3px 6px; background: #fff8e6; border: 1px solid #f0d58a; display: block; } .plist a:hover { background: #fff0c4; }
.plist .why { color: #b4281a; font-weight: 600; margin-left: 8px; }
.qt.mini { margin-top: 4px; font-size: 12.5px; } .qt.mini td { height: 26px; padding: 2px 8px; }
.pnum { width: 130px; height: 22px; border: 1px solid #7f9db9; padding: 0 5px; font: 12.5px Tahoma, sans-serif; text-align: right; }
.rcard { background: #fff; border: 1px solid #a7a392; padding: 10px 12px; display: grid; gap: 6px; justify-items: start; font: 13px Tahoma, 'Segoe UI', sans-serif; }
.rst { font-weight: 700; padding: 2px 10px; border: 1px solid #aaa; } .rst.good { color: #1a7a43; border-color: #1a7a43; background: #eaf7ee; } .rst.bad { color: #b4281a; border-color: #b4281a; background: #fdf1ef; } .rst.warn { color: #8a4b00; border-color: #c98a00; background: #fff6e0; }
.rh { font-size: 11.5px; }
.drop { border: 2px dashed #9aa0a8; padding: 22px; text-align: center; background: #fafafa; } .drop.over { background: #eef3fc; border-color: #316ac5; }
.drop .fname { margin-top: 8px; color: #777; } .drop .fname.on { color: #1a7a43; font-weight: 700; }
.lnk { color: #1d4a99; text-decoration: underline; cursor: pointer; }
.cmp { padding: 8px 10px; border: 1px solid #c9c5b3; background: #f6f5ef; font-size: 13px; } .cmp.good { background: #eaf7ee; border-color: #1a7a43; color: #14603a; } .cmp.bad { background: #fdf1ef; border-color: #b4281a; color: #8a1c1c; }
.rtools { margin: 2px 0 6px; font-size: 12.5px; }

/* round 4: row actions live in the row-number cell, never over data */
.nbrn { gap: 2px; padding: 0 2px; }
.nbrn .rnb { width: 25px; height: 21px; padding: 0; border: 1px solid #b9bcc2; background: #f3f3f3; color: #888; display: grid; place-items: center; cursor: pointer; font-size: 12px; line-height: 1; }
.nbrn .rnb svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.nbrn .rnsave.on { background: #316ac5; border-color: #1d4a99; color: #fff; }
.nbrn .rnsave.on:hover { background: #1d4a99; }
.nbrn .rnx { color: #b4281a; border-color: #d99; background: #fff3f0; }
.nbplus { width: 25px; text-align: center; color: #316ac5; font-weight: 800; font-size: 15px; }
.nbpills, .nbsave, .nbpill { display: none !important; }

.qt.evc { margin-bottom: 6px; max-width: 760px; } .rcard { justify-items: stretch; } .rcard .rst, .rcard .btn { justify-self: start; }

/* AI button: first in the dock, separated, with its own gradient tile */
.aigap { height: 14px; margin: 0 6px; border-bottom: 1px solid rgba(0,0,0,.14); }
.dk.aibtn { background: radial-gradient(120% 120% at 20% 10%, #f3e8ff 0%, #c4b5fd 45%, #7c3aed 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.8), inset 0 0 0 1px rgba(124,58,237,.55), 0 6px 14px -6px rgba(124,58,237,.7); }
.dk.aibtn svg { color: #fff; stroke: #fff; fill: rgba(255,255,255,.25); width: 26px; height: 26px; margin: 10px; filter: drop-shadow(0 1px 2px rgba(60,20,120,.5)); }
.dk.aibtn.on { box-shadow: inset 0 1px 0 rgba(255,255,255,.8), inset 0 0 0 2px #4c1d95, 0 8px 16px -6px rgba(124,58,237,.8); }

/* production additions */
.appbar .env { background: #ffd8a8; color: #7a3a00; }
.view.saving .gxhost { opacity: .65; pointer-events: none; }
.rbanner { display: flex; align-items: center; gap: 10px; padding: 6px 12px; background: #fff3d6; border-bottom: 1px solid #f0cf86; font-size: 13px; }

.pper { font-weight: 700; margin-right: 10px; padding: 1px 8px; background: #fff; border: 1px solid var(--border); }
.ppsel { font: inherit; font-size: 12px; max-width: 190px; }
.env { white-space: nowrap; }
.cmp .tol, .tol { color: #8a8f98; font-size: 11px; margin-left: 6px; font-weight: 400; }

.castbar { display: flex; align-items: center; gap: 10px; padding: 6px 12px; background: #eef6ff; border-bottom: 1px solid #b9d4f0; font-size: 13px; }
.castbar span { flex: 1; }
.castn { color: #1d4f91; font-weight: 600; padding: 0 8px; }
.castn.ok { color: #2f7d4f; }
.pdrow { display: flex; gap: 8px; align-items: center; } .pdrow .input { flex: 1; }