/* d2builds — Vanguard Dossier. Shared sheet: every page links this and
   sets only :root{--c:<element>} inline. Windows-native type stacks. */
:root{
  --c:#cdb87e;
  --ink:#0e1015; --pnl:#161922; --pnl2:#1a1e28; --ln:#262b36; --ln2:#333a48;
  --tx:#b7bcc6; --ts:#eef1f6; --dm:#767c8c; --ft:#565c6b; --st:#cdb87e;
  --mono:'Cascadia Code','Cascadia Mono',Consolas,ui-monospace,Menlo,monospace;
  --din:'Bahnschrift','DIN Alternate','Segoe UI Semibold',system-ui,sans-serif;
  --sans:'Segoe UI',system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ink);color:var(--tx);font-family:var(--sans);
  font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(1100px 480px at 50% -170px,color-mix(in srgb,var(--c) 13%,transparent),transparent 70%);
  background-attachment:fixed;background-repeat:no-repeat}
.wrap{max-width:880px;margin:0 auto;padding:26px 22px 90px}
a{color:var(--st);text-decoration:none} a:hover{text-decoration:underline}

.back{position:fixed;left:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:30;
  display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:12px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--tx);background:rgba(11,13,18,.93);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);border:1px solid var(--ln2);
  padding:9px 15px;box-shadow:0 10px 26px -12px #000}
.back:hover,.back:active{color:var(--ts);border-color:var(--c);text-decoration:none}

