*{box-sizing:border-box}html,body{margin:0}body.duel-page{min-height:100vh;color:var(--text);font:14px/1.5 var(--font);background:var(--page-bg)}a{color:inherit}button,input{font:inherit;color:inherit}code{font-family:var(--font-display);letter-spacing:.06em}:focus-visible{outline:2px solid var(--sapphire);outline-offset:2px}.dp-main{flex-direction:column;gap:20px;min-width:0;padding:28px clamp(16px,3vw,40px) 48px;display:flex}.dp-main>*{margin-top:0!important;margin-bottom:0!important}.dp-loading,.dp-empty{color:var(--muted)}h1,h2,h3{font-family:var(--font-display);margin:0}h2{font:500 13px var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}h2 small{color:var(--text);font:500 12px var(--font);letter-spacing:0;margin-left:6px}.dp-cta{color:#fff;letter-spacing:.03em;cursor:pointer;background:var(--cta);border:0;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:13px 22px;font-weight:700;text-decoration:none;display:inline-flex;box-shadow:0 8px 30px #ff2a2a59,inset 0 1px #ffffff4d}.dp-cta:hover{filter:brightness(1.1)}.dp-cta:disabled{opacity:.6;cursor:wait}.dp-btn{cursor:pointer;background:#d9fced0a;border:1px solid #d9fced33;border-radius:10px;padding:10px 16px}.dp-btn:hover{background:#d9fced1a}.dp-back{color:var(--muted);margin-bottom:14px;text-decoration:none;display:inline-block}.dp-back:hover{color:var(--text)}.dp-panel{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(14px);border-radius:18px;flex-direction:column;gap:14px;padding:20px;display:flex}.dp-hero{border:1px solid var(--line);background:linear-gradient(90deg,#28205499 0%,#28205466 55%,#28205426 100%);border-radius:18px;grid-template-columns:1.3fr 1fr;align-items:center;gap:24px;min-height:250px;margin-bottom:18px;padding:28px 32px;display:grid;position:relative;overflow:hidden}.dp-kicker{color:var(--muted);letter-spacing:.12em;text-transform:uppercase;margin:0 0 6px;font-size:13px}.dp-hero h1{background:linear-gradient(#fff 30%,#c9bdf5);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(36px,5vw,64px);font-weight:800;line-height:1.05}.dp-hero-text p:last-child{max-width:44ch;color:var(--muted);margin:12px 0 0}.dp-hero-vs{height:150px;position:relative}.dp-hero-vs span{border-radius:18px;width:46%;height:130px;position:absolute;top:10px}.dp-hero-vs .a{clip-path:polygon(0 0,100% 0,82% 100%,0 100%);background:linear-gradient(160deg,#ff3b2f,#6d1fb0);left:0;box-shadow:0 0 40px #ff3b2f66}.dp-hero-vs .b{clip-path:polygon(18% 0,100% 0,100% 100%,0 100%);background:linear-gradient(160deg,#405ffa,#15112e);right:0}.dp-hero-vs b,.vs-word{color:#0000;font:800 64px/1 var(--font-display);-webkit-text-stroke:2px #fff;text-shadow:0 0 18px #9d8cffe6,0 0 42px #405ffab3;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)skew(-8deg)}.dp-record{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:18px;display:grid}.dp-stat{background:var(--glass);border:1px solid var(--line);border-radius:18px;flex-direction:column;gap:2px;padding:14px 16px;display:flex}.dp-stat b{font:700 22px var(--font-display)}.dp-stat span{color:var(--muted);font-size:12px}.pos{color:var(--up)}.neg{color:var(--down)}.dp-grid{grid-template-columns:1.4fr 1fr;gap:16px;margin-bottom:28px;display:grid}.dp-col{flex-direction:column;gap:16px;display:flex}.dp-field{border:0;margin:0;padding:0}.dp-field legend{color:var(--muted);margin-bottom:8px;font-size:12px}.dp-chips{flex-wrap:wrap;gap:6px;display:flex}.dp-chip input,.dp-mode input{opacity:0;pointer-events:none;position:absolute}.dp-chip span{text-align:center;cursor:pointer;border:1px solid #d9fced29;border-radius:999px;min-width:52px;padding:7px 12px;display:inline-block}.dp-chip input:checked+span{color:#fff;background:linear-gradient(135deg,#6d4dff,#405ffa);border-color:#0000;box-shadow:0 0 16px #405ffa73}.dp-chip input:focus-visible+span,.dp-mode input:focus-visible+span{outline:2px solid var(--sapphire)}.dp-modes{grid-template-columns:1fr 1fr;gap:8px;display:grid}.dp-mode span{cursor:pointer;border:1px solid #d9fced24;border-radius:14px;flex-direction:column;gap:4px;height:100%;padding:12px 14px;display:flex}.dp-mode small{color:var(--muted);line-height:1.4}.dp-mode input:checked+span{background:linear-gradient(160deg,#ff3b2f2e,#6d1fb02e);border-color:#ff3b2fb3}.dp-toggle{color:var(--muted);align-items:center;gap:8px;display:flex}.dp-toggle b{color:var(--text)}.dp-create .dp-cta{align-self:flex-start}.dp-join{gap:8px;display:flex}.dp-join input{min-width:0;font:700 18px var(--font-display);letter-spacing:.12em;text-transform:uppercase;background:#07060f80;border:1px solid #d9fced33;border-radius:12px;flex:1;padding:12px 14px}.dp-rules{color:#d0caea;margin:0;padding-left:20px}.dp-rules li+li{margin-top:8px}.dp-list{flex-direction:column;gap:12px;display:flex}.dp-list h2:not(:first-child){margin-top:12px}.dp-cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;display:grid}.dp-card{background:linear-gradient(110deg,#ff3b2f29,#14102c99 50%,#405ffa2e);border:1px solid #d9fced1a;border-radius:14px;grid-template-columns:1fr auto;gap:4px 10px;padding:14px 16px;text-decoration:none;display:grid}.dp-card:hover{border-color:#9d8cff80}.dp-card.done{opacity:.8}.dp-card-vs{white-space:nowrap;text-overflow:ellipsis;align-items:baseline;gap:8px;min-width:0;display:flex;overflow:hidden}.dp-card-vs i{color:var(--accent);font:800 11px var(--font-display);font-style:normal}.dp-card-meta{color:var(--muted);grid-column:1;font-size:12px}.dp-card-r{font:700 18px var(--font-display);grid-area:1/2/3;align-self:center}.vs-stage{isolation:isolate;border:1px solid #d9fced1a;border-radius:24px;grid-template-columns:1fr minmax(220px,300px) 1fr;align-items:center;gap:16px;min-height:420px;padding:32px clamp(16px,3vw,40px);display:grid;position:relative;overflow:hidden}.vs-stage:before,.vs-stage:after{content:"";z-index:-1;position:absolute;inset:0}.vs-stage:before{clip-path:polygon(0 0,58% 0,42% 100%,0 100%);background:radial-gradient(50% 60% at 18% 45%,#ff7a3c59,#0000 70%),linear-gradient(150deg,#c4231c,#6d1fb0)}.vs-stage:after{clip-path:polygon(58% 0,100% 0,100% 100%,42% 100%);background:radial-gradient(50% 60% at 82% 45%,#09bbc84d,#0000 70%),linear-gradient(150deg,#2a3fd8,#120e2b)}.vs-fighter{text-align:center;flex-direction:column;align-items:center;gap:8px;display:flex}.vs-avatar{clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:linear-gradient(160deg,#ffe0a8,#b8862e);place-items:center;width:108px;height:120px;display:grid}.vs-avatar span{width:92px;height:104px;clip-path:inherit;font:800 40px var(--font-display);color:#fff;background:linear-gradient(160deg,#2a1f5c,#0f0b24);place-items:center;display:grid}.vs-fighter.b .vs-avatar{background:linear-gradient(160deg,#c9e4ff,#4a6bd8)}.vs-fighter.empty .vs-avatar{background:#d9fced40}.vs-fighter.empty .vs-avatar span{color:var(--muted)}.vs-fighter h3{text-overflow:ellipsis;white-space:nowrap;text-shadow:0 2px 12px #0009;max-width:100%;font-size:20px;overflow:hidden}.vs-you{color:var(--frost);letter-spacing:.1em;text-transform:uppercase;margin:-6px 0 0;font-size:11px}.vs-stats{flex-direction:column;gap:6px;width:min(240px,100%);margin:6px 0 0;padding:0;list-style:none;display:flex}.vs-stats li{background:#07060f9e;border:1px solid #d9fced14;border-radius:10px;justify-content:space-between;align-items:center;gap:10px;padding:7px 12px;font-size:12px;display:flex}.vs-stats li span{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px}.vs-stats li b{font-family:var(--font-display)}.vs-mid{text-align:center;flex-direction:column;align-items:center;gap:10px;display:flex;position:relative}.vs-mid p{color:#e3defa;text-shadow:0 1px 8px #000000b3;margin:0;font-size:13px}.vs-mid .vs-word{margin:6px 0;font-size:clamp(64px,9vw,104px);position:static;transform:skew(-8deg)}.vs-code code{color:#fff}.vs-note{max-width:28ch}.vs-banner{font:800 clamp(26px, 4vw, 40px) / 1 var(--font-display);text-transform:uppercase;letter-spacing:.04em;margin:0}.vs-banner.win{color:#0000;background:linear-gradient(#fff3b0,#ffb020 60%,#ff7a1a);filter:drop-shadow(0 0 16px #ffb02099);-webkit-background-clip:text;background-clip:text}.vs-banner.lose{color:#cfcbe0;text-shadow:0 0 14px #000c}.vs-banner.draw,.vs-banner.solo{color:var(--frost)}.dp-share{gap:8px;margin:14px 0 24px;display:flex}.dp-share input{background:#07060f80;border:1px solid #d9fced29;border-radius:10px;flex:1;min-width:0;padding:10px 12px}.vs-stage+.dp-list{margin-top:24px}.dp-rounds{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;display:grid}.dp-round{background:#07060f73;border:1px solid #d9fced14;border-radius:14px;padding:12px 14px}.dp-round header{font:700 12px var(--font-display);justify-content:space-between;margin-bottom:8px;display:flex}.dp-round header small{color:var(--muted);font:400 11px var(--font)}.dp-round ul{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.dp-round li{grid-template-columns:1fr auto;font-size:12px;display:grid}.dp-round li span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dp-round li em{color:var(--muted);grid-column:1;font-style:normal}.dp-round li b{font-family:var(--font-display);grid-area:1/2/3;align-self:center}.dp-round li.wait b{color:var(--muted)}.dp-gate{flex-direction:column;align-items:flex-start;gap:14px;max-width:520px;margin:10vh auto 0;display:flex}.dp-gate p{color:#d0caea;margin:0}.dp-toasts{z-index:10;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:16px;right:16px}.dp-toast{background:var(--panel);border-left:3px solid var(--up);border-radius:10px;padding:10px 14px;box-shadow:0 8px 24px #00000073}.dp-toast.bad{border-left-color:var(--down)}@media (width<=860px){.dp-hero,.dp-grid{grid-template-columns:minmax(0,1fr)}.dp-hero-vs{display:none}.dp-record{grid-template-columns:repeat(2,minmax(0,1fr))}.vs-stage{grid-template-columns:minmax(0,1fr);gap:24px}.vs-stage:before{clip-path:polygon(0 0,100% 0,100% 42%,0 56%)}.vs-stage:after{clip-path:polygon(0 56%,100% 42%,100% 100%,0 100%)}.vs-mid{order:0}.vs-fighter.a{order:-1}.vs-fighter.b{order:1}}@media (width<=520px){.dp-modes{grid-template-columns:minmax(0,1fr)}}.dp-speeds{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.dp-mode b em{color:var(--muted);margin-left:4px;font-size:12px;font-style:normal;font-weight:500}.dp-note{color:var(--muted);margin:8px 0 0;font-size:12px}@media (width<=520px){.dp-speeds{grid-template-columns:minmax(0,1fr)}}