/*
 * SpaceFive — "Quiet Luxury" skin  (public/skins/quiet-luxury/skin.css)
 *
 * "Quiet Luxury" — warm darkness, champagne gold as earned distinction,
 * fashion-editorial typography, Pinterest masonry photo cards.
 * (Faithful to the original Asset Manager design.)
 */

.asset-app {
  --bg-0:#080808; --bg-1:#121210; --bg-2:#1c1a18; --bg-hover:rgba(255,248,240,.025);
  --tx-0:#e8e4df; --tx-1:#8a8580; --tx-2:#5a5550; --tx-inv:#080808;
  --gold:#c9a96e; --gold-hi:#d4b87a; --gold-lo:rgba(201,169,110,.08);
  --line:rgba(255,248,240,.06); --line-2:rgba(255,248,240,.04);
  --ok:rgba(34,197,94,.55); --ok-bg:rgba(34,197,94,.06);
  --warn:rgba(234,179,8,.6); --warn-bg:rgba(234,179,8,.06);
  --bad:rgba(239,68,68,.6); --bad-bg:rgba(239,68,68,.06);
  --mute:rgba(160,160,168,.55); --mute-bg:rgba(160,160,168,.06);
  --r:10px; --r-lg:16px; --r-full:999px;
  --ease:cubic-bezier(.2,.6,.2,1); --dur:.35s;
}

/* reset the SpaceFive body for the asset app */
body.asset-app {
  margin:0; background:var(--bg-0); color:var(--tx-0);
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Inter','Segoe UI',system-ui,sans-serif;
  font-weight:300; letter-spacing:.005em; -webkit-font-smoothing:antialiased;
}
.asset-app a { color:inherit; text-decoration:none; }

/* header */
.ah {
  position:sticky; top:0; z-index:20; height:56px; display:flex; align-items:center; gap:16px;
  padding:0 24px; background:rgba(8,8,8,.55); backdrop-filter:saturate(120%) blur(30px);
  -webkit-backdrop-filter:saturate(120%) blur(30px); border-bottom:1px solid var(--line-2);
}
.ah .brand { font-weight:500; letter-spacing:-.02em; font-size:16px; }
.ah .brand small { display:block; font-size:9.5px; color:var(--tx-2); letter-spacing:.14em; text-transform:uppercase; margin-top:-2px; }
.ah .sp { flex:1; }
.ah .menu, .sect .tabs { display:contents; }   /* MENU_HTML wrappers: items lay out as direct children */
.ah .who { color:var(--tx-1); font-size:13px; }
.search {
  display:flex; align-items:center; gap:8px; flex:1; max-width:320px;
  background:rgba(255,255,255,.02); border:1px solid var(--line); border-radius:var(--r);
  padding:8px 14px; transition:all var(--dur) var(--ease);
}
.search:focus-within { border-color:rgba(201,169,110,.25); box-shadow:0 0 0 3px rgba(201,169,110,.06); }
.search input { border:none; background:none; outline:none; width:100%; color:var(--tx-0); font:inherit; caret-color:var(--gold); }
.search input::placeholder { color:var(--tx-2); }

/* layout */
.alayout { display:flex; min-height:calc(100vh - 56px); }
.aside { width:220px; flex-shrink:0; padding:24px 16px; border-right:1px solid var(--line-2); }
.aside h4 { color:var(--tx-2); font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:500; margin:0 0 10px 8px; }
.aside + .aside, .aside .grp + .grp { margin-top:26px; }
.chip {
  display:flex; align-items:center; justify-content:space-between; padding:9px 12px; border-radius:var(--r);
  color:var(--tx-1); font-size:14px; cursor:pointer; transition:all var(--dur) var(--ease); border:1px solid transparent;
}
.chip:hover { background:var(--bg-hover); color:var(--tx-0); }
.chip.active { background:var(--bg-2); color:var(--tx-0); }
.chip .n { color:var(--tx-2); font-size:12px; }
.amain { flex:1; padding:28px 32px; min-width:0; }