header.hero{position:relative;margin:0 0 24px;padding:20px 22px 17px;overflow:hidden;
  background:linear-gradient(180deg,#12151d,var(--pnl));border:1px solid var(--ln);border-top:2px solid var(--c)}
header.hero::after{content:"REF · SANDBOX 9.7.0";position:absolute;top:13px;right:15px;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;color:var(--ft);border:1px solid var(--ln);padding:2px 7px}
.el-badge{display:inline-block;font-family:var(--din);font-size:11px;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:#0e1015;background:var(--c);padding:3px 11px;margin-bottom:12px}
header.hero h1{font-family:var(--din);font-weight:700;font-size:30px;line-height:1.08;letter-spacing:.02em;
  text-transform:uppercase;color:var(--ts);margin:0}
.hrole{margin-top:9px;font-family:var(--mono);font-size:12.5px;color:var(--dm);letter-spacing:.02em}

header.idx{padding:28px 0 12px;border-bottom:2px solid var(--ln2);margin-bottom:6px}
header.idx h1{font-family:var(--din);font-size:33px;font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;color:var(--ts);margin:0}
header.idx h1::before{content:"▮ ";color:var(--st)}
.meta{font-family:var(--mono);color:var(--dm);font-size:12.5px;letter-spacing:.02em;margin:9px 0 0}

.build-page{counter-reset:sec}
h2{font-family:var(--din);font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:.11em;
  color:var(--ts);margin:32px 0 13px;padding:0 0 7px;border-bottom:1px solid var(--ln);
  display:flex;align-items:baseline;gap:11px}
.build-page>h2{counter-increment:sec}
.build-page>h2::before{content:counter(sec,decimal-leading-zero);font-family:var(--mono);font-size:12px;
  font-weight:400;color:var(--st);border:1px solid var(--ln2);padding:1px 7px;line-height:1.5;flex:none}

blockquote{margin:0 0 22px;padding:14px 20px;background:#0b0d12;border:1px solid var(--ln);
  border-left:3px solid var(--c);font-style:italic;color:#ccd1da;font-size:16px}
blockquote p{margin:0}

table{border-collapse:collapse;width:100%;margin:0 0 20px;background:var(--pnl);border:1px solid var(--ln);font-size:14.5px}
th{font-family:var(--mono);text-align:left;padding:9px 13px;background:#12151d;color:var(--st);
  text-transform:uppercase;font-size:10.5px;letter-spacing:.13em;border-bottom:1px solid var(--ln2)}
td{padding:9px 13px;border-top:1px solid var(--ln);vertical-align:top}
td:first-child{font-family:var(--mono);font-size:12px;color:var(--dm);white-space:nowrap}
tr:hover td{background:#151922}

ul{margin:0 0 20px;padding-left:20px} li{margin:6px 0} li::marker{color:var(--c)}
p{margin:0 0 15px} strong{color:var(--ts);font-weight:600}
strong.item{color:var(--st);white-space:nowrap;font-weight:600}
img.icon{width:21px;height:21px;vertical-align:-5px;margin-right:5px;border-radius:3px;
  border:1px solid var(--ln2);background:#0b0d12}

.grid{display:flex;flex-direction:column;border-top:1px solid var(--ln)}
.card{position:relative;display:grid;grid-template-columns:76px minmax(0,1fr) minmax(120px,auto);
  grid-template-areas:"el name ty" "el sub art" "el role own" "el role gear";gap:2px 16px;align-items:start;
  background:transparent;border:0;border-bottom:1px solid var(--ln);padding:13px 6px 14px 0;color:var(--tx);transition:background .1s}
.card:hover{background:#141821;text-decoration:none}
.card .badge{grid-area:el;align-self:start;justify-self:start;font-family:var(--din);font-size:9.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:#0e1015;padding:2px 7px;margin-top:2px}
.card .ty{grid-area:ty;justify-self:end;font-family:var(--mono);font-size:10px;color:var(--ft);text-transform:uppercase;letter-spacing:.07em}
.card h3{grid-area:name;font-family:var(--din);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;
  color:var(--ts);margin:0;line-height:1.14}
.card .sub{grid-area:sub;font-family:var(--mono);font-size:11px;letter-spacing:.03em;margin:0}
.card .role{grid-area:role;font-family:var(--sans);font-size:13px;color:var(--dm);margin:0;line-height:1.4}
.card .art{grid-area:art;justify-self:end;font-family:var(--mono);font-size:10px;color:var(--dm);letter-spacing:.03em;
  text-align:right;border:0;padding:0;margin:0}
.card .art::before{content:"◆ ";color:var(--ac,#cdb87e);font-size:8px}
.card.notowned{opacity:.5} .card.notowned:hover{opacity:1}
.card .own{grid-area:own;justify-self:end;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;margin:0}
.card .own.yes{color:#3fd380} .card .own.yes::before{content:"✓ "}
.card .own.no{color:#6b6f78} .card .own.no::before{content:"✗ "}
.card .gear{grid-area:gear;justify-self:end;font-family:var(--mono);font-size:10px;margin:0}
.card .gear::before{content:"⚙ ";opacity:.8}
.card .gear.ready{color:#3fd380} .card .gear.close{color:#d8b34a} .card .gear.far{color:#9a6d6d}

.gearbox{font-family:var(--mono);background:var(--pnl);border:1px solid var(--ln);border-left:3px solid var(--dm);
  padding:11px 16px;margin:0 0 20px;font-size:13px;color:var(--tx)}
.gearbox.ready{border-left-color:#3fd380} .gearbox.close{border-left-color:#d8b34a} .gearbox.far{border-left-color:#9a6d6d}
.gearbox .glabel{color:#3fd380;font-weight:700;font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;margin-right:7px}
.gearbox.close .glabel{color:#d8b34a} .gearbox.far .glabel{color:#9a6d6d}
.gearbox b{color:var(--ts)} .gspread{margin-top:6px;font-size:11.5px;color:var(--dm)} .gnote{color:var(--ft)}

.ownlbl{font-family:var(--mono);color:var(--ft);font-size:11px;text-transform:uppercase;letter-spacing:.1em;margin-right:3px;align-self:center}
.ownsummary{font-family:var(--mono);text-align:left;margin:8px 0 0;font-size:13px;color:var(--dm)}
.ownsummary .ok{color:#3fd380;font-weight:700} .ownsummary a{color:var(--st)}

.facts{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12.5px;color:var(--tx);
  background:var(--pnl);border:1px solid var(--ln);border-left:3px solid #3fd380;padding:6px 14px;margin:0 0 20px}
.facts .factlbl{color:#3fd380;font-weight:700;font-size:10.5px;text-transform:uppercase;letter-spacing:.12em}

.actions{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 20px}
.act{display:inline-flex;align-items:center;font-family:var(--mono);font-size:11.5px;letter-spacing:.03em;color:var(--tx);
  background:var(--pnl);border:1px solid var(--ln2);padding:7px 14px;cursor:pointer;text-transform:uppercase}
.act:hover{color:var(--ts);border-color:var(--c);text-decoration:none}
.act::before{color:var(--c);font-weight:700;margin-right:6px}
.act.lgg::before{content:"◎"} .act.cp::before{content:"⧉"}
.act.ok{color:#3fd380;border-color:#3fd380}

.filters{position:sticky;top:0;z-index:5;padding:12px 0;margin-bottom:14px;
  background:linear-gradient(to bottom,var(--ink) 78%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
#search,#asearch{width:100%;font-family:var(--mono);background:#0b0d12;border:1px solid var(--ln2);color:var(--ts);
  padding:10px 13px;font-size:14px;margin-bottom:11px}
#search:focus,#asearch:focus{outline:none;border-color:var(--st);box-shadow:0 0 0 2px rgba(205,184,126,.22)}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:8px;align-items:center}
.chip{font-family:var(--mono);background:transparent;border:1px solid var(--ln2);color:var(--dm);padding:4px 12px;
  font-size:12px;cursor:pointer;text-transform:uppercase;letter-spacing:.03em;transition:all .1s}
.chip:hover{color:var(--ts);border-color:var(--dm)}
.chip.active{color:#0e1015;background:var(--c,#cdb87e);border-color:var(--c,#cdb87e);font-weight:700}
.chip .cn{opacity:.6;margin-left:4px} .chip.active .cn{opacity:.85}
#count{font-family:var(--mono);font-size:12px;color:var(--ft)}
#wtype{font-family:var(--mono);background:#0b0d12;border:1px solid var(--ln2);color:var(--tx);padding:4px 11px;font-size:12px;cursor:pointer}
#wtype:focus{outline:none;border-color:var(--st)}

.catsec{margin-bottom:8px}
.cathead{font-family:var(--din);font-size:13px;text-transform:uppercase;letter-spacing:.17em;font-weight:700;
  color:var(--ts);margin:26px 0 12px;padding:0 0 6px;border:0;border-bottom:1px solid var(--ln2);display:block}
.catcount{font-family:var(--mono);color:var(--ft);font-size:12px;letter-spacing:0;margin-left:8px;font-weight:400}

.mods td.slot{font-family:var(--mono);color:var(--st);font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.modnote{font-family:var(--mono);font-size:11.5px;color:var(--ft);margin-top:-12px}
.energy{color:var(--dm);font-size:11px;font-family:var(--mono)}
span.fill{font-family:var(--mono);color:var(--ft);font-size:10px;text-transform:uppercase;letter-spacing:.07em;border:1px solid var(--ln2);padding:1px 5px}

.fragblock{margin:0 0 20px}
.fraglabel{font-family:var(--mono);color:var(--st);font-size:11px;text-transform:uppercase;letter-spacing:.11em;margin-bottom:8px}
ul.fraglist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
ul.fraglist li{margin:0;background:var(--pnl);border:1px solid var(--ln);border-left:2px solid var(--c);padding:8px 12px;font-size:14.5px}
.fragdesc{color:var(--dm);font-size:13px}

aside.verify{background:#0b0d12;border:1px solid var(--ln);border-top:2px solid var(--st);padding:2px 20px 15px;margin:34px 0 0}
aside.verify h2{font-family:var(--din);border:0;color:var(--st);font-size:14px;letter-spacing:.15em;margin:15px 0 4px;padding:0;display:block}
aside.verify h2::before{content:"◈ ";color:var(--st)}
aside.verify ul{counter-reset:fn;list-style:none;padding-left:0;margin:8px 0 0}
aside.verify li{counter-increment:fn;position:relative;padding-left:28px;font-family:var(--mono);font-size:12px;line-height:1.72;color:#9aa0ad;margin:8px 0}
aside.verify li::before{content:counter(fn);position:absolute;left:0;top:2px;font-size:9.5px;color:var(--st);border:1px solid var(--ln2);padding:0 5px;line-height:1.5}
aside.verify strong{color:var(--st)}

footer{margin-top:46px;padding-top:15px;border-top:1px solid var(--ln);font-family:var(--mono);font-size:11.5px;color:var(--ft)}

@media (max-width:560px){
  header.hero h1{font-size:24px} header.idx h1{font-size:25px}
  .wrap{padding:18px 14px 66px}
  .filters{position:static;-webkit-backdrop-filter:none;backdrop-filter:none}
  table{display:block;background:none;border:0;margin:0 0 18px}
  table tr{display:block;background:var(--pnl);border:1px solid var(--ln);margin:0 0 8px;padding:3px 0}
  table tr:first-child{display:none}
  table td{display:block;border:0;padding:3px 14px;font-size:14px;overflow-wrap:anywhere}
  table td:first-child,.mods td.slot{color:var(--st);text-transform:uppercase;font-size:10.5px;letter-spacing:.1em;font-weight:700;padding:7px 14px 2px;white-space:normal}
  table tr:hover td{background:none}
  .card{grid-template-columns:58px 1fr;grid-template-areas:"el name" "el sub" "el role" ". ty" ". art" ". own" ". gear";gap:3px 12px}
  .card .ty,.card .art,.card .own,.card .gear{justify-self:start;text-align:left}
  .facts{white-space:normal;height:auto}
}