/* GINTENT · extra dashboard directions: focus, board, map. Tokens only. */

/* ---------- focus ---------- */
.xd-f{display:flex;flex-direction:column;gap:28px}
.xd-f-next{display:flex;flex-direction:column;gap:22px;padding:44px 48px;border-radius:var(--r4);border:1px solid var(--line);background:radial-gradient(120% 140% at 0% 0%,var(--gold-soft),transparent 55%),var(--s1)}
.xd-f-next .d2{max-width:22ch}
.xd-f-track{position:relative;height:74px;margin:6px 8px 4px}
.xd-f-rail{position:absolute;left:0;right:0;top:20px;height:4px;border-radius:99px;background:var(--s3)}
.xd-f-rail i{position:absolute;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,var(--line2),var(--gold))}
.xd-f-mk{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;white-space:nowrap}
.xd-f-mk::before{content:"";order:1;width:12px;height:12px;border-radius:50%;background:var(--s1);border:2px solid var(--tx3);margin-top:14px}
.xd-f-mk b{order:0;position:absolute;top:-18px;font-size:13px;color:var(--tx2);font-weight:500}
.xd-f-mk em{order:2;font-style:normal;font-size:12px;color:var(--tx3)}
.xd-f-mk.k-now::before{border-color:var(--gold);background:var(--gold)}
.xd-f-mk.k-now b{color:var(--tx)}
.xd-f-mk.k-proj::before{border-color:var(--gold);border-style:dashed}
.xd-f-mk.k-proj b{color:var(--gold)}
.xd-f-mk.k-cert::before{border-radius:3px;border-color:var(--gold);transform:rotate(45deg)}
.xd-f-end{position:absolute;top:30px;left:0;font-size:11px;color:var(--tx3)}.xd-f-end.r{left:auto;right:0}
.xd-f-fix{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.xd-f-fix li{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.xd-f-fix li>.mono{color:var(--tx3);font-size:13px}
.xd-f-fix b{display:block;font-size:15.5px}
.xd-f-fix em{font-style:normal;font-size:20px}
.xd-f-moves{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.xd-f-mv{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:26px;border-radius:var(--r3);border:1px solid var(--line);background:var(--s1);min-height:250px;transition:border-color .2s,transform .2s}
a.xd-f-mv:hover{border-color:var(--gold-line);transform:translateY(-2px)}
.xd-f-mv>.small:first-child{text-transform:uppercase;letter-spacing:.08em;font-family:var(--f-m);font-size:11.5px}
.xd-f-mv .ring{margin:6px 0}
.xd-f-mv.start{justify-content:space-between}
.xd-f-mv.start .btn{justify-content:flex-start}
.xd-f-cert{width:84px;height:84px;margin:6px 0;border-radius:50%;display:grid;place-items:center;color:var(--gold);border:1px solid var(--gold-line);background:var(--gold-soft)}
.xd-f-rest{display:flex;flex-direction:column;gap:12px}
.xd-f-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.xd-f-li{display:flex;align-items:center;gap:14px;padding:12px 4px;border-bottom:1px solid var(--line);transition:background .15s}
.xd-f-li:hover{background:var(--s1)}
.xd-f-li b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xd-f-sc{width:34px;text-align:right}
.xd-f:not(.all) .xd-f-li.xtra{display:none}

/* ---------- board ---------- */
.xd-b{display:flex;flex-direction:column;gap:18px}
.xd-b-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.xd-b-sum{display:flex;gap:8px;flex-wrap:wrap}
.xd-b-chip{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:var(--s1);font-size:13px;color:var(--tx2)}
.xd-b-chip i{width:8px;height:8px;border-radius:50%;background:var(--tx3)}
.xd-b-chip b{color:var(--tx);font-weight:500}
.xd-b-chip.run i,.xd-b-col.run header::before{background:var(--gold)}
.xd-b-chip.att i,.xd-b-col.att header::before{background:var(--bad)}
.xd-b-chip.ready i,.xd-b-col.ready header::before{background:var(--ok)}
.xd-b-chip.certd i,.xd-b-col.certd header::before{background:var(--gold2)}
.xd-b-cols{display:grid;grid-template-columns:repeat(5,minmax(180px,1fr));gap:14px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory}
.xd-b-col{display:flex;flex-direction:column;gap:12px;min-width:0;padding:14px;border-radius:var(--r3);background:var(--bg2);border:1px solid var(--line);scroll-snap-align:start}
.xd-b-col header{position:relative;display:flex;flex-direction:column;gap:4px;padding-top:12px}
.xd-b-col header::before{content:"";position:absolute;left:0;top:0;width:28px;height:3px;border-radius:99px;background:var(--tx3)}
.xd-b-col header b{font-size:14px}
.xd-b-list{display:flex;flex-direction:column;gap:10px}
.xd-b-card{display:flex;flex-direction:column;border-radius:var(--r2);overflow:hidden;border:1px solid var(--line);background:var(--s1);transition:border-color .2s,transform .2s}
.xd-b-card:hover{border-color:var(--gold-line);transform:translateY(-2px)}
.xd-b-th{position:relative;aspect-ratio:16/9}
.xd-b-th .ph{position:absolute;inset:0}
.xd-b-th::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.6))}
.xd-b-sc{position:absolute;right:8px;bottom:6px;z-index:2;font-size:22px;color:#fff;font-weight:500}
.xd-b-card.certd .xd-b-sc{color:var(--gold2)}
.xd-b-v{position:absolute;left:8px;bottom:9px;z-index:2;font-size:11px;color:rgba(255,255,255,.8)}
.xd-b-bd{display:flex;flex-direction:column;gap:8px;padding:12px}
.xd-b-bd .row{flex-wrap:wrap;gap:2px 8px}
.xd-b-bd>b{font-size:13.5px;line-height:1.3}
.xd-b-card.att{border-color:color-mix(in srgb,var(--bad) 35%,transparent)}
.xd-b-card.draft .xd-b-th{filter:grayscale(1);opacity:.7}
.xd-b-empty{padding:18px;border:1px dashed var(--line2);border-radius:var(--r2);text-align:center}
.xd-b-add{display:flex;align-items:center;justify-content:center;gap:8px;height:42px;border-radius:var(--r2);border:1px dashed var(--line2);color:var(--tx2);font-size:13.5px}
.xd-b-add:hover{border-color:var(--gold-line);color:var(--gold)}

/* ---------- map ---------- */
.xd-m{display:flex;flex-direction:column;gap:22px}
.xd-m-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.xd-m-head .d3{max-width:20ch;margin-top:8px}
.xd-m-kpi{display:flex;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r3);overflow:hidden}
.xd-m-kpi>div{display:flex;flex-direction:column;gap:2px;padding:12px 20px;background:var(--s1);min-width:110px}
.xd-m-kpi b{font-size:26px;font-weight:500}
.xd-m-body{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.xd-m-main{display:flex;flex-direction:column;gap:14px;padding:24px 24px 18px;border-radius:var(--r4);border:1px solid var(--line);background:var(--s1)}
.xd-m-chart{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);grid-template-rows:380px 28px}
.xd-m-y{position:relative}
.xd-m-y span{position:absolute;right:10px;transform:translateY(-50%);font-family:var(--f-m);font-size:11px;color:var(--tx3)}
.xd-m-plot{position:relative;border-left:1px solid var(--line);border-bottom:1px solid var(--line)}
.xd-m-grid{position:absolute;left:0;right:0;height:1px;background:var(--line)}
.xd-m-cert{position:absolute;left:0;right:0;border-top:1.5px dashed var(--gold);z-index:1}
.xd-m-cert span{position:absolute;right:0;top:-22px;font-size:10.5px;letter-spacing:.12em;color:var(--gold)}
.xd-m-plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.xd-m-plot polyline{fill:none;stroke:var(--line2);stroke-width:2;transition:stroke .2s}
.xd-m-plot polyline.on{stroke:var(--gold);stroke-width:3}
.xd-m-dot{position:absolute;z-index:3;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--s1);border:2px solid var(--tx3);cursor:pointer;transition:transform .2s,border-color .2s,background .2s}
.xd-m-dot.last{width:16px;height:16px;margin:-8px 0 0 -8px;background:var(--tx3)}
.xd-m-dot:hover{transform:scale(1.25)}
.xd-m-dot.on{border-color:var(--gold);background:var(--gold);box-shadow:0 0 0 6px var(--gold-soft)}
.xd-m-dot.k-cert.last{border-color:var(--gold2)}
.xd-m-lb{position:absolute;left:20px;top:50%;transform:translateY(-50%);display:flex;align-items:baseline;gap:8px;white-space:nowrap;font-size:12.5px;color:var(--tx2);pointer-events:none}
.xd-m-lb b{font-size:15px;color:var(--tx);font-weight:500}
.xd-m-dot.on .xd-m-lb{color:var(--tx)}.xd-m-dot.on .xd-m-lb b{color:var(--gold)}
.xd-m-run{position:absolute;z-index:3;width:16px;height:16px;margin:-8px 0 0 -8px}
.xd-m-run::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px dashed var(--gold);animation:spin 6s linear infinite}
.xd-m-run .xd-m-lb{left:auto;right:22px}
@keyframes spin{to{transform:rotate(360deg)}}
.xd-m-x{grid-column:2;position:relative}
.xd-m-x span{position:absolute;top:8px;transform:translateX(-50%);font-family:var(--f-m);font-size:11px;color:var(--tx3);white-space:nowrap}
.xd-m-leg{display:flex;flex-wrap:wrap;gap:6px}
.xd-m-leg .chip{gap:8px}
.xd-m-pn{display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:var(--r4);border:1px solid var(--gold-line);background:linear-gradient(160deg,var(--gold-soft),transparent 55%),var(--s1)}
.xd-m-big{display:flex;align-items:center;gap:14px}
.xd-m-big>b{font-size:68px;line-height:.9;font-weight:500;color:var(--gold)}
.xd-m-vs{display:flex;align-items:flex-end;gap:14px;padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.xd-m-vs span{display:flex;flex-direction:column-reverse;align-items:center;gap:4px}
.xd-m-vs i{display:block;width:26px;border-radius:3px 3px 0 0;background:var(--line2)}
.xd-m-vs span:last-child i{background:var(--gold)}
.xd-m-vs em{font-style:normal;font-size:10.5px;color:var(--tx3)}
.xd-m-vs b{font-size:13px;font-weight:500}

@media (max-width:1100px){.xd-m-body{grid-template-columns:1fr}.xd-f-moves{grid-template-columns:1fr 1fr}.xd-f-mv.start{grid-column:1/-1;min-height:0}}
@media (max-width:720px){
  .xd-f-next{padding:26px 20px}
  .xd-f-track{margin:6px 14px 4px}
  .xd-f-mk em{display:none}
  .xd-f-mk.k-proj b{top:34px}
  .xd-f-li .small{display:none}
  .xd-m-cert span{right:auto;left:6px}
  .xd-f-moves{grid-template-columns:1fr}
  .xd-f-mv{min-height:0}
  .xd-b-cols{grid-template-columns:repeat(5,82%)}
  .xd-m-main{padding:16px 14px 14px}
  .xd-m-chart{grid-template-rows:260px 28px;grid-template-columns:28px minmax(0,1fr)}
  .xd-m-lb{display:none}
  .xd-m-dot.on .xd-m-lb{display:flex;left:auto;right:18px}
  .xd-m-kpi{width:100%}.xd-m-kpi>div{flex:1;min-width:0;padding:10px 12px}.xd-m-kpi b{font-size:20px}
  .xd-m-x span:nth-child(even){display:none}
}
