/*  VOLURR — Trader DNA overlay  ·  tdna.css  (scoped under #tdna) */
#tdna{position:fixed;inset:0;z-index:var(--z-overlay,1000);display:none;background:rgba(4,6,11,.62);backdrop-filter:blur(4px) saturate(120%);padding:6vh 14px;overflow:auto}
#tdna.on{display:block;animation:tdf .14s ease}
@keyframes tdf{from{opacity:0}to{opacity:1}}
html[data-theme="light"] #tdna{background:rgba(20,25,40,.36)}
#tdna .td-panel{width:min(560px,100%);margin-inline:auto;display:flex;flex-direction:column;background:var(--cardgrad),var(--card);border:1px solid var(--line);border-radius:var(--rad-lg,14px);box-shadow:var(--el-4,0 20px 60px rgba(0,0,0,.5));overflow:hidden;animation:tdp .18s cubic-bezier(.2,.9,.3,1)}
@keyframes tdp{from{transform:translateY(-10px);opacity:0}to{transform:none;opacity:1}}
#tdna .td-panel:focus{outline:none}
#tdna .td-top{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--line);background:radial-gradient(120% 150% at 0 0,color-mix(in srgb,var(--gold,#e23b3b) 12%,transparent),transparent 60%)}
#tdna .td-top h2{font-size:16px;font-weight:900;color:var(--txt)}
#tdna .td-sub{font-size:9.5px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.5px}
#tdna .td-x{margin-inline-start:auto;width:30px;height:30px;border-radius:9px;border:1px solid var(--line);background:var(--card2);color:var(--txt2);cursor:pointer;font-size:15px}
#tdna .td-x:hover{color:var(--down);border-color:var(--down)}
#tdna .td-body{padding:16px;display:flex;flex-direction:column;gap:13px}
/* hero: DNA ring + level */
#tdna .td-hero{display:flex;align-items:center;gap:16px}
#tdna .td-ring{width:90px;height:90px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--c) calc(var(--p)*1%),var(--line) 0)}
#tdna .td-ring>span{width:74px;height:74px;border-radius:50%;background:var(--card);display:grid;place-items:center;align-content:center;text-align:center}
#tdna .td-ring b{font-size:27px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
#tdna .td-ring i{font-size:9px;color:var(--muted);font-style:normal;text-transform:uppercase;letter-spacing:1px}
#tdna .td-lvl{flex:1;min-width:0}
#tdna .td-lvtop{font-size:14px;color:var(--txt);font-weight:600}
#tdna .td-traj{font-size:10px;font-weight:800}
#tdna .td-traj.up{color:var(--up)} #tdna .td-traj.down{color:var(--down)} #tdna .td-traj.flat{color:var(--muted)}
#tdna .td-lvbar{height:7px;border-radius:5px;background:var(--card2);margin:7px 0 5px;overflow:hidden}
#tdna .td-lvbar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--gold,#e23b3b),#ff8a5b)}
#tdna .td-lvnext{font-size:10.5px;color:var(--muted)}
#tdna .td-lvnext b{color:var(--txt2)}
/* core stats */
#tdna .td-stats{display:flex;gap:6px;background:var(--card2);border:1px solid var(--line);border-radius:11px;padding:9px 6px}
#tdna .td-stat{flex:1;text-align:center;min-width:0}
#tdna .td-stat span{display:block;font-size:8.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}
#tdna .td-stat b{font-size:14px;font-weight:900;font-variant-numeric:tabular-nums}
#tdna .td-stat b.up{color:var(--up)} #tdna .td-stat b.down{color:var(--down)}
/* metrics */
#tdna .td-sec{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-top:2px}
#tdna .td-mrow{display:flex;align-items:center;gap:9px;margin:6px 0}
#tdna .td-ml{flex:0 0 96px;font-size:12px;color:var(--txt2);font-weight:600}
#tdna .td-mbar{flex:1;height:8px;border-radius:5px;background:var(--card2);overflow:hidden}
#tdna .td-mbar i{display:block;height:100%;border-radius:5px;transition:width .3s}
#tdna .td-mv{flex:0 0 26px;text-align:end;font-size:12px;font-weight:900;font-variant-numeric:tabular-nums}
/* flags */
#tdna .td-flags{display:flex;flex-wrap:wrap;gap:6px}
#tdna .td-flag{font-size:11px;font-weight:700;color:#ff6b78;background:rgba(255,77,94,.1);border:1px solid rgba(255,77,94,.3);border-radius:8px;padding:4px 10px}
#tdna .td-flag.ok{color:var(--up);background:rgba(38,208,124,.1);border-color:rgba(38,208,124,.3)}
/* coach */
#tdna .td-coach{background:radial-gradient(120% 130% at 100% 0,color-mix(in srgb,var(--gold,#e23b3b) 10%,transparent),transparent 60%),var(--card2);border:1px solid var(--line);border-radius:11px;padding:11px 13px}
#tdna .td-coachh{font-size:11px;font-weight:800;color:var(--gold,#e23b3b);margin-bottom:5px}
#tdna .td-coachb{font-size:12.5px;line-height:1.65;color:var(--txt)}
#tdna .td-note{font-size:9px;color:var(--muted);text-align:center;line-height:1.5}
/* empty state */
#tdna .td-empty{text-align:center;padding:26px 14px;color:var(--muted)}
#tdna .td-eico{font-size:38px;margin-bottom:10px}
#tdna .td-empty>div:nth-child(2){font-size:14px;color:var(--txt);font-weight:600}
#tdna .td-esub{font-size:11px;margin-top:6px}
#tdna .td-cta{margin-top:14px;background:linear-gradient(180deg,var(--gold,#e23b3b),var(--gold2,#bf1320));color:#fff;border:0;border-radius:10px;padding:11px 18px;font-family:inherit;font-size:13px;font-weight:800;cursor:pointer}
@media (prefers-reduced-motion:reduce){#tdna.on,#tdna .td-panel{animation:none}}
@media (max-width:540px){#tdna .td-stat span{font-size:8px} #tdna .td-ml{flex-basis:74px}}
