/* ILS Command — shared product polish.
   Keep application states and layout in index.html; this layer owns visual hierarchy.
   The Command Center's cc- components have their own stylesheet. */
:root {
  color-scheme: dark;
  --bg: #10171e;
  --panel: #19232d;
  --panel-2: #24313c;
  --line: #35434f;
  --txt: #edf2f6;
  --mut: #a9bac8;
  --mut2: #91a3b2;
  --ui-copper-edge: #d8935e;
  --ui-raised: linear-gradient(155deg, #293742 0%, #1b2630 100%);
  --ui-button: linear-gradient(180deg, #344450 0%, #25343f 55%, #1e2b35 100%);
  --ui-copper: linear-gradient(180deg, #efad79 0%, #d68a52 50%, #bd703b 100%);
  --ui-shadow: 0 5px 0 #0b1119, 0 12px 26px -9px #0009, inset 0 1px 0 #ffffff0e;
  --ui-shadow-soft: 0 7px 20px -8px #000a, inset 0 1px 0 #ffffff0b;
}

body { letter-spacing: .005em; }
body::before {
  background: radial-gradient(50% 45% at 4% 0%, #c8794118, transparent 65%),
    radial-gradient(55% 50% at 94% 100%, #2f53692b, transparent 70%);
}
::selection { background: #c879416b; color: #fff; }
:is(h1, h2, h3) { text-shadow: 0 2px 5px #050b1166; }
:is(button, a, summary, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid #efb487;
  outline-offset: 3px;
}
:is(button, a, summary) { -webkit-tap-highlight-color: #c8794133; }
:is(button, input, textarea, select) { font-family: var(--sans); }
:is(input, textarea, select) {
  border-color: #3b4b58;
  background: #111b24;
  box-shadow: inset 0 2px 6px #0003, 0 1px 0 #ffffff08;
  transition: border-color .15s, box-shadow .15s;
}
:is(input, textarea, select):focus {
  border-color: var(--copper-lt);
  box-shadow: 0 0 0 3px #c8794124, inset 0 2px 6px #0003;
}
input::placeholder, textarea::placeholder { color: #91a2b0; opacity: 1; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--copper); box-shadow: none; }
:is(.plist, .dbody, .colbody, .tblwrap, .fdoc, #dashwrap, #board, .mbody) {
  scrollbar-width: thin;
  scrollbar-color: #576776 #17222c;
  overscroll-behavior: contain;
}
:is(.plist, .dbody, .fdoc, #dashwrap) { scrollbar-gutter: stable; }

/* Shell: quiet navy framing; the active destination carries the copper. */
#app { min-width: 0; height: 100dvh; }
#app > main { min-width: 0; }
#app > aside {
  background: linear-gradient(165deg, #1a2631, #141e28 70%);
  border-right-color: #35424d;
  box-shadow: 8px 0 28px #0002;
}
.brand { padding: 1.4rem 1.15rem 1.15rem; border-bottom-color: #ffffff0b; }
.brand h1 { font-size: 1.13rem; gap: .65rem; letter-spacing: -.02em; }
.brand h1 span { color: var(--copper-lt); }
.brand p { font-size: .64rem; line-height: 1.6; color: var(--mut); letter-spacing: .065em; }
.brand .mark { width: 26px; height: 26px; filter: drop-shadow(0 5px 9px #c8794173); animation: command-mark-float 6s ease-in-out infinite; }
@keyframes command-mark-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
.pfind { padding: .85rem .85rem .25rem; }
.pfind input { min-height: 39px; border-radius: 10px; }
.plist { padding: .35rem .7rem 1.5rem; }
.pgroup { color: #a4b4c2; font-size: .61rem; letter-spacing: .13em; padding: 1.25rem .7rem .55rem; }
.pitem {
  padding: .7rem .7rem;
  margin-bottom: .3rem;
  border: 1px solid #ffffff06;
  border-radius: 10px;
  background: linear-gradient(100deg, #24313c61, #1c283200);
  box-shadow: 0 2px 5px #00000012, inset 0 1px 0 #ffffff03;
  color: #b9c7d2;
}
.pitem > span:first-child { font-size: .82rem; line-height: 1.4; }
.pitem .n { color: #b9c7d2; font-weight: 700; }
.pitem .pv2 { font-size: .6rem; margin-top: .25rem; line-height: 1.4; }
.pitem .hb { margin-top: .38rem; height: 3px; }
.pitem:hover { transform: translateX(2px); background: #283644; border-color: #53606a; }
.pitem.on {
  background: linear-gradient(110deg, #61412f, #302d2b 80%);
  border-color: #9b6845;
  box-shadow: inset 3px 0 0 var(--copper-lt), inset 0 1px 0 #ffffff12, 0 5px 14px #0004;
  color: #fff4e9;
}
.pitem.on .n { color: #ffd2ae; }
.pitem.gold:not(.on) { background: linear-gradient(100deg, #244035, #1b2b2b); border-color: #355646; }
.top {
  padding: 1rem 1.4rem;
  gap: .7rem .9rem;
  background: #141e27f2;
  border-bottom-color: #3a4550;
  box-shadow: 0 5px 20px #0002;
}
.top h2 { font-size: 1.14rem; letter-spacing: -.02em; min-width: 175px; line-height: 1.35; }
.top .sub { color: var(--mut); font-size: .74rem; line-height: 1.45; }
#search { min-height: 38px; border-radius: 10px; max-width: 270px; }
#clock .ct { letter-spacing: -.01em; }
#clock .cd { margin-top: .25rem; letter-spacing: .04em; }
.vtog { padding: 4px; gap: 3px; border-radius: 12px; background: #0d161f; box-shadow: inset 0 2px 6px #0005, 0 1px 0 #ffffff0b; }
.vtog button { min-height: 34px; padding: .5rem .8rem; color: #b2c1cd; border: 1px solid transparent; }
.vtog button:not(.on):hover { background: #2b3a46; border-color: #465867; }
.vtog button.on { background: var(--ui-copper); border-color: #f1b482; color: #1c160f; box-shadow: 0 3px 0 #784725, 0 7px 16px #c8794133, inset 0 1px 0 #ffe1c0; }
.opchip { background: #22313e; border-color: #425361; padding: .5rem .65rem; box-shadow: var(--ui-shadow-soft); }

/* Controls keep their original semantic states and labels. */
:is(.chip, .fcc, .vchip, .fexp, .fback, .fsayb, .sfc, .wtab, .wmore, .hbig, .hact, .mlb, .mbtn, .addbtn, .menu, .pmorebtn, .hshow, .scall, .a0s, .gopen),
.fnav button, .qb button, .mnext .mn {
  box-shadow: 0 3px 0 #0b121a, 0 7px 14px -6px #25445866, inset 0 1px 0 #ffffff10;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
:is(.chip, .fcc, .vchip, .fexp, .fback, .fsayb, .sfc, .wtab, .wmore, .hbig, .hact, .mlb, .mbtn, .menu, .a0s):not(.on):not(.go):not(.call):not(.ok):not(.win),
.fnav button:not(.on), .qb button:not(.win):not(.hot) { background-image: var(--ui-button); }
:is(.chip.on, .fcc.on, .wtab.on, .mbtn.go, .addbtn, .hbig.call), .fnav button.on {
  background: var(--ui-copper);
  color: #20180f;
  border-color: #e8a570;
  box-shadow: 0 3px 0 #76421f, 0 8px 19px -7px #d18a51a1, inset 0 1px 0 #ffe2c4;
}
.chips { gap: .5rem; padding: .8rem 1.5rem; border-bottom-color: #ffffff08; }
.chip { padding: .48rem .8rem; font-size: .77rem; }
:is(.mbtn, .addbtn, .hbig, .mlb) { min-height: 40px; }
.qb button { min-height: 54px; justify-content: center; gap: .35rem; }
.qb button small { font-size: .6rem; line-height: 1.35; }
:is(.chip, .fcc, .vchip, .fexp, .fback, .fsayb, .sfc, .wtab, .wmore, .hbig, .hact, .mlb, .mbtn, .addbtn, .menu, .pmorebtn, .hshow, .scall, .a0s):disabled,
.qb button:disabled { transform: none; box-shadow: none; opacity: .5; cursor: not-allowed; }

/* Consistent material and elevation for all existing rounded panel families. */
:is(.card, .dcard, .ftile, .kard, .fpan, .fsys, .fproto, .cgroup, .gfile, .ocard, .rcard, .npan, .wr, .hspot, .a0main, .o0lane, .mission, .whud, .ophead, .dos, .snap, .dmail.on, .note, .nrest, .intel, .hq, .hprog, .pst, .plr, .ht2, .hpil, .wclr) {
  background: var(--ui-raised);
  box-shadow: var(--ui-shadow);
  border-top-color: #58646d;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
:is(.sec, .brief, .fsay, .flead, .cf.nd, .sangle, .spp, .swatch, .snext, .mwhy, .mhook) {
  box-shadow: var(--ui-shadow-soft);
  background-color: #202a32;
}
:is(.ms2, .m2s, .sw, .ks, .kpi, .rst, .sck, .wq, .sysc, .upr, .mr, .rrow, .hc),
.dos .dstats > div, .ndsplit span, .nsum .n, .mil .st, .wt .w, .opp .o, .route .rs {
  background-color: #1b2935;
  box-shadow: var(--ui-shadow-soft);
  border-top-color: #455765;
}
.fhero:not(.fkard), .fnav { box-shadow: var(--ui-shadow); background-color: #1b2731; }
.kard.on { box-shadow: var(--ui-shadow); }
.col { background: #17232d; box-shadow: 0 7px 22px -10px #000b, inset 0 1px 0 #ffffff09; flex-basis: 298px; }
.colhead { padding: .9rem .95rem; background: #1d2b36; }
.colhead .nm { font-size: .84rem; }
.colhead .ct { padding: .25rem .55rem; font-size: .74rem; }
.colbody { padding: .75rem; gap: .75rem; }
.card { padding: .85rem .9rem; border-radius: 12px; will-change: auto; }
.card .cn { font-size: .89rem; line-height: 1.45; margin-bottom: .48rem; }
.card .cm { gap: .45rem .5rem; line-height: 1.5; }
.card .age { font-size: .68rem; }
.card.ghost { opacity: .35; }
#fly { box-shadow: 0 16px 38px #000b; }
.col.over { box-shadow: 0 0 0 2px var(--sc, var(--copper)), 0 16px 40px #0007; }
.tblwrap th { background: #1a2631; color: #b0c0cd; font-size: .67rem; letter-spacing: .08em; }
.tblwrap td { line-height: 1.5; border-color: #2c3a45; }
tbody tr:hover { transform: none; background: #243541; }
.wr { padding: .8rem; }
.wr .wn { font-size: .91rem; }
.wr .wdoes, .wr .wno { line-height: 1.5; }
.wph { width: 36px; height: 36px; background: var(--ui-button); box-shadow: var(--ui-shadow-soft); }
.wl { gap: .8rem; }

/* Dossier: clearer reading width, larger labels, and a fixed close target. */
#drawer {
  width: min(690px, 96vw);
  background: #15212b;
  border-left-color: #63707a;
  box-shadow: -22px 0 65px #0008;
}
.dhead { background: linear-gradient(120deg, #2b3540, #1c2833); padding: 1.25rem 1.5rem; box-shadow: 0 6px 15px #0002; z-index: 1; }
.dhead h3 { font-size: 1.2rem; line-height: 1.45; letter-spacing: -.02em; padding-right: 2.6rem; }
.dclose { width: 38px; height: 38px; top: .85rem; right: 1rem; border: 1px solid #53606b; border-radius: 10px; background: var(--ui-button); color: #dce5ec; box-shadow: var(--ui-shadow-soft); }
.dclose:hover { border-color: var(--copper-lt); background: #34424e; }
.dbody { padding: 1.3rem 1.5rem 2.5rem; gap: 1.15rem; }
.fld .k { font-size: .69rem; letter-spacing: .08em; margin-bottom: .45rem; }
.fld .v { font-size: .91rem; line-height: 1.65; }
.fld .v a, .brief a, .rbody a { text-underline-offset: 3px; overflow-wrap: anywhere; }
.dmail.on, .snap { padding: 1rem 1.05rem; }
:is(.dmail .mh .k, .snap .sh .k) { font-size: .64rem; letter-spacing: .11em; line-height: 1.5; }
:is(.snap .k, .mto span, .msub .k, .mhook .k, .rfile > summary, .dmore > summary, .rsec h5) { font-size: .61rem; letter-spacing: .09em; line-height: 1.4; }
.snap .sat { font-size: .6rem; }
.sdoes { font-size: .96rem; line-height: 1.6; }
.shas li { margin-bottom: .3rem; line-height: 1.6; }
.mbody { font-size: .9rem; line-height: 1.75; max-height: 25rem; padding: 1rem; background: #111e28; }
.mgn, .mfoot { line-height: 1.6; }
.msub { background-color: #302b26; box-shadow: inset 0 1px 0 #ffffff08; }
.note { padding: 1rem; }
.note .nbody { font-size: .9rem; line-height: 1.7; }
.note .nmeta { gap: .5rem; flex-wrap: wrap; }
.note .nmeta .del { min-width: 30px; min-height: 30px; }
.rfile > summary { background: var(--ui-button); min-height: 38px; box-shadow: var(--ui-shadow-soft); }
.rbody { line-height: 1.7; overflow-wrap: anywhere; }
.rkv { gap: .85rem; padding: .5rem 0; }
.rkv .k { font-size: .66rem; line-height: 1.5; }
.rkv .v { min-width: 0; }
.brief { color: #c5d1db; }
.snap .isrc a { line-height: 1.45; padding: .4rem .5rem; background: #1d2e3c; }

/* Library: solid shelf surfaces and a consistent file navigation bar. */
.fdoc { padding-top: 1.4rem; }
.fnav { background: #192732f5; border-color: #495863; padding: .75rem; }
.fnav button { min-height: 34px; }
.ftiles { gap: 1rem; }
.ftile { padding: 1.1rem; border-top-color: #596b79; }
.ftile .ttl { font-size: 1.06rem; line-height: 1.4; }
.ftile .sub { color: #b4c2cd; font-size: .78rem; line-height: 1.5; }
.ftile .nums { row-gap: .5rem; line-height: 1.4; }
.ftile .nd { font-size: .72rem; line-height: 1.5; padding-top: .6rem; }
.gsearch input { border-color: #546575; }
.sec div, .cf p, .fsay p { line-height: 1.7; }
details.comp > summary { padding-top: .8rem; padding-bottom: .8rem; }
.cnm small { line-height: 1.5; }

@media (hover: hover) and (pointer: fine) {
  :is(.chip, .fcc, .vchip, .fexp, .fback, .fsayb, .sfc, .wtab, .wmore, .hbig, .hact, .mlb, .mbtn, .addbtn, .menu, .pmorebtn, .hshow, .scall, .a0s):not(:disabled):hover,
  .fnav button:not(:disabled):hover, .qb button:not(:disabled):hover, .mnext .mn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 0 #0b1119, 0 10px 21px -6px #47616b66, inset 0 1px 0 #ffffff16;
  }
  :is(.addbtn, .mbtn.go, .hbig.call, .chip.on, .fcc.on, .wtab.on):not(:disabled):hover {
    box-shadow: 0 4px 0 #76421f, 0 12px 23px -7px #d18a51bb, inset 0 1px 0 #ffe2c4;
  }
  :is(.card, .ftile, .ocard, .wr, .hspot, .rcard):not(.ghost):hover {
    transform: translateY(-3px);
    border-color: #b98760;
    box-shadow: 0 6px 0 #0b1119, 0 18px 32px -10px #000b, inset 0 1px 0 #ffffff18;
  }
  :is(.fpan, .fsys, .fproto, .cgroup, .gfile, .npan, .a0main, .o0lane, .mission, .whud, .ophead, .dos, .snap, .dmail.on, .note, .nrest, .intel, .hq, .hprog, .pst, .plr, .ht2, .hpil, .wclr):hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 0 #0b1119, 0 15px 28px -9px #000a, inset 0 1px 0 #ffffff0f;
  }
}

@media (max-width: 1100px) {
  .top { padding: .9rem 1rem; }
  .top h2 { min-width: 165px; }
  .vtog button { padding-inline: .7rem; }
}
@media (max-width: 860px) {
  #app > aside { width: min(310px, 88vw); }
  #app > aside.open { box-shadow: 20px 0 60px #0009; }
  .menu { min-width: 40px; min-height: 38px; }
  #app > main { width: 100%; }
  #drawer { width: min(690px, 100vw); }
}
@media (max-width: 760px) {
  .top { gap: .65rem; padding: .85rem .9rem; }
  .top h2 { min-width: 0; font-size: 1rem; }
  .vtog { flex: 1 1 100%; width: 100%; max-width: 100%; }
  .vtog button { min-height: 38px; font-size: .8rem; }
  #search { max-width: none; flex: 1 1 180px; }
  .chips { gap: .5rem; padding: .8rem .9rem; flex-wrap: nowrap; flex-shrink: 0; }
  .chip { min-height: 36px; }
  #board:not(.atlas-board) { padding: .85rem .9rem 1.5rem; gap: .9rem; }
  /* The Atlas filter stack can be taller than a phone's remaining board viewport.
     Let it scroll away so it cannot cover every company card. */
  #board.atlas-board .atlas-toolbar { position: static; }
  #board.atlas-board .atlas-regions { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; }
  #board.atlas-board .atlas-regions .atlas-btn { flex: 0 0 auto; }
  .col { flex-basis: min(298px, 83vw); }
  .dhead { padding: 1rem 1.15rem; }
  .dhead h3 { font-size: 1.08rem; }
  .dbody { padding: 1rem 1rem 2rem; }
  .dclose { width: 40px; height: 40px; top: .7rem; right: .75rem; }
  .fdoc { padding: 1rem 1rem 3rem; }
  .ftiles { grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); }
  .mbtns { grid-template-columns: 1fr; }
  .mbody { max-height: 30rem; }
  .dmail .mh, .snap .sh { flex-wrap: wrap; row-gap: .45rem; }
  .snap .sat { margin-left: 0; }
  .rkv { flex-direction: column; gap: .25rem; }
  .rkv .k { flex-basis: auto; }
  .fnav { top: -1rem; }
  .fnav select#fpick { min-height: 40px; }
}
@media (max-width: 520px) {
  #drawer { width: 100vw; border-left: 0; }
  :is(input, textarea, select) { font-size: 16px; }
  #search, .pfind input, #fsearch { font-size: 16px; }
  .mbtn { min-height: 44px; }
  .snap .sr { flex-direction: column; gap: .3rem; }
  .snap .sr .k { flex-basis: auto; }
  .sweigh { grid-template-columns: 1fr; }
  .top .sub { font-size: .7rem; }
  .addrow { flex-wrap: wrap; }
  .addrow .hint { flex-basis: 100%; }
  .addrow .addbtn { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .brand .mark { animation: none; }
  :is(.card, .ftile, .ocard, .wr, .hspot, .rcard, .dcard, .kard, .pitem, .fpan, .fsys, .fproto, .cgroup, .gfile, .npan, .a0main, .o0lane, .mission, .whud, .ophead, .dos, .snap, .dmail.on, .note, .nrest, .intel, .hq, .hprog, .pst, .plr, .ht2, .hpil, .wclr):hover,
  button:active, button:hover { transform: none !important; }
}