/* dashboard cards */
.dash { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:28px; }
.dcard { background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r-lg); padding:22px 24px; }
.dcard .l { color:var(--tx-1); font-size:12px; letter-spacing:.06em; text-transform:uppercase; }
.dcard .v { font-size:30px; font-weight:400; letter-spacing:-.02em; margin-top:8px; }
.dcard .v.gold { color:var(--gold); }
.dcard .v.ok { color:#4ade80; } .dcard .v.warn { color:#eab308; }

/* section title */
.sect { display:flex; align-items:baseline; gap:14px; margin:0 0 18px; }
.sect h2 { font-weight:500; letter-spacing:-.02em; font-size:20px; margin:0; }
.sect .c { color:var(--tx-2); font-size:13px; }
.sect .sp { flex:1; }

/* Pinterest masonry cards — the wow */
.cards { column-width:220px; column-gap:16px; }
.acard {
  break-inside:avoid; margin-bottom:16px; background:var(--bg-1); border-radius:14px; overflow:hidden;
  cursor:pointer; transition:transform var(--dur) var(--ease), background var(--dur) var(--ease); display:block;
}
.acard:hover { background:var(--bg-2); transform:translateY(-2px); }
.acard .photo { width:100%; aspect-ratio:4/3; background:var(--bg-2); position:relative; overflow:hidden; }
/* staggered card heights — the Pinterest masonry look */
.acard .photo.pr1 { aspect-ratio:4/3; }
.acard .photo.pr2 { aspect-ratio:1/1; }
.acard .photo.pr3 { aspect-ratio:3/2; }
.acard .photo.pr4 { aspect-ratio:4/5; }
.acard .photo.pr5 { aspect-ratio:5/4; }
.acard .photo img { position:absolute; inset:0; z-index:1; width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s var(--ease); }
.acard:hover .photo img { transform:scale(1.04); }
.acard .photo .ph { position:absolute; inset:0; z-index:0; display:flex; align-items:center; justify-content:center;
  font-size:34px; font-weight:300; letter-spacing:.08em; color:var(--gold); background:linear-gradient(135deg,#1c1a18,#0f0e0d); }
.acard .badge { position:absolute; top:12px; left:12px; z-index:2; }
.acard .body { padding:16px 18px 18px; }
.acard .tag { color:var(--gold); font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.acard .name { font-size:16px; font-weight:500; line-height:1.35; margin:3px 0 6px; }
.acard .meta { color:var(--tx-1); font-size:12.5px; display:flex; justify-content:space-between; }
.acard .val { color:var(--tx-0); }

/* badge */
.badge { display:inline-flex; align-items:center; padding:4px 11px; border-radius:var(--r-full); font-size:11.5px; letter-spacing:.03em; backdrop-filter:blur(8px); }
.badge.active { background:var(--ok-bg); color:var(--ok); }
.badge.maintenance { background:var(--warn-bg); color:var(--warn); }
.badge.disposed { background:var(--bad-bg); color:var(--bad); }
.badge.retired { background:var(--mute-bg); color:var(--mute); }
/* HR statuses */
.badge.on_leave { background:var(--warn-bg); color:var(--warn); }
.badge.probation { background:var(--gold-lo); color:var(--gold); }
.badge.resigned { background:var(--mute-bg); color:var(--mute); }

/* buttons */
.btn { display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 18px; border-radius:var(--r);
  font-size:13px; font-weight:400; cursor:pointer; border:1px solid var(--line); background:none; color:var(--tx-0);
  transition:all var(--dur) var(--ease); }
.btn:hover { border-color:rgba(201,169,110,.2); }
.btn.gold { background:var(--gold); color:var(--tx-inv); border-color:var(--gold); }
.btn.gold:hover { background:var(--gold-hi); }
.btn.ghost { border:none; color:var(--gold); }
.btn.danger { border:none; color:var(--bad); }
.btn.sm { height:30px; padding:0 12px; font-size:12px; }

/* data table (list view) */
.dtable { width:100%; border-collapse:collapse; }
.dtable th { text-align:left; color:var(--tx-2); font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:500; padding:10px 12px; border-bottom:1px solid var(--line); }
.dtable td { padding:12px; border-bottom:1px solid var(--line-2); font-size:14px; }
.dtable tr:hover td { background:var(--bg-hover); }
.dtable .r { text-align:right; }
.dtable .th { display:flex; align-items:center; gap:12px; }
.dtable .th img { width:40px; height:40px; border-radius:8px; object-fit:cover; }
.dtable .th .ph { width:40px; height:40px; border-radius:8px; display:flex; align-items:center; justify-content:center; color:var(--gold); background:linear-gradient(135deg,#1c1a18,#0f0e0d); font-size:14px; }

/* toolbar */
.tools { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:20px; }
.tools select { height:36px; padding:0 12px; border-radius:var(--r); border:1px solid var(--line); background:var(--bg-1); color:var(--tx-0); font:inherit; }

/* forms */
.panel { background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r-lg); padding:26px 28px; max-width:760px; }
.panel h2 { font-weight:500; letter-spacing:-.02em; margin:0 0 20px; }
.form2 { display:grid; grid-template-columns:1fr 1fr; gap:16px 20px; }
.form2 .f { display:block; }
.form2 .f.full { grid-column:1 / -1; }
.form2 .f span { display:block; color:var(--tx-1); font-size:12px; letter-spacing:.04em; margin-bottom:6px; }
.form2 .f input, .form2 .f select {
  width:100%; height:40px; padding:0 12px; border-radius:var(--r); border:1px solid var(--line);
  background:#0d0c0b; color:var(--tx-0); font:inherit;
}
.form2 .f input:focus, .form2 .f select:focus { outline:none; border-color:rgba(201,169,110,.3); box-shadow:0 0 0 3px rgba(201,169,110,.06); }

.muted { color:var(--tx-1); }
@media (max-width:820px){ .dash{grid-template-columns:repeat(2,1fr)} .aside{display:none} .form2{grid-template-columns:1fr} }

/* ── widget wrappers emitted by the skin templates ── */
.sect .tabs { display:contents; }
.detail { display:grid; grid-template-columns:340px 1fr; gap:24px; align-items:start; }
.acard.still { cursor:default; }
.photo-tools { padding:12px; display:flex; gap:8px; flex-wrap:wrap; }
.photo-info { padding:0 12px 12px; font-size:12px; color:var(--tx-1); }
.inline { margin:0; display:inline; }
.dtable .sub { font-size:12px; }
.rowlink { cursor:pointer; }
.form2 .f .file { margin-top:8px; }
.form2 .f.full .btn + .btn { margin-left:6px; }
.sep { border:none; border-top:1px solid var(--line); margin:12px 8px; }
@media (max-width:820px){ .detail{grid-template-columns:1fr} }

/* ── message dialogs (msg.ch): MSGYESNO / MSGGET / MSGMETER … ── */
dialog.dlg { margin:auto; width:min(440px, calc(100vw - 32px)); padding:28px; border:1px solid var(--line); border-radius:var(--r-lg);
  background:var(--bg-1); color:var(--tx-0); box-shadow:0 40px 90px -30px rgba(0,0,0,.9); }
dialog.dlg::backdrop { background:rgba(8,8,8,.62); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
dialog.dlg[open] { animation:dlg-in .28s var(--ease); }
@keyframes dlg-in { from { opacity:0; transform:translateY(10px) scale(.98); } }
.dlg h3 { margin:0 0 8px; font-size:18px; font-weight:500; letter-spacing:-.02em; }
.dlg .dlg-text { margin:0; color:var(--tx-1); font-size:14px; line-height:1.55; }
.dlg .dlg-text:empty { display:none; }
.dlg .f { display:block; margin-top:16px; }
.dlg .f span { display:block; color:var(--tx-1); font-size:12px; letter-spacing:.04em; margin-bottom:6px; }
.dlg .f input, .dlg .f select { width:100%; height:40px; padding:0 12px; border-radius:var(--r); border:1px solid var(--line); background:#0d0c0b; color:var(--tx-0); font:inherit; }
.dlg .f input:focus, .dlg .f select:focus { outline:none; border-color:rgba(201,169,110,.3); box-shadow:0 0 0 3px rgba(201,169,110,.06); }
.dlg-list { display:grid; gap:4px; margin-top:16px; }
.dlg-opt { display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:var(--r); color:var(--tx-1); cursor:pointer; }
.dlg-opt:hover { background:var(--bg-hover); color:var(--tx-0); }
.dlg-opt input { accent-color:var(--gold); }
.dlg-btns { display:flex; gap:8px; justify-content:flex-end; margin-top:22px; }
.dlg-btns .btn.gold, .dlg-btns .btn.danger { order:2; }
.dlg-btns .btn.danger { background:var(--bad-bg); color:var(--bad); border-color:transparent; }
.dlg :focus-visible { outline:1px solid var(--gold); outline-offset:2px; }

/* flash banners (MSGINFO / MSGALERT / MSGSTOP) */
.flashes { padding:14px 24px 0; display:grid; gap:8px; }
.flash { display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:var(--r); font-size:13.5px; border:1px solid var(--line-2); background:var(--bg-1); color:var(--tx-0); animation:dlg-in .3s var(--ease); }
.flash b { font-weight:500; }
.flash b:empty { display:none; }
.flash span { flex:1; }
.flash .x { border:none; background:none; color:inherit; font:inherit; font-size:18px; line-height:1; cursor:pointer; opacity:.6; }
.flash .x:hover { opacity:1; }
.flash.info  { background:var(--gold-lo); color:var(--gold-hi); border-color:rgba(201,169,110,.25); }
.flash.alert { background:var(--warn-bg); color:var(--warn); border-color:rgba(234,179,8,.25); }
.flash.stop  { background:var(--bad-bg);  color:var(--bad);  border-color:rgba(239,68,68,.25); }

/* toasts (TOAST / MSGWAIT) */
#toasts { position:fixed; right:24px; bottom:24px; z-index:40; display:grid; gap:8px; pointer-events:none; }
.toast { padding:11px 16px; border-radius:var(--r); background:var(--bg-2); border:1px solid var(--line); color:var(--tx-0); font-size:13.5px; box-shadow:0 20px 50px -20px rgba(0,0,0,.8); animation:toast-in .35s var(--ease); pointer-events:auto; }
.toast b { color:var(--gold); font-weight:500; margin-right:8px; }
.toast b:empty { display:none; }
.toast.leaving { opacity:0; transform:translateY(6px); transition:all .35s var(--ease); }
@keyframes toast-in { from { opacity:0; transform:translateY(10px); } }

/* job meter (MSGMETER / MSGRUN) */
.meter { margin-top:18px; display:grid; gap:8px; }
.meter progress { width:100%; height:6px; accent-color:var(--gold); border-radius:999px; overflow:hidden; }
.meter progress::-webkit-progress-bar { background:var(--bg-2); border-radius:999px; }
.meter progress::-webkit-progress-value { background:var(--gold); border-radius:999px; transition:width .4s var(--ease); }
.meter-msg { color:var(--tx-1); font-size:13px; }
.meter.done .meter-msg { color:var(--gold); }

/* ── form fields: errors, read-only, memo, checkbox / switch / radio, groups ── */
.form2 .f textarea { width:100%; min-height:96px; padding:10px 12px; border-radius:var(--r); border:1px solid var(--line); background:#0d0c0b; color:var(--tx-0); font:inherit; resize:vertical; }
.form2 .f textarea:focus { outline:none; border-color:rgba(201,169,110,.3); box-shadow:0 0 0 3px rgba(201,169,110,.06); }
.form2 .f input[readonly], .form2 .f textarea[readonly], .form2 .f select[disabled] { color:var(--tx-1); background:var(--bg-2); cursor:not-allowed; }
.form2 .f.err input, .form2 .f.err select, .form2 .f.err textarea { border-color:rgba(239,68,68,.55); }
.err-msg { display:block; margin-top:6px; color:var(--bad); font-size:12px; font-style:normal; }
.form2 .f.check, .form2 .f.switch { display:flex; align-items:center; gap:10px; min-height:40px; margin-top:22px; cursor:pointer; }
.form2 .f.check span, .form2 .f.switch span { margin:0; color:var(--tx-0); font-size:14px; letter-spacing:0; }
.form2 .f.check input { width:18px; height:18px; accent-color:var(--gold); }
.form2 .f.switch input { position:absolute; opacity:0; width:0; height:0; }
.form2 .f.switch i { width:40px; height:22px; border-radius:999px; background:var(--bg-2); border:1px solid var(--line); position:relative; transition:all var(--dur) var(--ease); flex:none; }
.form2 .f.switch i::after { content:''; position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:var(--tx-1); transition:all var(--dur) var(--ease); }
.form2 .f.switch input:checked + i { background:var(--gold); border-color:var(--gold); }
.form2 .f.switch input:checked + i::after { left:21px; background:var(--tx-inv); }
.form2 .f.radio .radios { display:flex; gap:6px; flex-wrap:wrap; }
.ropt { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:var(--r); border:1px solid var(--line); color:var(--tx-1); cursor:pointer; font-size:14px; }
.ropt:hover { color:var(--tx-0); border-color:rgba(201,169,110,.25); }
.ropt input { accent-color:var(--gold); }
.ropt:has(input:checked) { color:var(--gold); border-color:rgba(201,169,110,.4); background:var(--gold-lo); }
.fgroup { grid-column:1 / -1; margin:6px 0 0; padding:16px 18px 18px; border:1px solid var(--line-2); border-radius:var(--r-lg); }
.fgroup legend { padding:0 8px; color:var(--tx-2); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }

/* ── browse: sort links, totals, pager ── */
.dtable th.sortable a { display:inline-flex; align-items:center; gap:6px; color:inherit; }
.dtable th.sortable a:hover { color:var(--tx-0); }
.dtable th.sortable i { width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; opacity:.35; }
.dtable th.sortable i { border-bottom:5px solid currentColor; }
.dtable th.sortable.desc i { border-bottom:none; border-top:5px solid currentColor; }
.dtable th.sortable.asc i, .dtable th.sortable.desc i { opacity:1; color:var(--gold); }
.dtable th.sortable.asc a, .dtable th.sortable.desc a { color:var(--tx-0); }
.dtable td.c, .dtable th.c { text-align:center; }
.dtable tfoot td { border-top:1px solid var(--line); border-bottom:none; color:var(--tx-0); font-weight:500; }
.pager { display:flex; align-items:center; gap:6px; margin-top:14px; }
.pager .range { margin-right:auto; color:var(--tx-1); font-size:12.5px; }
.pager .btn.active { border-color:rgba(201,169,110,.5); color:var(--gold); }

/* ── folder (tabs) ── */
.folder { margin-top:4px; }
.tabs-nav { display:flex; gap:2px; border-bottom:1px solid var(--line-2); margin-bottom:22px; }
.tabs-nav .tab { padding:10px 16px; color:var(--tx-1); font-size:13.5px; cursor:pointer; border-bottom:1px solid transparent; margin-bottom:-1px; transition:all var(--dur) var(--ease); }
.tabs-nav .tab:hover { color:var(--tx-0); }
.tabs-nav .tab.active { color:var(--gold); border-bottom-color:var(--gold); }
.folder .tabpane { display:none; }
.folder .tabpane.active { display:block; animation:dlg-in .25s var(--ease); }

/* ── toolbar (FiveWin button bar) ── */
.toolbar { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin:0 0 20px; }
.toolbar .btn { gap:8px; }
.toolbar .btn.disabled, .toolbar .btn[disabled], .toolbar .btn[aria-disabled='true'] { opacity:.4; pointer-events:none; }
.toolbar .btn.danger { background:none; border:1px solid var(--line); color:var(--bad); }
.toolbar .btn.danger:hover { border-color:rgba(239,68,68,.4); }
.tb-gap { width:1px; height:22px; background:var(--line); margin:0 6px; }
.ico { width:15px; height:15px; background:currentColor; display:inline-block; -webkit-mask:var(--ico) center/contain no-repeat; mask:var(--ico) center/contain no-repeat; }
.ico:not([class*='ico-']) { display:none; }
.ico-new     { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }
.ico-edit    { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16z'/%3E%3C/svg%3E"); }
.ico-delete  { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13'/%3E%3C/svg%3E"); }
.ico-save    { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 4h11l3 3v13H5zM8 4v5h7V4M8 20v-6h8v6'/%3E%3C/svg%3E"); }
.ico-print   { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M7 8V3h10v5M5 8h14v8h-3v4H8v-4H5z'/%3E%3C/svg%3E"); }
.ico-export  { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 4v12M7 11l5 5 5-5M4 20h16'/%3E%3C/svg%3E"); }
.ico-refresh { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M20 12a8 8 0 1 1-2.3-5.7M20 4v5h-5'/%3E%3C/svg%3E"); }
.ico-back    { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M19 12H5M11 6l-6 6 6 6'/%3E%3C/svg%3E"); }
.ico-photo   { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2'/%3E%3Cpath d='M21 16l-5-5-8 8'/%3E%3C/svg%3E"); }
.ico-list    { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 6h12M8 12h12M8 18h12M4 6h.01M4 12h.01M4 18h.01'/%3E%3C/svg%3E"); }
.ico-grid    { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='4' y='4' width='6' height='6'/%3E%3Crect x='14' y='4' width='6' height='6'/%3E%3Crect x='4' y='14' width='6' height='6'/%3E%3Crect x='14' y='14' width='6' height='6'/%3E%3C/svg%3E"); }
.ico-tag     { --ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 12V4h8l9 9-8 8z'/%3E%3Ccircle cx='7.5' cy='8.5' r='1'/%3E%3C/svg%3E"); }

/* ── status bar (MSGBAR) ── */
.msgbar { position:sticky; bottom:0; z-index:15; display:flex; align-items:center; gap:14px; height:32px; padding:0 24px;
  background:rgba(8,8,8,.7); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-top:1px solid var(--line-2);
  color:var(--tx-1); font-size:12px; letter-spacing:.02em; }
.msgbar .sp { flex:1; }
.msgbar .clock { color:var(--tx-2); font-variant-numeric:tabular-nums; }
.msgbar[data-live] .msg::before { content:''; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--gold); margin-right:8px; vertical-align:middle; }

/* ── split (SPLITTER) ── */
.split { display:grid; gap:24px; align-items:start; }
.photo-pane .acard { max-width:340px; }
@media (max-width:820px){ .split{grid-template-columns:1fr !important} }

/* ── lookup, search list, inline edit ── */
.dlg-search { width:100%; height:38px; padding:0 12px; margin-top:12px; border-radius:var(--r); border:1px solid var(--line); background:#0d0c0b; color:var(--tx-0); font:inherit; }
.dlg-search:focus { outline:none; border-color:rgba(201,169,110,.3); }
.dlg-list { max-height:280px; overflow:auto; }
.dtable td[data-edit] { cursor:text; }
.dtable td[data-edit]:hover { box-shadow:inset 0 0 0 1px rgba(201,169,110,.3); border-radius:6px; }
.dtable td.editing { padding:4px 6px; }
.cell-edit { width:100%; height:32px; padding:0 10px; border-radius:6px; border:1px solid var(--gold); background:#0d0c0b; color:var(--tx-0); font:inherit; text-align:inherit; }
.cell-edit:focus { outline:none; box-shadow:0 0 0 3px rgba(201,169,110,.12); }

/* ── report (REPORT … ENDREPORT) ── */
.report .rep-count { color:var(--tx-2); font-size:12.5px; margin-right:6px; }
.report .rep-head { color:var(--tx-1); font-size:13px; margin:-8px 0 18px; }
.report .rep-head:empty, .report .rep-foot:empty { display:none; }
.report .rep-foot { color:var(--tx-2); font-size:12px; margin-top:24px; }
.rep-group { margin-bottom:28px; }
.rep-group h3 { margin:0 0 8px; font-size:15px; font-weight:500; letter-spacing:-.01em; }
.rep-group h3 span { color:var(--tx-2); font-size:11px; letter-spacing:.12em; text-transform:uppercase; margin-right:10px; font-weight:500; }
.rep-grand tfoot td { border-top:2px solid var(--gold); color:var(--gold); font-weight:500; }
@media print {
  body.asset-app { background:#fff; color:#111; }
  .ah, .aside, .msgbar, #toasts, .flashes, .report .btn, .tabs-nav, .toolbar { display:none !important; }
  .amain { padding:0; }
  .dtable th, .dtable td { color:#111; border-color:#ddd; }
  .dtable th { color:#555; }
  .rep-group h3, .rep-group h3 span { color:#111; }
  .rep-grand tfoot td { color:#111; border-top-color:#111; }
  .badge { border:1px solid #999; color:#333 !important; background:none !important; }
}

/* ── Sales (ERP demo): statuses, record view, side panel, steps, timeline, chart, document ── */
.badge.draft     { background:var(--mute-bg); color:var(--mute); }
.badge.quote     { background:rgba(96,165,250,.08); color:rgba(147,197,253,.9); }
.badge.partially_shipped { background:rgba(59,130,246,.10); color:rgba(96,165,250,.9); }
.cal-i.partially_shipped { border-left-color:rgba(96,165,250,.9); } .cal-i.quote { border-left-color:rgba(147,197,253,.6); }
.badge.confirmed { background:var(--gold-lo); color:var(--gold); }
.badge.shipped   { background:rgba(59,130,246,.10); color:rgba(96,165,250,.9); }
.badge.invoiced  { background:rgba(168,85,247,.10); color:rgba(192,132,252,.9); }
.badge.paid      { background:var(--ok-bg); color:var(--ok); }
.badge.cancelled { background:var(--bad-bg); color:var(--bad); }
.badge.on_hold   { background:var(--warn-bg); color:var(--warn); }
.badge.ok        { background:var(--ok-bg); color:var(--ok); }
.badge.low       { background:var(--warn-bg); color:var(--warn); }
.badge.out       { background:var(--bad-bg); color:var(--bad); }
.badge.inactive  { background:var(--mute-bg); color:var(--mute); }
.ah .menu .btn.active { color:var(--gold); }
.chip.warn .n { color:var(--warn); }
.sect .toolbar { margin:0; }
.dtable .sub { display:block; color:var(--tx-2); font-size:12px; margin-top:2px; }

/* dashboard grid */
.dash-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:24px; margin-bottom:28px; align-items:start; }
.dash-narrow { background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r-lg); padding:22px 24px; }
.dash-narrow .sect { margin-bottom:12px; }
.dash-narrow .sect h2 { font-size:15px; }
.dash-narrow .dtable td { padding:10px 8px; font-size:13.5px; }
.dash-narrow .dtable th { padding:6px 8px; }
.dcard .v { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* record view */
.rec-head { display:flex; align-items:flex-end; gap:20px; margin-bottom:18px; }
.eyebrow { color:var(--gold); font-size:11px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:6px; }
.rec-head h2 { margin:0; font-size:28px; font-weight:500; letter-spacing:-.025em; display:flex; align-items:center; gap:14px; }
.rec-head h2 .badge { font-size:12px; }
.rec-sub { color:var(--tx-1); font-size:13.5px; margin-top:6px; }
.rec-grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:24px; align-items:start; margin-top:4px; }
.rec-main .panel { max-width:none; }
.rec-side { display:grid; gap:14px; position:sticky; top:72px; }
@media (max-width:1100px){ .rec-grid, .dash-grid { grid-template-columns:1fr; } .rec-side { position:static; } }

/* info box */
.ibox { background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r-lg); padding:18px 20px 8px; }
.ibox header { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:8px; }
.ibox h4 { margin:0; color:var(--tx-2); font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:500; }
.ibox h4:empty { display:none; }
.ibox-open { color:var(--gold); font-size:12px; }
.ibox dl { margin:0; }
.irow { display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:9px 0; border-top:1px solid var(--line-2); }
.irow:first-child { border-top:none; }
.irow dt { color:var(--tx-1); font-size:12.5px; flex:none; }
.irow dd { margin:0; font-size:14px; text-align:right; min-width:0; overflow-wrap:anywhere; }
.irow dd a { color:var(--gold); }
.irow.gold dd { color:var(--gold); font-size:17px; font-weight:500; }
.irow.ok dd { color:#4ade80; } .irow.warn dd { color:#eab308; } .irow.bad dd { color:#f87171; }
.ibox-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.rec-main .ibox-row .ibox { padding-bottom:10px; }
@media (max-width:820px){ .ibox-row { grid-template-columns:1fr; } }
.rep-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.rep-card .irow { flex-direction:column; align-items:flex-start; gap:4px; padding:12px 0; }
.rep-card .irow dt { color:var(--tx-0); font-size:14px; font-weight:500; }
.rep-card .irow dt::after { content:''; }
.rep-card .irow dd { text-align:left; color:var(--tx-1); font-size:12.5px; }
.rep-card .irow dd a { color:var(--tx-1); }
.rep-card .irow:hover dd a { color:var(--gold); }
@media (max-width:1100px){ .rep-cards { grid-template-columns:1fr; } }

/* steps rail */
.steps { list-style:none; margin:0 0 24px; padding:0; display:flex; gap:0; counter-reset:step; }
.step { flex:1; display:flex; align-items:center; gap:10px; position:relative; color:var(--tx-2); font-size:12.5px; letter-spacing:.02em; }
.step i { width:10px; height:10px; border-radius:50%; border:1px solid var(--line); background:var(--bg-1); flex:none; }
.step::after { content:''; flex:1; height:1px; background:var(--line); margin:0 14px; }
.step:last-child::after { display:none; }
.step.done { color:var(--tx-1); }
.step.done i { background:var(--gold); border-color:var(--gold); }
.step.done::after { background:rgba(201,169,110,.45); }
.step.current { color:var(--gold); font-weight:500; }
.step.current i { background:var(--gold); border-color:var(--gold); box-shadow:0 0 0 4px var(--gold-lo); }
.step.failed { color:var(--bad); }
.step.failed i { background:var(--bad); border-color:var(--bad); }

/* timeline */
.tl { list-style:none; margin:0; padding:0 0 0 6px; border-left:1px solid var(--line); }
.tl-item { position:relative; padding:0 0 18px 20px; }
.tl-item:last-child { padding-bottom:4px; }
.tl-item i { position:absolute; left:-5px; top:5px; width:9px; height:9px; border-radius:50%; background:var(--tx-2); }
.tl-item.gold i { background:var(--gold); } .tl-item.ok i { background:#4ade80; } .tl-item.warn i { background:#eab308; } .tl-item.bad i { background:#f87171; }
.tl-head { display:flex; justify-content:space-between; gap:12px; align-items:baseline; }
.tl-head b { font-weight:500; font-size:13.5px; }
.tl-head time { color:var(--tx-2); font-size:11.5px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.tl-item p { margin:3px 0 0; color:var(--tx-1); font-size:13px; line-height:1.45; }
.tl-item p:empty { display:none; }
.tl-item small { color:var(--tx-2); font-size:11px; }

/* bar chart */
.chart { margin:0; background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r-lg); padding:20px 24px 14px; }
.chart figcaption { display:flex; justify-content:space-between; align-items:baseline; font-size:15px; font-weight:500; letter-spacing:-.01em; margin-bottom:18px; }
.chart figcaption span { color:var(--tx-2); font-size:12px; font-weight:400; }
.cbars { display:flex; align-items:flex-end; gap:10px; height:190px; }
.cbar { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; position:relative; min-width:0; }
.cbar i { display:block; width:100%; max-width:40px; height:calc(var(--h) * 0.78); min-height:2px; border-radius:6px 6px 2px 2px;
  background:linear-gradient(180deg, var(--gold-hi), rgba(201,169,110,.35)); transition:transform var(--dur) var(--ease); }
.cbar:hover i { transform:scaleY(1.02); filter:brightness(1.1); }
.cbar b { position:absolute; bottom:calc(var(--h) * 0.78 + 24px); font-size:10.5px; font-weight:400; color:var(--tx-1); opacity:0; transition:opacity var(--dur); white-space:nowrap; }
.cbar:hover b { opacity:1; }
.cbar span { margin-top:8px; color:var(--tx-2); font-size:11px; letter-spacing:.04em; }

/* order lines */
.lines .hint { color:var(--tx-2); font-size:12px; margin:10px 2px 0; }
.lines .panel.add-line { margin-top:16px; padding:18px 22px; }
.lines .panel.add-line .form2 { grid-template-columns:2fr 1fr 1fr 1fr; align-items:end; }
.lines .panel.add-line .f.full { grid-column:1 / -1; }
.dtable td .btn.sm.danger { border:none; color:var(--bad); height:26px; padding:0 8px; opacity:.5; }
.dtable tr:hover td .btn.sm.danger { opacity:1; }
.dlg .f input[name='amount'], .dlg .f input[name='delta'] { font-size:18px; letter-spacing:.02em; }

/* document (print view) */
.doc-tools { display:flex; align-items:center; gap:10px; margin-bottom:22px; }
.doc-tools .toolbar { margin:0; }
.docpage { max-width:860px; margin:0 auto; background:#fbfaf7; color:#1a1917; border-radius:6px; padding:56px 64px; box-shadow:0 40px 80px -40px rgba(0,0,0,.9); font-weight:400; }
.doc-head { display:flex; justify-content:space-between; align-items:flex-start; padding-bottom:24px; border-bottom:2px solid #1a1917; }
.doc-brand b { display:block; font-size:20px; letter-spacing:-.02em; }
.doc-brand small { display:block; color:#6b6762; font-size:12px; margin-top:4px; }
.doc-kind { text-align:right; }
.doc-kind h1 { margin:0; font-size:30px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:#8a6d3b; }
.doc-no { font-size:15px; color:#1a1917; letter-spacing:.04em; margin-top:4px; }
.doc-meta { display:grid; grid-template-columns:1fr 1fr; gap:40px; padding:28px 0; }
.docpage h5:empty { display:none; }
.docpage h5 { margin:0 0 8px; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:#8a6d3b; font-weight:600; }
.doc-billto b { font-size:16px; }
.doc-billto p { margin:6px 0 0; color:#444; line-height:1.6; font-size:13.5px; }
.doc-ship { padding:0 0 22px; }
.doc-ship p { margin:0; color:#444; font-size:13px; }
.docpage .ibox { background:none; border:none; padding:0; }
.docpage .ibox header { display:none; }
.docpage .irow { border-top-color:#e4e0d8; padding:6px 0; }
.docpage .irow dt { color:#6b6762; }
.docpage .irow dd { color:#1a1917; }
.docpage .irow.gold dd { color:#8a6d3b; }
.docpage .dtable th { color:#6b6762; border-bottom:1px solid #1a1917; }
.docpage .dtable td { color:#1a1917; border-bottom:1px solid #e4e0d8; font-size:13.5px; }
.docpage .dtable tr:hover td { background:none; }
.docpage .dtable tfoot td { border-top:1px solid #1a1917; color:#1a1917; }
.doc-sum { display:grid; grid-template-columns:1.4fr 1fr; gap:40px; padding:28px 0 0; }
.doc-notes p { color:#444; font-size:13px; line-height:1.6; margin:0 0 18px; }
.doc-notes p:empty { display:none; }
.doc-foot { margin-top:40px; padding-top:16px; border-top:1px solid #e4e0d8; color:#8a8580; font-size:11.5px; text-align:center; letter-spacing:.03em; }
@media print {
  .doc-tools, .rec-side, .steps { display:none !important; }
  .docpage { box-shadow:none; padding:0; max-width:none; border-radius:0; background:#fff; }
  .amain.doc { padding:0; }
}

/* ── searchable combo (COMBO … SEARCH) ── */
.combo-search { position:relative; }
.combo-search input[type=search] { margin-bottom:6px; }
.combo-search select[size] { height:auto; padding:6px; }
.combo-search select[size] option { padding:7px 10px; border-radius:6px; }
.combo-search select[size] option:checked { background:var(--gold-lo); color:var(--gold); }
.combo-count { position:absolute; right:12px; top:12px; color:var(--tx-2); font-size:11px; pointer-events:none; }

/* ── month calendar (CALENDAR) ── */
.dash-full { margin-bottom:28px; }
.cal { background:var(--bg-1); border:1px solid var(--line-2); border-radius:var(--r-lg); padding:18px 20px 16px; }
.cal-top { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.cal-top h3 { margin:0; font-size:16px; font-weight:500; letter-spacing:-.01em; min-width:150px; text-align:center; }
.cal-top .btn.sm { width:30px; padding:0; justify-content:center; font-size:16px; }
.cal-sum { color:var(--tx-1); font-size:12.5px; }
.cal-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; }
.cal-h { color:var(--tx-2); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; padding:4px 8px 8px; }
.cal-d { min-height:96px; border-radius:10px; background:rgba(255,248,240,.015); padding:8px 8px 6px; display:flex; flex-direction:column; gap:3px; }
.cal-d.off { background:none; }
.cal-d.weekend { background:rgba(255,248,240,.005); }
.cal-d.busy { background:rgba(201,169,110,.04); }
.cal-d.today { outline:1px solid rgba(201,169,110,.45); }
.cal-n { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:2px; }
.cal-n b { font-weight:500; font-size:12.5px; color:var(--tx-1); }
.cal-d.today .cal-n b { color:var(--gold); }
.cal-n em { font-style:normal; font-size:11px; color:var(--gold); }
.cal-i { display:flex; gap:6px; align-items:baseline; min-width:0; padding:3px 7px; border-radius:6px; font-size:11.5px; line-height:1.3; background:var(--bg-2); border-left:2px solid var(--mute); white-space:nowrap; overflow:hidden; }
.cal-i span { font-weight:500; flex:none; }
.cal-i small { color:var(--tx-1); font-size:11px; overflow:hidden; text-overflow:ellipsis; }
.cal-i:hover { background:var(--bg-hover); }
.cal-i.confirmed { border-left-color:var(--gold); } .cal-i.shipped { border-left-color:rgba(96,165,250,.9); }
.cal-i.invoiced { border-left-color:rgba(192,132,252,.9); } .cal-i.paid { border-left-color:#4ade80; } .cal-i.cancelled { border-left-color:var(--bad); opacity:.6; }
.cal-more { color:var(--tx-2); font-size:11px; padding:0 7px; }
@media (max-width:1100px){ .cal-d { min-height:64px; } .cal-i small { display:none; } }

/* ── mobile: burger menu, sidebar as chips, scrolling tables ── */
.burger { display:none; width:40px; height:40px; border:1px solid var(--line); border-radius:var(--r); background:none; cursor:pointer; padding:0; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.burger i { display:block; width:18px; height:1.5px; background:var(--tx-0); border-radius:2px; transition:transform var(--dur) var(--ease), opacity var(--dur); }
.ah.open .burger i:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.ah.open .burger i:nth-child(2) { opacity:0; }
.ah.open .burger i:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
@media (max-width:820px) {
  .ah { padding:0 16px; gap:10px; }
  .burger { display:flex; margin-left:auto; }
  .ah .sp { display:none; }
  .ah .search { max-width:none; flex:1; padding:7px 12px; }
  .ah .menu { display:none; position:absolute; left:0; right:0; top:56px; flex-direction:column; align-items:stretch; gap:4px; padding:12px 16px 16px;
    background:rgba(8,8,8,.92); backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px); border-bottom:1px solid var(--line); box-shadow:0 30px 60px -30px rgba(0,0,0,.9); }
  .ah.open .menu { display:flex; animation:dlg-in .25s var(--ease); }
  .ah .menu .btn { height:44px; justify-content:flex-start; padding:0 14px; font-size:15px; }
  .ah .menu .btn.ghost { color:var(--tx-0); }
  .ah .menu .btn.ghost.active { color:var(--gold); background:var(--gold-lo); }
  .ah .menu .btn.gold { margin-top:6px; justify-content:center; }
  .ah .menu .sp { display:none; }
  .alayout { display:block; }
  .aside { display:block; width:auto; padding:12px 16px 0; border:none; }
  .aside .grp { margin:0 0 6px; }
  .aside .grp + .grp { margin-top:0; }
  .aside h4 { display:none; }
  .aside .grp, .aside > .chip { display:flex; gap:6px; overflow-x:auto; padding-bottom:8px; scrollbar-width:none; }
  .aside .grp::-webkit-scrollbar { display:none; }
  .aside .chip { flex:none; gap:8px; padding:7px 12px; border:1px solid var(--line); border-radius:999px; font-size:13px; }
  .aside .sep { display:none; }
  .amain { padding:16px; }
  .dash { grid-template-columns:1fr 1fr; gap:10px; }
  .dcard { padding:16px 18px; }
  .dcard .v { font-size:22px; }
  .dtable { display:block; overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch; }
  .rec-head h2 { font-size:22px; }
  .toolbar .btn { padding:0 12px; }
  .tabs-nav { overflow-x:auto; scrollbar-width:none; }
  .cal-d { min-height:52px; padding:4px; gap:2px; }
  .cal-i { padding:2px 4px; gap:0; }
  .cal-i span { font-size:9.5px; overflow:hidden; text-overflow:ellipsis; }
  .cal-i small { display:none; }
  .cal-n em { display:none; }
  .cal-h { padding:4px 2px 6px; font-size:9px; letter-spacing:.06em; }
  .cal-top h3 { min-width:0; font-size:14px; }
  .lines .panel.add-line .form2 { grid-template-columns:1fr 1fr; }
  .docpage { padding:28px 20px; }
  .doc-meta, .doc-sum { grid-template-columns:1fr; gap:18px; }
  .msgbar .clock { display:none; }
}

/* ── first screen: greeting hero, attention chips, stat sub-lines ── */
.hero { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; padding:18px 0 26px; flex-wrap:wrap; }
.hero h1 { margin:0; font-family:'Cormorant Garamond','Times New Roman',serif; font-weight:300; font-size:46px; letter-spacing:-.02em; line-height:1; color:var(--tx-0); }
.hero h1::first-letter { color:var(--gold); }
.hero p { margin:10px 0 0; color:var(--tx-1); font-size:13.5px; letter-spacing:.01em; }
.hero-alerts .aside.alerts { display:flex; gap:8px; flex-wrap:wrap; width:auto; padding:0; border:none; }
.aside.alerts .grp { margin:0; display:contents; }
.aside.alerts h4 { display:none; }
.aside.alerts .chip { gap:10px; padding:8px 14px; border-radius:999px; border:1px solid var(--line); background:var(--bg-1); font-size:12.5px; }
.aside.alerts .chip .n { font-size:12.5px; color:var(--tx-0); font-weight:500; }
.aside.alerts .chip.bad .n { color:#f87171; } .aside.alerts .chip.warn .n { color:#eab308; } .aside.alerts .chip.gold .n { color:var(--gold); }
.aside.alerts .chip:hover { border-color:rgba(201,169,110,.3); background:var(--bg-2); }
.dcard .s { margin-top:8px; color:var(--tx-2); font-size:12px; }
.dcard .s:empty { display:none; }
.dcard .s.up, .trend-up { color:#4ade80; } .dcard .s.down, .trend-down { color:#f87171; }
.dash-narrow .zone .sect { margin-bottom:12px; }
.dash-narrow .zone .sect h2 { font-size:15px; }
@media (max-width:820px){ .hero { padding:8px 0 18px; } .hero h1 { font-size:34px; } .aside.alerts .chip { padding:6px 11px; } .hero-alerts { width:100%; } }
.dash-narrow .zone + .zone { margin-top:22px; padding-top:18px; border-top:1px solid var(--line-2); }
.report .tabs { display:flex; gap:4px; margin-right:10px; }
.report .tabs .btn.sm.active { color:var(--gold); border-color:rgba(201,169,110,.5); }

/* ── grid (GRID … ENDGRID): type-in table ── */
.gridbox { position:relative; }
.grid td.ed { cursor:text; position:relative; }
.grid td.ed:hover { box-shadow:inset 0 0 0 1px rgba(201,169,110,.3); border-radius:6px; }
.grid td.ed:focus-within, .grid td.editing { box-shadow:inset 0 0 0 1px var(--gold); border-radius:6px; padding:4px 6px; }
.grid tr[data-new] td { color:var(--tx-2); }
.grid tr[data-new] td.ed::before { content:'…'; color:var(--tx-2); }
.grid tr[data-new] td.editing::before { content:none; }
.grid tr.saving td { opacity:.55; }
.grid tr.flash-ok td { animation:row-ok .8s var(--ease); }
@keyframes row-ok { from { background:var(--gold-lo); } }
.grid .cell-edit { width:100%; height:32px; padding:0 10px; border-radius:6px; border:none; background:#0d0c0b; color:var(--tx-0); font:inherit; text-align:inherit; }
.grid .cell-edit:focus { outline:none; }
.grid-hint { color:var(--tx-2); font-size:12px; margin:8px 2px 0; }
.grid-hint:empty { display:none; }
.cell-in { width:100%; max-width:120px; height:34px; padding:0 10px; border-radius:6px; border:1px solid var(--line); background:#0d0c0b; color:var(--tx-0); font:inherit; text-align:right; }
.cell-in:focus { outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,169,110,.08); }
.dtable td .btn.sm.danger[data-grid-del] { font-size:16px; line-height:1; }
.form2 .f.embed { margin:0 0 6px; }
.panel.ship-desk { max-width:none; }
.panel.ship-desk .dtable { margin-bottom:10px; }