/* v1.4.0 direction A (in-game replica). GENERATED by tools/build_v14_css.py from mockups/orders-v2 (theme.css + a-replica.html). Do not hand-edit. */
.a14 .glow { text-shadow:0 0 10px rgba(110,240,255,.55), 0 0 2px rgba(200,255,255,.8); }
.a14 .lbl { font:700 12px/1 var(--hud); letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
.a14 .mono { font:500 8.5px/1.3 var(--mono); letter-spacing:.06em; color:var(--dim2); text-transform:uppercase; }
.a14 .emb { width:30px; height:30px; flex:none; filter:drop-shadow(0 0 6px rgba(110,240,255,.5)); }
.a14 .chk { width:22px; height:22px; flex:none; border:1.5px solid rgba(220,245,250,.75); background:rgba(0,0,0,.35); display:inline-grid; place-items:center; }
.a14 .chk svg { width:18px; height:18px; display:none; }
.a14 .chk.on svg { display:block; }
.a14 .chk.on { border-color:rgba(201,240,63,.55); background:rgba(201,240,63,.08); }
.a14 .chk.sm { width:17px; height:17px; }
.a14 .chk.sm svg { width:14px; height:14px; }
.a14 .tick { color:var(--ok); width:16px; height:16px; flex:none; }
.a14 .struck { color:var(--strike); text-decoration:line-through; text-decoration-color:rgba(232,210,74,.9); text-decoration-thickness:1.5px; }
.a14 .cnt { font:700 14px var(--hud); letter-spacing:.04em; color:var(--text); white-space:nowrap; }
.a14 .cnt.ok { color:var(--dim); }
.a14 .step { display:inline-flex; align-items:center; gap:0; border:1px solid var(--line2); }
.a14 .step b { width:24px; height:22px; display:grid; place-items:center; font:700 15px var(--hud); color:var(--cyan); background:rgba(63,227,214,.08); }
.a14 .step span { min-width:44px; text-align:center; font:700 13px var(--hud); padding:0 4px; }
.a14 .btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; font:800 14px/1 var(--hud); letter-spacing:.12em; text-transform:uppercase; padding:11px 14px;
  color:#031014; background:linear-gradient(180deg,var(--cyan),var(--teal)); clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%); box-shadow:0 0 18px rgba(63,227,214,.45); }
.a14 .btn.ghost { color:var(--cyan); background:rgba(63,227,214,.1); box-shadow:none; outline:1px solid var(--line2); outline-offset:-1px; }
.a14 .badge { display:inline-block; font:800 10.5px/1 var(--hud); letter-spacing:.14em; padding:4px 7px 3px; text-transform:uppercase; color:#031014; background:var(--ok); }
.a14 .badge.t { background:var(--teal); }
.a14 .badge.o { background:transparent; color:var(--cyan); outline:1px solid var(--line2); }
.a14 .badge.w { background:var(--amber); }
.a14 .badge.r { background:var(--red); color:#fff; }
.a14 .bar { height:5px; background:rgba(110,225,235,.13); position:relative; overflow:hidden; }
.a14 .bar i { position:absolute; inset:0 auto 0 0; background:linear-gradient(90deg,var(--teal),var(--ok)); box-shadow:0 0 8px rgba(201,240,63,.6); }
.a14 .rar-Uncommon { --rc:var(--unc); }
.a14 .rar-Rare { --rc:var(--rare); }
.a14 .rar-Epic { --rc:var(--epic); }
.a14 .rar-Legendary { --rc:var(--leg); }
.a14 .rar-Commander { --rc:var(--cmd); }
.a14 .rar-Basic { --rc:#b9c6c8; }
.a14 .rar-Intel { --rc:#e8d24a; }
.a14 .map { position:relative; width:100%; aspect-ratio:1; background:#081016 url(map/hajin-v2.webp) center/cover; border:1px solid var(--line2); overflow:hidden; }
.a14 .map::after { content:""; position:absolute; inset:0; background:linear-gradient(rgba(3,10,16,.25),rgba(3,10,16,.35)), repeating-linear-gradient(0deg, rgba(140,240,255,.05) 0 1px, transparent 1px 3px); pointer-events:none; }
.a14 .map .grid { position:absolute; inset:0; z-index:1; background-image:linear-gradient(rgba(140,240,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(140,240,255,.14) 1px,transparent 1px); background-size:10% 10%; }
.a14 .map .pin { position:absolute; z-index:3; transform:translate(-50%,-50%); width:15px; height:15px; border:2px solid #fff; background:var(--rc,var(--teal)); transform-origin:center; rotate:45deg; box-shadow:0 0 0 2px rgba(0,0,0,.5), 0 0 12px var(--rc,var(--teal)); }
.a14 .map .pin.multi { width:19px; height:19px; }
.a14 .map .pin em { position:absolute; rotate:-45deg; inset:0; display:grid; place-items:center; font:800 10px var(--hud); font-style:normal; color:#031014; }
.a14 .map .tag { position:absolute; z-index:4; transform:translate(10px,-50%); font:700 10.5px/1 var(--hud); letter-spacing:.06em; padding:3px 5px 2px; background:rgba(3,12,18,.88); border:1px solid var(--line2); white-space:nowrap; text-transform:uppercase; }
.a14 .map .lt { position:absolute; z-index:3; transform:translate(-50%,-50%); width:22px; height:22px; border-radius:50%; border:2px solid var(--red); background:rgba(40,8,4,.85); display:grid; place-items:center; font:800 11px var(--hud); color:#fff; box-shadow:0 0 10px rgba(255,107,79,.8); }
.a14 .map .lt.q { border-style:dashed; }
.a14 .map .credit { position:absolute; z-index:4; right:4px; bottom:3px; font:500 7.5px var(--mono); color:rgba(220,240,245,.65); }
.a14 .map .cols { position:absolute; z-index:2; top:2px; left:0; right:0; display:flex; }
.a14 .map .cols span { flex:1; text-align:center; font:700 9px var(--hud); color:rgba(200,245,250,.6); }
.a14 .ricon { width:30px; height:30px; color:var(--cyan); }
.a14 .top { padding:12px 14px 0; position:relative; }
.a14 .top .row { display:flex; align-items:center; gap:9px; }
.a14 .top .t { font:800 31px/0.9 var(--hud); letter-spacing:.005em; }
.a14 .top .t small { font:600 18px var(--hud); color:var(--dim); margin-left:6px; letter-spacing:.04em; }
.a14 .top .fine { position:absolute; right:12px; top:12px; text-align:right; }
.a14 .tabs { display:flex; align-items:stretch; margin:10px 0 0; border-bottom:1px solid var(--line); background:linear-gradient(180deg,transparent,rgba(63,227,214,.06)); }
.a14 .tabs .k { font:800 11px var(--hud); color:var(--dim2); padding:10px 6px; letter-spacing:.06em; border:1px solid var(--line); margin:6px 4px; line-height:1; align-self:center; }
.a14 .tabs a { flex:1; text-align:center; padding:11px 0 9px; font:800 14px/1 var(--hud); letter-spacing:.1em; color:var(--dim); text-decoration:none; position:relative; }
.a14 .tabs a.on { color:var(--text); text-shadow:0 0 10px rgba(110,240,255,.7); }
.a14 .tabs a.on::after { content:""; position:absolute; left:14%; right:14%; bottom:-1px; height:3px; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }
.a14 .wrap { display:flex; gap:0; }
.a14 .rail { width:50px; flex:none; padding:10px 0 0 6px; border-right:1px solid var(--line); }
.a14 .rail div { height:31px; display:flex; align-items:center; gap:3px; font:700 17px var(--hud); color:var(--dim2); padding-left:4px; position:relative; }
.a14 .rail div.done { color:var(--dim); }
.a14 .rail div .tick { width:13px; height:13px; }
.a14 .rail div.cur { height:58px; font:800 44px/1 var(--hud); color:var(--text); text-shadow:0 0 14px rgba(110,240,255,.9),0 0 3px #fff; padding-left:2px; }
.a14 .rail div.cur::before { content:""; position:absolute; left:-6px; top:8px; bottom:8px; width:3px; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }
.a14 .rail div.sel { outline:1px solid var(--cyan); outline-offset:-2px; color:var(--cyan); background:rgba(63,227,214,.1); margin-right:4px; }
.a14 .rail .ch { position:absolute; right:3px; top:7px; bottom:7px; width:2px; }
.a14 .main { flex:1; min-width:0; padding:12px 12px 0 12px; }
.a14 .chap { display:flex; justify-content:space-between; align-items:center; }
.a14 .chap b { font:700 14px var(--hud); letter-spacing:.06em; color:var(--dim); }
.a14 .chap b span { color:var(--text); }
.a14 .view { margin:8px 0 2px; padding:8px 10px; background:rgba(255,181,71,.08); border:1px solid rgba(255,181,71,.35); display:flex; align-items:center; gap:8px; font:600 13px var(--ui); color:#ffd89a; }
.a14 .view .btn { margin-left:auto; padding:9px 10px; font-size:12px; }
.a14 .ribs { margin-top:10px; }
.a14 .ribs .lbl { margin-bottom:6px; }
.a14 .rib { display:flex; align-items:center; gap:10px; height:46px; margin:0 0 6px; padding:0 8px 0 14px; background:linear-gradient(90deg,rgba(40,110,130,.55),rgba(20,60,76,.35)); clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%); border-left:2px solid var(--teal); }
.a14 .rib .n { font:700 16px var(--mono); color:var(--cyan); letter-spacing:.02em; }
.a14 .rib .nm { font:800 18px/1 var(--hud); letter-spacing:.06em; text-transform:uppercase; flex:1; }
.a14 .rib .chk { margin-left:auto; width:28px; height:28px; }
.a14 .rib .chk svg { width:22px; height:22px; }
.a14 .rib.done { background:linear-gradient(90deg,rgba(60,80,40,.45),rgba(20,50,60,.3)); border-left-color:var(--ok); }
.a14 .tasks { margin-top:12px; padding:10px 10px 4px; background:linear-gradient(180deg,rgba(24,62,78,.6),rgba(10,30,40,.55)); border:1px solid var(--line); border-top:2px solid rgba(138,247,255,.5); backdrop-filter:blur(2px); }
.a14 .tasks h3 { margin:2px 0 6px; font:800 13px var(--hud); letter-spacing:.16em; color:var(--dim); display:flex; justify-content:space-between; }
.a14 .tg { padding:6px 0 8px; border-top:1px solid var(--line); }
.a14 .tg:first-of-type { border-top:0; }
.a14 .tg .on { font:700 14px var(--mono); color:#d9f5a0; margin-bottom:6px; letter-spacing:.02em; }
.a14 .tg .on span { color:var(--text); font-family:var(--hud); font-weight:800; font-size:16px; letter-spacing:.07em; margin-left:6px; text-transform:uppercase; }
.a14 .ts { display:flex; align-items:flex-start; gap:8px; padding:4px 0; font:600 14.5px/1.15 var(--ui); }
.a14 .ts .chk { margin-top:1px; }
.a14 .ts .x { flex:1; }
.a14 .ts .r { display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.a14 .rw { margin-top:12px; }
.a14 .rw h3 { margin:0 0 7px; font:800 13px var(--hud); letter-spacing:.16em; color:var(--dim); }
.a14 .rgrid { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.a14 .rt { display:flex; gap:8px; align-items:center; padding:8px; background:rgba(12,34,46,.7); border:1px solid var(--line); min-height:54px; }
.a14 .rt b { display:block; font:700 14px/1.05 var(--hud); letter-spacing:.03em; text-transform:uppercase; }
.a14 .rt small { font:600 9.5px var(--mono); color:var(--teal); letter-spacing:.08em; }
.a14 .foot { margin:14px 12px 10px; padding-top:8px; border-top:1px solid var(--line); font:600 12.5px var(--ui); color:var(--dim); text-align:center; }
.a14 .how { margin:8px 12px 16px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:6px; }
.a14 .how div { padding:7px; border:1px dashed var(--line2); font:600 11.5px/1.15 var(--ui); color:var(--dim); }
.a14 .how b { display:block; font:800 11px var(--hud); letter-spacing:.12em; color:var(--cyan); margin-bottom:2px; }
.a14 .sec { padding:12px; }
.a14 .sum { display:flex; gap:8px; margin-bottom:10px; }
.a14 .sum div { flex:1; padding:8px; border:1px solid var(--line); background:rgba(12,34,46,.6); }
.a14 .sum b { display:block; font:800 22px var(--hud); }
.a14 .sum span { font:700 10px var(--hud); letter-spacing:.14em; color:var(--dim); }
.a14 .ch { margin-bottom:9px; }
.a14 .chr { display:flex; align-items:center; gap:10px; height:44px; padding:0 10px 0 14px; background:linear-gradient(90deg,rgba(40,110,130,.55),rgba(20,60,76,.3)); clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%); border-left:2px solid var(--teal); }
.a14 .chr .nm { font:800 18px var(--hud); letter-spacing:.06em; text-transform:uppercase; flex:1; }
.a14 .chr .cnt { font-size:15px; }
.a14 .chr .star { color:var(--amber); font:800 12px var(--hud); letter-spacing:.1em; }
.a14 .lvls { display:flex; gap:5px; padding:7px 0 0 14px; }
.a14 .lv { width:42px; height:40px; border:1.5px solid rgba(220,245,250,.5); display:grid; place-items:center; font:800 15px var(--hud); position:relative; background:rgba(0,0,0,.3); }
.a14 .lv.d { border-color:rgba(201,240,63,.6); color:var(--strike); background:rgba(201,240,63,.07); }
.a14 .lv.d svg { position:absolute; right:-4px; top:-6px; width:16px; height:16px; }
.a14 .lv.nx { border-color:var(--cyan); box-shadow:0 0 10px rgba(138,247,255,.5); color:var(--cyan); }
.a14 .lv.unk { border-style:dashed; color:var(--dim2); font-size:13px; }
.a14 .det { margin:7px 0 0 14px; padding:8px 10px; border:1px solid var(--line); background:rgba(10,30,40,.6); }
.a14 .det .h { display:flex; justify-content:space-between; align-items:center; gap:6px; }
.a14 .det .h b { font:800 15px var(--hud); letter-spacing:.06em; text-transform:uppercase; }
.a14 .det p { margin:4px 0 6px; font:600 12.5px/1.2 var(--ui); color:var(--dim); }
.a14 .ing { display:flex; flex-wrap:wrap; gap:4px; }
.a14 .ing span { font:700 11.5px var(--hud); letter-spacing:.04em; padding:3px 6px 2px; border:1px solid var(--line2); border-left:3px solid var(--rc,var(--teal)); }
.a14 .det .btn { margin-top:8px; padding:9px 12px; font-size:12px; }
.a14 .unknown { margin:7px 0 0 14px; font:600 12px var(--ui); color:var(--dim); }
.a14 .unknown b { color:var(--amber); font:800 11px var(--hud); letter-spacing:.12em; }
.a14 .srch { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid var(--line2); background:rgba(4,16,22,.8); font:600 16px var(--mono); color:var(--cyan); }
.a14 .srch .cur { width:9px; height:18px; background:var(--cyan); box-shadow:0 0 8px var(--cyan); }
.a14 .chips { display:flex; gap:5px; flex-wrap:wrap; margin:9px 0 6px; }
.a14 .chips span { font:800 11px var(--hud); letter-spacing:.1em; padding:5px 7px 4px; border:1px solid var(--line2); color:var(--dim); text-transform:uppercase; }
.a14 .chips span.on { color:#031014; background:var(--teal); border-color:var(--teal); }
.a14 .rg { margin-top:10px; }
.a14 .rg h4 { margin:0 0 5px; font:800 12px var(--hud); letter-spacing:.16em; color:var(--rc); display:flex; justify-content:space-between; text-transform:uppercase; }
.a14 .rg h4::before { content:""; }
.a14 .ig { display:grid; grid-template-columns:1fr 1fr; gap:5px; }
.a14 .it { display:flex; gap:7px; align-items:center; padding:7px 7px 7px 9px; background:rgba(12,34,46,.6); border:1px solid var(--line); border-left:3px solid var(--rc); min-height:46px; }
.a14 .it b { display:block; font:700 13.5px/1.05 var(--hud); letter-spacing:.03em; text-transform:uppercase; }
.a14 .it small { font:500 9px var(--mono); color:var(--dim2); letter-spacing:.04em; }
.a14 .it .chk { margin-left:auto; }
.a14 .it.sel { background:rgba(63,227,214,.13); border-color:var(--line2); }
.a14 .selbar { display:flex; align-items:center; gap:8px; padding:7px 7px 7px 10px; margin:2px 0 4px; border:1px solid var(--cyan); background:rgba(63,227,214,.12); box-shadow:0 0 14px rgba(63,227,214,.25); font:700 13px var(--hud); letter-spacing:.08em; text-transform:uppercase; }
.a14 .selbar .btn { margin-left:auto; padding:9px 11px; font-size:12px; }
.a14 .dock { margin:10px -12px 0; padding:10px 12px 14px; background:linear-gradient(180deg,rgba(3,10,16,0),rgba(3,10,16,.96) 30%); display:flex; gap:8px; align-items:center; }
.a14 .dock .btn { flex:1; }
.a14 .legend { margin-top:8px; display:flex; flex-direction:column; gap:5px; }
.a14 .legend div { display:flex; align-items:center; gap:8px; padding:7px 9px; border:1px solid var(--line); background:rgba(12,34,46,.6); font:600 13px var(--ui); }
.a14 .legend i { width:11px; height:11px; rotate:45deg; background:var(--rc); border:1.5px solid #fff; flex:none; }
.a14 .legend b { font:800 14px var(--hud); letter-spacing:.05em; text-transform:uppercase; }
.a14 .legend span { color:var(--dim); margin-left:auto; font-size:12px; text-align:right; }
.a14 .bb { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.a14 .lc { padding:9px 9px 8px; background:linear-gradient(180deg,rgba(28,70,86,.6),rgba(10,28,38,.7)); border:1px solid var(--line); border-top:2px solid var(--tc,var(--teal)); position:relative; min-height:180px; display:flex; flex-direction:column; }
.a14 .lc .num { position:absolute; right:7px; top:6px; font:700 11px var(--mono); color:var(--dim2); }
.a14 .lc h4 { margin:0; font:800 19px/1 var(--hud); letter-spacing:.04em; text-transform:uppercase; }
.a14 .lc .w { font:600 12px/1.15 var(--ui); color:var(--text); margin:4px 0; }
.a14 .lc .w em { font-style:normal; color:var(--cyan); font-family:var(--hud); font-weight:800; letter-spacing:.06em; }
.a14 .lc .meta { display:flex; flex-wrap:wrap; gap:3px; margin-bottom:5px; }
.a14 .lc .meta span { font:800 9.5px var(--hud); letter-spacing:.1em; padding:2px 4px 1px; text-transform:uppercase; border:1px solid var(--line2); color:var(--dim); }
.a14 .lc .meta .th { color:#031014; background:var(--tc); border-color:var(--tc); }
.a14 .lc .meta .lk { color:var(--amber); border-color:rgba(255,181,71,.5); display:inline-flex; gap:3px; align-items:center; }
.a14 .lc p { margin:0; font:600 11.5px/1.18 var(--ui); color:var(--dim); flex:1; }
.a14 .lc .alt { margin-top:5px; font:600 10px/1.15 var(--ui); color:#ffd89a; }
.a14 .lc .alt b { font:800 9.5px var(--hud); letter-spacing:.1em; }
.a14 .lc .ph { position:relative; margin:-9px -9px 7px; height:150px; overflow:hidden; background:#0b1d26; border-bottom:1px solid var(--line); }
.a14 .lc .ph img { width:100%; height:100%; object-fit:cover; object-position:50% 18%; display:block; filter:saturate(.92) contrast(1.04); }
.a14 .lc .ph::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(4,14,20,0) 55%,rgba(4,14,20,.85)); pointer-events:none; }
.a14 .lc .ph .ps { position:absolute; left:6px; bottom:5px; z-index:1; font:700 8px var(--mono); color:rgba(220,240,245,.75); letter-spacing:.04em; }
.a14 .lc .num { z-index:2; color:#dff; text-shadow:0 1px 2px #000; }
.a14 .ph.none { display:flex; align-items:center; justify-content:center; background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 6px,transparent 6px 12px),#0b1d26; }
.a14 .ph.none svg { width:62%; height:auto; opacity:.55; }
.a14 .ph.none .nc { position:absolute; left:0; right:0; bottom:8px; text-align:center; z-index:1; font:800 9.5px var(--hud); letter-spacing:.14em; color:var(--amber); }
.a14 .ltd .hero { position:relative; height:330px; margin:-12px -12px 10px; overflow:hidden; border-bottom:2px solid var(--tc); background:#0b1d26; }
.a14 .ltd .hero .bg { position:absolute; inset:-20px; background-size:cover; background-position:center; filter:blur(14px) brightness(.45) saturate(.8); }
.a14 .ltd .hero img { position:relative; display:block; height:100%; width:auto; margin:0 auto; box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 30px rgba(0,0,0,.6); }
.a14 .ltd .hero::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(4,14,20,0) 50%,rgba(4,14,20,.95)); }
.a14 .ltd .hero .hn { position:absolute; left:14px; right:14px; bottom:10px; z-index:1; }
.a14 .ltd .hero .hn small { font:800 11px var(--hud); letter-spacing:.18em; color:var(--tc); }
.a14 .ltd .hero .hn h2 { margin:2px 0 0; font:800 38px/1 var(--hud); letter-spacing:.04em; text-transform:uppercase; }
.a14 .ltd .kv { display:grid; grid-template-columns:86px 1fr; gap:6px 10px; font:600 13px/1.2 var(--ui); margin-bottom:10px; }
.a14 .ltd .kv dt { font:800 10.5px var(--hud); letter-spacing:.12em; color:var(--dim2); padding-top:2px; }
.a14 .ltd .kv dd { margin:0; }
.a14 .ltd .kv em { font-style:normal; color:var(--cyan); font-family:var(--hud); font-weight:800; }
.a14 .ltd .pcap { font:500 9px/1.3 var(--mono); color:var(--dim2); margin-top:8px; }
.a14 .lc .src { margin-top:5px; font:500 8px var(--mono); color:var(--dim2); }

/* ── v1.4.0 app shell: the dark-teal in-game look for the whole app ── */
:root { --bg:#03070b; --panel:#0b1d26; --panel2:#102a36; --line:#17414a; --line2:#24606a; --text:#eef7f8; --dim:#8fb1b7; --tabh:0px; }
.a14 { --line:rgba(110,225,235,.2); --line2:rgba(110,225,235,.38); --teal:#3fe3d6; --cyan:#8af7ff; --tdim:#2a8b90; --ok:#c9f03f; --strike:#e8d24a;
  --dim2:#5d7c82; --red:#ff6b4f; --amber:#ffb547; --ui:"DMZ Symbols","Rajdhani",system-ui,sans-serif; --hud:"DMZ Symbols","Barlow Condensed",system-ui,sans-serif; --mono:"DMZ Symbols","Rajdhani",system-ui,sans-serif;   /* bundled fonts only (offline + glyph audit) */
  --unc:#5fd068; --rare:#3fa2ff; --epic:#b266ff; --leg:#ffb547; --cmd:#ff6b4f; font:500 15px/1.25 var(--ui); color:var(--text); }
html, body { background:#03070b; }
body::before { content:""; position:fixed; inset:0; z-index:-2; pointer-events:none; background:
  radial-gradient(120% 60% at 15% 0%, rgba(40,170,180,.28), transparent 60%), radial-gradient(90% 50% at 100% 55%, rgba(30,120,150,.22), transparent 65%),
  radial-gradient(80% 40% at 0% 100%, rgba(30,140,140,.18), transparent 70%), linear-gradient(180deg,#06121b 0%,#030a10 55%,#02060a 100%); }
body::after { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.5; background:
  repeating-linear-gradient(0deg, rgba(140,240,255,.05) 0 1px, transparent 1px 3px),
  repeating-linear-gradient(103deg, transparent 0 37px, rgba(160,240,255,.035) 37px 38px, transparent 38px 91px); }
#app { position:relative; z-index:0; }
#tabs, #tabs:empty { display:none !important; }
#main { padding:10px 12px calc(28px + var(--safe-b)); }
#main.a14m { padding:0 0 calc(24px + var(--safe-b)); }
#toast { bottom:calc(16px + var(--safe-b)); }
#hdr { display:block; padding:var(--safe-t) 0 0; background:linear-gradient(180deg,rgba(4,14,20,.97),rgba(4,14,20,.9)); backdrop-filter:blur(6px); border-bottom:0; }
#hdr .a14 .top { padding:10px 12px 0; }
#hdr .a14 .top .t { font:800 27px/0.95 var(--hud); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; flex:1; }
#hdr .a14 .top .t small { font-size:15px; }
#hdr .a14 .top .t .hcs { display:block; font:600 11px/1.2 var(--mono); letter-spacing:.06em; color:var(--dim2); margin-top:3px; text-shadow:none; }
#hdr .a14 .top .t .hcs.ok { color:#79c98a; } #hdr .a14 .top .t .hcs.warn { color:var(--amber); }
#hdr .a14 .hb { display:flex; align-items:center; gap:6px; flex:none; }
#hdr .a14 .hb a { position:relative; display:inline-flex; align-items:center; gap:4px; height:30px; padding:0 9px; font:800 12px/1 var(--hud); letter-spacing:.1em; color:var(--cyan);
  text-decoration:none; border:1px solid var(--line2); background:rgba(63,227,214,.08); }
#hdr .a14 .hb a.on { color:#031014; background:var(--teal); border-color:var(--teal); }
#hdr .a14 .hb a.live { color:#fff; border-color:var(--red); background:rgba(255,107,79,.18); }
#hdr .a14 .hb a.live .pulse { width:7px; height:7px; border-radius:50%; background:var(--red); animation:pulse 1.4s infinite; }
#hdr .a14 .hb .badge { position:absolute; top:-6px; right:-6px; min-width:16px; height:16px; padding:0 3px; border-radius:8px; background:var(--red); color:#fff; font:700 10.5px/16px var(--hud); text-align:center; letter-spacing:0; }
#hdr .a14 .hb .me { display:block; border-radius:50%; } #hdr .a14 .hb .me .av { border:2px solid var(--c); }
#hdr .a14 .tabs { margin-top:8px; }
#hdr .a14 .tabs a { font-size:13px; letter-spacing:.07em; padding:11px 0 10px; }
#hdr .a14 .tabs .k { padding:6px 4px; margin:6px 3px; font-size:10px; }
#hdr .a14 .tabs a.dim2 { opacity:.75; }
#strip { background:rgba(4,14,20,.85); }
.tmap { height:calc(100vh - var(--hdrlive, 120px)); }
/* screens: neutralise v1.3 rules that share class names with the mockup */
.a14 .rail { display:block; gap:0; overflow:visible; scroll-snap-type:none; margin:0; padding:10px 0 0 6px; overscroll-behavior:auto; }
.a14 .btn { display:inline-flex; width:auto; margin:0; border-radius:0; border:0; text-align:center; }
.a14 .chk { border-radius:0; }
.a14 .step { padding:0; border-top:1px solid var(--line2); }
.a14 .ts .x { width:auto; height:auto; border:0; border-radius:0; background:none; font-size:inherit; }
.a14 .sec { display:block; margin:0; font:inherit; letter-spacing:normal; color:inherit; text-transform:none; }
.a14 .hero { padding:0; border:0; border-bottom:2px solid var(--tc); border-radius:0; }
.a14 .legend { flex-direction:column; flex-wrap:nowrap; font-size:inherit; color:inherit; }
.a14 .sq { border-radius:0; }
.a14 .cnt { color:var(--text); } .a14 .cnt.ok { color:var(--dim); }
/* screens */
.a14 button { font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
.a14 a { color:inherit; }
.a14 button.chk { border:1.5px solid rgba(220,245,250,.75); background:rgba(0,0,0,.35); }
.a14 button.chk.on { border-color:rgba(201,240,63,.55); background:rgba(201,240,63,.08); }
.a14 .ts button.chk { width:24px; height:24px; } .a14 .ts button.chk svg { width:18px; height:18px; }
.a14 .rib button.chk { width:30px; height:30px; }
.a14 .btn { border:0; cursor:pointer; text-decoration:none; }
.a14 .btn[disabled], .a14 button[disabled] { opacity:.45; cursor:default; }
.a14 .step button { width:34px; height:30px; display:grid; place-items:center; font:700 18px var(--hud); color:var(--cyan); background:rgba(63,227,214,.08); }
.a14 .step button + button { border-left:1px solid var(--line2); }
.a14 .rail button { display:flex; width:100%; height:31px; align-items:center; gap:3px; font:700 17px var(--hud); color:var(--dim2); padding-left:4px; position:relative; text-align:left; }
.a14 .rail button.done { color:var(--dim); } .a14 .rail button .tick { width:13px; height:13px; }
.a14 .rail button.cur { height:58px; font:800 44px/1 var(--hud); color:var(--text); text-shadow:0 0 14px rgba(110,240,255,.9),0 0 3px #fff; padding-left:2px; }
.a14 .rail button.cur::before { content:""; position:absolute; left:-6px; top:8px; bottom:8px; width:3px; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }
.a14 .rail button.sel { outline:1px solid var(--cyan); outline-offset:-2px; color:var(--cyan); background:rgba(63,227,214,.1); }
.a14 .rail button.sel.cur { color:var(--text); }
.a14 .rail button.unk { font-style:italic; }
.a14 .rail button sup { font-size:10px; color:var(--amber); }
.a14 .rail .ch { position:absolute; right:3px; top:7px; bottom:7px; width:2px; }
.a14 .wrap { align-items:flex-start; }
.a14 .rail { position:sticky; top:calc(var(--hdrlive, 110px) + 4px); }
.a14 .chap { gap:8px; flex-wrap:wrap; }
.a14 .ribs .rib { cursor:default; }
.a14 .q { color:var(--amber); font:800 13px var(--hud); margin-left:4px; }
.a14 .alt-ch { display:flex; flex-wrap:wrap; gap:5px; margin:8px 0 2px; }
.a14 .alt-ch button { font:800 11px var(--hud); letter-spacing:.1em; padding:6px 8px 5px; border:1px solid var(--line2); color:var(--dim); text-transform:uppercase; }
.a14 .alt-ch button.on { color:#031014; background:var(--c, var(--teal)); border-color:var(--c, var(--teal)); }
.a14 .note { margin:8px 0 0; padding:8px 10px; border:1px dashed var(--line2); font:600 12.5px/1.25 var(--ui); color:var(--dim); }
.a14 .note b { color:var(--amber); font:800 11px var(--hud); letter-spacing:.1em; }
.a14 .note.warn { border-style:solid; border-color:rgba(255,181,71,.45); background:rgba(255,181,71,.06); color:#ffd89a; }
.a14 .ro { margin:10px 12px 0; padding:7px 10px; border:1px solid var(--line2); font:800 12px var(--hud); letter-spacing:.12em; color:var(--cyan); display:flex; justify-content:space-between; align-items:center; }
.a14 .ro a { color:var(--dim); text-decoration:none; }
.a14 .undo14 { position:sticky; top:calc(var(--hdrlive, 110px) + 4px); z-index:5; margin:8px 12px 0; display:flex; align-items:center; gap:10px; padding:9px 10px; background:rgba(5,22,30,.96);
  border:1px solid var(--line2); border-left:3px solid var(--ok); font:600 13.5px var(--ui); }
.a14 .undo14 .tick { width:15px; height:15px; } .a14 .undo14 button { margin-left:auto; font:800 13px var(--hud); letter-spacing:.12em; color:var(--cyan); }
.a14 .xsec { margin:14px 12px 0; }
.a14 .xsec h3 { margin:0 0 7px; font:800 13px var(--hud); letter-spacing:.16em; color:var(--dim); display:flex; justify-content:space-between; }
.a14 .xsec h3 a { color:var(--cyan); text-decoration:none; letter-spacing:.08em; }
.a14 .story14 .tree { display:grid; gap:8px; text-align:center; padding:10px; border:1px solid var(--line); background:rgba(11,29,38,.55); }
.a14 .story14 .tw { display:flex; gap:6px; justify-content:center; flex-wrap:wrap; }
.a14 .story14 .conf { font:600 10px/1.3 var(--mono); letter-spacing:.06em; color:var(--dim2); border:0; margin:0; padding:0; background:none; }
.a14 .story14 .hint { font:500 11px var(--ui); color:var(--dim2); margin:6px 0 0; text-align:center; }
.a14 .story14 .sop { background:rgba(16,42,56,.6); border-radius:0; }
.a14 .forks14 .fk { padding:8px 10px; border:1px solid var(--line); background:rgba(12,34,46,.6); margin-bottom:6px; }
.a14 .forks14 .fk b { display:block; font:800 13px var(--hud); letter-spacing:.1em; color:var(--cyan); }
.a14 .forks14 .fk small { display:block; font:600 12px/1.2 var(--ui); color:var(--dim); margin:2px 0 6px; }
.a14 .forks14 .chip { display:inline-block; font:800 11px var(--hud); letter-spacing:.08em; padding:5px 7px 4px; border:1px solid var(--line2); color:var(--dim); margin:0 4px 4px 0; text-transform:uppercase; border-radius:0; background:none; }
.a14 .forks14 .chip.fill { color:#031014; background:var(--teal); border-color:var(--teal); }
.a14 .forks14 .qm { color:var(--amber); margin-left:3px; }
.a14 .sqrow { display:flex; gap:6px; overflow-x:auto; padding-bottom:4px; }
.a14 .sq { flex:none; display:flex; align-items:center; gap:6px; padding:6px 9px 6px 6px; border:1px solid var(--line); background:rgba(12,34,46,.6); text-decoration:none; }
.a14 .sq b { font:800 13px var(--hud); letter-spacing:.06em; } .a14 .sq small { font:600 11px var(--mono); color:var(--cyan); }
.a14 .sq.me { border-color:var(--line2); }
.a14 .lock { color:var(--amber); font:700 10px var(--mono); display:inline-flex; gap:3px; align-items:center; margin-top:3px; }
/* upgrades */
.a14 .lv { cursor:pointer; } .a14 .lv.unk { cursor:default; }
.a14 .det .row2 { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.a14 .det .row2 .btn { margin-top:0; }
.a14 .chr .who { display:flex; gap:2px; margin-right:4px; }
.a14 .sqdots { display:flex; gap:4px; flex-wrap:wrap; padding:5px 0 0 14px; font:600 11px var(--mono); color:var(--dim2); }
.a14 .sqdots span { padding:1px 5px; border:1px solid var(--line); color:var(--dim); }
.a14 .sqdots span i { font-style:normal; color:var(--cyan); }
/* items */
.a14 .srch input { flex:1; min-width:0; background:none; border:0; outline:0; font:600 16px var(--mono); color:var(--cyan); }
.a14 .srch input::placeholder { color:var(--tdim); }
.a14 .chips button { font:800 11px var(--hud); letter-spacing:.1em; padding:6px 7px 5px; border:1px solid var(--line2); color:var(--dim); text-transform:uppercase; }
.a14 .chips button i { font-style:normal; opacity:.7; margin-left:3px; }
.a14 .chips button.on { color:#031014; background:var(--teal); border-color:var(--teal); }
.a14 .it { cursor:pointer; text-align:left; width:100%; }
.a14 .it .chk { pointer-events:none; }
.a14 .selbar { position:sticky; top:calc(var(--hdrlive, 110px) + 4px); z-index:5; }
.a14 .selbar.empty { border-color:var(--line2); box-shadow:none; background:rgba(4,16,22,.92); color:var(--dim); }
.a14 .selbar .btn + .btn { margin-left:0; }
.a14 .it .info { margin-left:auto; flex:none; width:26px; height:26px; display:grid; place-items:center; color:var(--cyan); border:1px solid var(--line2); font:800 13px var(--hud); }
/* lieutenants */
.a14 .lc { cursor:pointer; text-decoration:none; color:inherit; }
.a14 .lc .flag { position:absolute; left:6px; top:6px; z-index:2; font:800 9.5px var(--hud); letter-spacing:.12em; padding:2px 5px 1px; color:#031014; background:var(--amber); }
.a14 .lc .flag.unverified { background:#e8d24a; }
.a14 .ltd .flagbox { margin:0 0 10px; }
.a14 .ltd .kv dd a { color:var(--cyan); }
.a14 .ltd .dock .btn { text-decoration:none; }
.a14 .srcs { margin-top:10px; font:500 10px/1.45 var(--mono); color:var(--dim2); }
.a14 .srcs a { color:var(--dim); }
.a14 .mini { position:relative; width:100%; aspect-ratio:1; background:#081016 url(map/hajin-v2.webp) center/cover; border:1px solid var(--line2); overflow:hidden; margin-top:6px; }
.a14 .mini .grid { position:absolute; inset:0; background-image:linear-gradient(rgba(140,240,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(140,240,255,.14) 1px,transparent 1px); background-size:10% 10%; }
.a14 .mini .lt { position:absolute; transform:translate(-50%,-50%); width:24px; height:24px; border-radius:50%; border:2px solid var(--red); background:rgba(40,8,4,.85); display:grid; place-items:center; font:800 11px var(--hud); color:#fff; box-shadow:0 0 10px rgba(255,107,79,.8); }
.a14 .mini .credit { position:absolute; right:4px; bottom:3px; font:500 8px var(--mono); color:rgba(220,240,245,.7); }
.a14 .footc { margin:14px 12px 6px; font:500 9.5px/1.4 var(--mono); color:var(--dim2); text-transform:uppercase; letter-spacing:.04em; }
