/* Drawvenge battle widget v2.0.0. Everything is scoped; no global resets. */
.dv-component{--dv-red:#ff6072;--dv-cyan:#4cdeee;--dv-ink:#f2f5f1;--dv-muted:#9baebc;--dv-mono:var(--mono,"SFMono-Regular",Consolas,"Liberation Mono",monospace);width:100%;min-width:0;color:var(--dv-ink);font-family:var(--font,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif);line-height:1.5;text-align:left}
.dv-component *,.dv-component *::before,.dv-component *::after{box-sizing:border-box}
.dv-component [hidden]{display:none!important}
.dv-battle{border:1px solid #384957;border-radius:14px;overflow:hidden;background:linear-gradient(145deg,#151f2a,#0c1520 50%,#101d28);box-shadow:0 28px 76px #0004,0 1px 0 #fff1 inset;isolation:isolate}
.dv-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:17px 20px 14px;font:10px var(--dv-mono);letter-spacing:.12em}
.dv-brand{display:flex;align-items:center;gap:9px;font-weight:600;white-space:nowrap}
.dv-brand i{width:5px;height:5px;background:var(--dv-red);box-shadow:0 0 10px #ff60724d}
.dv-badge{padding:4px 6px;border:1px solid #3a4a56;border-radius:3px;color:#abc0ce;font-size:7px;letter-spacing:.07em;white-space:nowrap}
.dv-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:0 20px}
.dv-steps>span{padding:0 0 8px;border-bottom:2px solid #273541;white-space:nowrap;color:#8297a7;font:8px var(--dv-mono);letter-spacing:.08em;transition:color .15s,border-color .15s}
.dv-steps b{font-weight:400;opacity:.7;margin-right:5px}
.dv-steps>span.is-active{color:#ffb0b7;border-color:var(--dv-red)}
.dv-steps>span.is-active[data-step="1"]{color:#9aebf5;border-color:var(--dv-cyan)}
.dv-steps>span.is-active[data-step="2"]{color:#e6eeec;border-color:#ccd9d9}
.dv-steps>span.is-done{color:#a1b4c0;border-color:#617784}
.dv-narration{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 20px 4px;min-height:71px}
.dv-narration h3{margin:0!important;font-size:clamp(16px,1.4vw,21px);font-weight:700;line-height:1.25;letter-spacing:-.045em;color:var(--dv-ink)}
.dv-narration p{margin:5px 0 0!important;font-size:10px;line-height:1.5;color:var(--dv-muted);letter-spacing:0}
.dv-clock{flex:0 0 64px;align-self:flex-start;text-align:right;padding-top:1px}
.dv-clock strong{font:23px var(--dv-mono);letter-spacing:-.055em;line-height:1;color:#c2d2db;font-variant-numeric:tabular-nums}
.dv-clock strong span{font-size:10px;letter-spacing:0;margin-left:2px;color:#819baa}
.dv-clock small{display:block;font:6px var(--dv-mono);letter-spacing:.11em;margin-top:5px;color:#95adbb;white-space:nowrap}
.dv-stage{position:relative;margin:0 12px;aspect-ratio:440/410;overflow:hidden;border-radius:9px}
.dv-canvas{width:100%;height:100%;aspect-ratio:440/410;display:block;max-width:100%;touch-action:pan-y}
.dv-stage.is-drawing{cursor:crosshair;outline:1px dashed #ff79804d;outline-offset:-2px}
.dv-stage.is-drawing .dv-canvas{touch-action:none}
.dv-callout{position:absolute;top:11%;left:9%;display:flex;gap:12px;align-items:center;color:#a1edf6;border:1px solid #326276;border-radius:4px;background:#102a35ee;padding:6px 8px;font:8px var(--dv-mono);letter-spacing:.06em;pointer-events:none;box-shadow:0 4px 15px #0003}
.dv-callout span{color:#58e6ee;font-size:10px}
.dv-overlay{position:absolute;inset:auto 10% 7%;text-align:center;pointer-events:none;background:linear-gradient(0deg,#0c1520f5,#0c1520e8 80%,#0c152000);padding:30px 8px 14px;border-bottom:1px solid #46606b}
.dv-overlay-kicker{display:block;font:7px var(--dv-mono);color:#bdced8;letter-spacing:.12em;margin-bottom:5px}
.dv-overlay strong{display:block;font-family:var(--font,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif);font-size:clamp(23px,2.8vw,38px);font-weight:850;line-height:1.15;letter-spacing:-.055em;color:var(--dv-ink)}
.dv-overlay p{margin:6px 0 0!important;font:10px var(--dv-mono);color:#c1ced6;letter-spacing:0}
.dv-component[data-outcome="caught"] .dv-overlay strong{color:#ff8996}
.dv-component[data-outcome="survived"] .dv-overlay strong{color:#83ebf2}
.dv-component[data-phase="revenge"] .dv-overlay{inset:27% 9% auto;padding:30px 7px;background:#0d1925ec;border:1px solid #38515f;border-radius:7px}
.dv-component[data-phase="revenge"] .dv-overlay strong{color:var(--dv-ink);font-size:clamp(22px,2.3vw,32px)}
.dv-component[data-phase="ready"] .dv-overlay{inset:31% 18% auto;background:#0d1925ed;border:1px solid #38515f;border-radius:6px;padding:19px 5px}
.dv-component[data-phase="ready"] .dv-overlay strong{font-size:27px;color:#d9f7fa}
.dv-draw-hint,.dv-motion-note{position:absolute;inset:28% 8% auto;text-align:center;pointer-events:none;padding:22px 10px;border-radius:7px;background:#101c27ed;border:1px dashed #76515d}
.dv-draw-hint>span{font-size:25px;font-weight:800;letter-spacing:-.04em;color:#ffd4d9}
.dv-draw-hint p{font-size:12px;margin:6px 0 8px!important;color:#d0dbe2}
.dv-draw-hint small{font-size:9px;line-height:1.5;color:#a4b7c3}
.dv-motion-note{border-style:solid;border-color:#3c5866;background:#0e1d29f2;inset:36% 8% auto}
.dv-motion-note strong{display:block;font-size:21px;letter-spacing:-.04em;color:#edf4f1}
.dv-motion-note span{display:block;margin-top:7px;font-size:11px;color:#c0d2da}
.dv-roles{display:flex;justify-content:space-between;gap:6px;align-items:center;padding:1px 21px 13px;font:7px var(--dv-mono);letter-spacing:.05em;white-space:nowrap}
.dv-roles>span{display:flex;align-items:center;gap:6px}
.dv-roles i{width:4px;height:4px;border-radius:50%;background:currentColor}
.dv-role-red{color:#ff99a6}.dv-role-cyan{color:#87e8f3}
.dv-roles .dv-round{color:#90a7b5;font-size:6px;letter-spacing:.12em;gap:3px}.dv-round b{font-weight:400}
.dv-time-track{height:2px;background:#23323e;overflow:hidden}.dv-time-track i{display:block;height:100%;width:100%;background:#fa6b7e;transform-origin:left center}
.dv-component[data-phase="battle"] .dv-time-track i{background:#54dce8}
.dv-controls{display:flex;gap:8px;padding:13px 18px;background:#101d28}
.dv-controls button{font-family:inherit;cursor:pointer;appearance:none;-webkit-appearance:none;display:flex;align-items:center;justify-content:center;gap:9px;height:44px;min-height:44px;margin:0;border-radius:5px;transition:background .15s,border-color .15s;touch-action:manipulation}
.dv-controls button:focus-visible{outline:3px solid #65e6f0;outline-offset:3px}
.dv-controls button:disabled{opacity:.4;cursor:default}
.dv-controls svg{width:17px;height:17px;flex-shrink:0;pointer-events:none}
.dv-controls .dv-primary{flex:1;min-width:0;border:1px solid #edf3ed;background:#edf3ed;color:#0b1a24;padding:8px 12px;font-size:12px;font-weight:650;white-space:nowrap}
.dv-controls .dv-primary:hover{background:#a6eff2;border-color:#a6eff2}
.dv-controls .dv-primary[aria-pressed="true"]{background:#36232c;border-color:#995764;color:#ffd3d8}
.dv-controls .dv-icon-button{flex:0 0 44px;width:44px;padding:0;border:1px solid #394e5e;background:#142532;color:#c4d3dc}
.dv-controls .dv-icon-button:hover:not(:disabled){border-color:#8aabb9;background:#1d3545}
.dv-feedback{font-size:11px!important;color:#fed1c1;padding:0 18px 12px!important;margin:0!important;background:#101d28}
.dv-footnote{display:flex;align-items:flex-start;gap:10px;margin:12px 4px 0!important;color:#9dafbd;font-size:10px;line-height:1.75;letter-spacing:0}
.dv-footnote>span:first-child{font-size:25px;line-height:1.15;color:#4de0ef;transform:rotate(-14deg);margin:0 3px 0 0}
.dv-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.dv-fallback{border:1px solid #4a6676;padding:24px;border-radius:12px;color:#dfe7ec}
@media(max-width:420px){
 .dv-header{padding:14px 13px 12px;font-size:9px}.dv-badge{font-size:6px;padding:4px}
 .dv-steps{padding:0 13px;gap:5px}.dv-steps>span{font-size:7px;letter-spacing:.035em}
 .dv-narration{padding:14px 13px 3px;min-height:75px;gap:6px}.dv-narration h3{font-size:17px}.dv-narration p{font-size:9px;max-width:200px;line-height:1.55}
 .dv-clock{flex-basis:49px}.dv-clock strong{font-size:21px}.dv-clock small{font-size:5.5px}
 .dv-stage{margin:0 6px}.dv-roles{padding:3px 13px 12px;font-size:6.5px;letter-spacing:0}.dv-roles .dv-round{font-size:5.5px}
 .dv-controls{padding:12px;gap:6px}.dv-controls .dv-primary{font-size:11px;padding-inline:7px;gap:6px}
 .dv-footnote{font-size:9px}.dv-overlay strong{font-size:27px}.dv-overlay-kicker{font-size:6px}.dv-overlay p{font-size:8px}
 .dv-draw-hint>span{font-size:22px}.dv-draw-hint p{font-size:10px}.dv-draw-hint small{font-size:8px}.dv-callout{font-size:7px}
}
@media(prefers-reduced-motion:reduce){.dv-component *{transition:none!important}}
@media print{.dv-controls,.dv-time-track{display:none}.dv-battle{break-inside:avoid;box-shadow:none}}
