.play{grid-template-columns:minmax(0, 1fr) var(--play-side);gap:var(--s-16);--play-side:calc(336px * var(--ui));grid-template-areas:"main side""info side""sys sys";align-items:stretch;display:grid}.play>*{min-width:0}.play__main{gap:var(--s-14);grid-area:main;grid-template-rows:auto 1fr;min-width:0;display:grid}.play__side{gap:var(--s-12);grid-area:side;align-content:start;min-width:0;display:grid}@media (min-width:1600px){.play{--play-side:calc(380px * var(--ui))}}@media (max-width:1180px){.play{--play-side:calc(300px * var(--ui))}}@media (max-width:1040px){.play{grid-template-columns:minmax(0,1fr);grid-template-areas:"main""side""info""sys"}}.idcard{border-radius:var(--r-panel);border:1px solid var(--border);background:radial-gradient(130% 150% at 92% -10%, #ff2d6b29, transparent 56%), linear-gradient(180deg, #ffffff09, transparent 58%), var(--deep-2);position:relative;overflow:hidden}.idcard:after{content:"";pointer-events:none;background:repeating-linear-gradient(116deg,#0000 0 15px,#ffffff04 15px 16px);position:absolute;inset:0}.idcard__glow{width:calc(340px * var(--ui));height:calc(340px * var(--ui));pointer-events:none;filter:blur(26px);background:radial-gradient(circle,#ff145f42,#0000 62%);border-radius:50%;position:absolute;top:-46%;right:-8%}.idcard__body{z-index:1;gap:var(--s-16);padding:var(--s-18) var(--s-20);display:grid;position:relative}.idcard__who{align-items:center;gap:var(--s-14);min-width:0;display:flex}.idcard__av{flex:none;position:relative}.idcard__name{gap:3px;min-width:0;display:grid}.idcard__nick{font-family:var(--font-display);font-weight:700;font-size:var(--t-h3);letter-spacing:.01em;line-height:1.1}.idcard__acts{align-items:center;gap:var(--s-8);flex:none;margin-left:auto;display:flex}.lvlhex{width:calc(26px * var(--ui));height:calc(29px * var(--ui));clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--lvl-color,var(--green));color:#08090d;font-family:var(--font-display);font-weight:700;font-size:calc(13px * var(--ui));filter:drop-shadow(0 0 0 var(--deep-2)) drop-shadow(0 2px 6px #0000008c);place-items:center;line-height:1;display:grid;position:absolute;bottom:-7px;right:-7px}.idcard__elo{gap:var(--s-8);display:grid}.idcard__eloline{align-items:baseline;gap:var(--s-8);flex-wrap:wrap;display:flex}.idcard__elonum{font-family:var(--font-display);font-weight:700;font-size:var(--t-d2);letter-spacing:-.02em;line-height:1}.statusline{align-items:center;gap:calc(6px * var(--ui));font-size:var(--t-micro);letter-spacing:.07em;text-transform:uppercase;color:var(--muted-2);font-weight:700;display:inline-flex}.statusline__dot{width:calc(6px * var(--ui));height:calc(6px * var(--ui));background:currentColor;border-radius:50%;flex:none}.statusline--ok{color:var(--green-soft)}.statusline--ok .statusline__dot{background:var(--green);animation:live-pulse 1.9s var(--e-out) infinite}.mm{gap:var(--s-14);align-content:space-between;display:grid}.mm__modes{gap:var(--s-8);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.mmmode{min-height:calc(54px * var(--ui));padding:var(--s-10) var(--s-12);justify-content:space-between;align-items:center;gap:var(--s-8);border-radius:var(--r-control);border:1px solid var(--border);background:var(--surface);color:var(--muted);text-align:left;transition:color var(--d-base) var(--e-out), border-color var(--d-base) var(--e-out), background-color var(--d-base) var(--e-out), box-shadow var(--d-base) var(--e-out);display:flex}.mmmode:hover:not(:disabled){color:var(--text);border-color:var(--border-hi);background:var(--surface-hi)}.mmmode__title{font-family:var(--font-display);font-weight:700;font-size:var(--t-sm);letter-spacing:.1em}.mmmode__state{opacity:.85;flex:none;display:flex}.mmmode[aria-selected=true]{color:var(--text);border-color:var(--pink);box-shadow:inset 0 -20px 26px -22px var(--pink), 0 8px 26px -16px #ff145fbf;background:linear-gradient(#ff2d6b2e,#ff2d6b0d)}.mmmode:disabled{cursor:not-allowed}.mmmode[data-locked]{color:var(--muted-2);background:0 0;border-style:dashed}.mmmode[data-locked] .mmmode__state{color:var(--muted-2);opacity:1}.mmmode:disabled:not([data-locked]):not([aria-selected=true]){opacity:.5}.mm__desc{margin:0}.mm__setup{gap:var(--s-8);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.mm__setup--tri{grid-template-columns:repeat(3,minmax(0,1fr))}.setup{min-width:0;padding:var(--s-10) var(--s-12);border-radius:var(--r-control);border:1px solid var(--border);background:var(--deep);grid-template-rows:auto auto 13px;align-content:start;gap:3px;display:grid}.setup__label{font-size:var(--t-micro);letter-spacing:.06em;text-transform:uppercase;color:var(--muted-2);text-overflow:ellipsis;white-space:nowrap;font-weight:700;overflow:hidden}.setup__value{font-family:var(--font-display);font-weight:700;font-size:calc(19px * var(--ui));text-overflow:ellipsis;white-space:nowrap;line-height:1.15;overflow:hidden}.setup__hint{font-size:var(--t-micro);color:var(--muted-2);line-height:calc(13px * var(--ui))}.setup--act{width:100%;font:inherit;color:inherit;cursor:pointer;transition:border-color var(--d-fast) var(--e-out), background-color var(--d-fast) var(--e-out)}.setup--act:hover{border-color:var(--border-hi);background:var(--surface-hi)}.setup--act[data-pending]{border-color:var(--pink)}.setup--act[data-pending] .setup__value,.setup--act[data-pending] .setup__hint{color:var(--pink-soft)}.vpick{align-items:center;gap:var(--s-10);width:100%;padding:var(--s-10) var(--s-12);border-radius:var(--r-control);border:1px solid var(--border);background:var(--deep);color:var(--muted);text-align:left;cursor:pointer;transition:color var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out), background-color var(--d-fast) var(--e-out);display:flex}.vpick:hover{color:var(--text);border-color:var(--border-hi);background:var(--surface-hi)}.vpick[aria-pressed=true]{color:var(--text);border-color:var(--pink);background:var(--pink-ghost)}.vpick__code{min-width:calc(58px * var(--ui));padding:2px var(--s-8);border-radius:var(--r-pill);background:var(--surface-hi);font-family:var(--font-display);font-weight:700;font-size:var(--t-micro);letter-spacing:.06em;text-align:center;flex:none}.vpick[aria-pressed=true] .vpick__code{background:var(--pink);color:var(--on-pink)}.vpick__label{min-width:0;font-size:var(--t-sm);flex:1}.mm__act{gap:var(--s-10);display:grid}.mm__cta{--btn-h:calc(62px * var(--ui));font-size:calc(16px * var(--ui));letter-spacing:.1em}.mm__note{text-align:center;font-size:var(--t-sm);margin:0}button.mm__note{justify-content:center;gap:calc(6px * var(--ui))}.searching{gap:var(--s-12);text-align:center;padding:var(--s-20);border-radius:var(--r-panel);background:var(--pink-ghost);border:1px solid #ff2d6b47;place-items:center;display:grid}.searching__timer{font-family:var(--font-display);font-weight:700;font-size:calc(40px * var(--ui));font-variant-numeric:tabular-nums;letter-spacing:-.02em}.searching__pulse{background:#ffffff0f;border-radius:999px;width:100%;height:3px;overflow:hidden}.searching__pulse:after{content:"";background:linear-gradient(90deg, transparent, var(--pink), transparent);width:38%;height:100%;animation:sweep 1.4s var(--e-out) infinite;border-radius:999px;display:block}@keyframes sweep{0%{transform:translate(-100%)}to{transform:translate(320%)}}.searching--blocked{background:var(--red-dim);border-color:#ff3b3b59}.searching__note{-webkit-line-clamp:2;-webkit-box-orient:vertical;max-width:42ch;margin:0;font-style:italic;display:-webkit-box;overflow:hidden}.sidecard{padding:var(--s-14) var(--s-16)}.sidecard--hot{border-color:#ff2d6b66}.proster{margin:var(--s-10) 0 0;gap:var(--s-4);padding:0;list-style:none;display:grid}.proster__row{align-items:center;gap:var(--s-10);min-height:calc(46px * var(--ui));padding:calc(4px * var(--ui)) var(--s-8);border-radius:var(--r-control);border:1px solid #0000;display:flex}.proster__row[data-me]{background:var(--green-dim);border-color:#38e67a4d}.proster__row--pending{border-style:dashed;border-color:var(--border);opacity:.72}.proster__free{width:100%;min-height:calc(46px * var(--ui));align-items:center;gap:var(--s-10);padding:calc(4px * var(--ui)) var(--s-8);border-radius:var(--r-control);border:1px dashed var(--border-hi);color:var(--muted-2);font-size:var(--t-sm);text-align:left;transition:color var(--d-base) var(--e-out), border-color var(--d-base) var(--e-out), background-color var(--d-base) var(--e-out);font-weight:600;display:flex}.proster__free:hover:not(:disabled){color:var(--pink-soft);border-color:var(--pink);background:var(--pink-ghost)}.proster__free:disabled{opacity:.45;cursor:not-allowed}.proster__plus{width:calc(30px * var(--ui));height:calc(30px * var(--ui));opacity:.75;border:1px solid;border-radius:9px;flex:none;place-items:center;display:grid}.mystats{margin-top:var(--s-12);background:var(--border);border:1px solid var(--border);border-radius:var(--r-control);grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;display:grid;overflow:hidden}.metric{background:var(--deep);padding:var(--s-10) var(--s-6);text-align:center;justify-items:stretch;gap:2px;min-width:0;display:grid}.metric__value{font-family:var(--font-display);font-weight:700;font-size:calc(20px * var(--ui));min-width:0;line-height:1.1}.metric[data-tone=good] .metric__value{color:var(--green-soft)}.metric[data-tone=bad] .metric__value{color:var(--red)}.metric__label{font-size:var(--t-micro);color:var(--muted-2);letter-spacing:.03em;text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.recent{margin:var(--s-10) 0 0;gap:var(--s-6);padding:0;list-style:none;display:grid}.recent__row{align-items:center;gap:var(--s-10);padding:var(--s-8) var(--s-10);border-radius:var(--r-control);border:1px solid var(--border);background:var(--deep);transition:border-color var(--d-fast) var(--e-out), background-color var(--d-fast) var(--e-out);display:flex}.recent__row:hover{border-color:var(--border-hi);background:var(--surface-hi)}.recent__row[data-skel]{pointer-events:none}.recent__row[data-skel] .recent__label{width:46%;display:block}.recent__row[data-skel] .recent__meta .skel{width:62%;display:block}.recent__flag{background:var(--muted-2);border-radius:999px;flex:none;align-self:stretch;width:3px}.recent__row[data-outcome=win] .recent__flag{background:var(--green)}.recent__row[data-outcome=loss] .recent__flag{background:var(--red)}.recent__row[data-outcome=review] .recent__flag{background:var(--yellow)}.recent__body{flex:1;gap:2px;min-width:0;display:grid}.recent__top{align-items:baseline;gap:var(--s-8);display:flex}.recent__label{font-size:var(--t-sm);font-weight:700}.recent__row[data-outcome=win] .recent__label{color:var(--green-soft)}.recent__row[data-outcome=loss] .recent__label{color:var(--red)}.recent__row[data-outcome=review] .recent__label{color:var(--yellow)}.recent__score{font-size:var(--t-xs);color:var(--muted);font-variant-numeric:tabular-nums}.recent__meta{gap:var(--s-8);min-width:0;font-size:var(--t-micro);color:var(--muted-2);display:flex}.recent__elo{font-family:var(--font-display);font-weight:700;font-size:var(--t-sm);color:var(--muted-2);flex:none}.recent__elo[data-sign=up]{color:var(--green-soft)}.recent__elo[data-sign=down]{color:var(--red)}.playinfo{gap:var(--s-12);grid-area:info;grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.playinfo>.dcard{min-height:calc(132px * var(--ui))}.dcard{gap:var(--s-8);padding:var(--s-14) var(--s-14) var(--s-12);border-radius:var(--r-card);border:1px solid var(--border);background:linear-gradient(var(--surface), var(--surface)), var(--panel-veil);-webkit-backdrop-filter:blur(var(--blur-card));backdrop-filter:blur(var(--blur-card));transition:border-color var(--d-base) var(--e-out), background-color var(--d-base) var(--e-out);grid-template-rows:auto 1fr auto;display:grid}.dcard:hover{border-color:var(--border-hi);background:linear-gradient(var(--surface-hi), var(--surface-hi)), var(--panel-veil)}.dcard__head{align-items:center;gap:var(--s-8);display:flex}.dcard__title{font-family:var(--font-display);font-weight:700;font-size:var(--t-micro);letter-spacing:var(--tr-label);text-transform:uppercase;color:var(--muted-2)}.dcard__go{color:var(--muted-2);transition:color var(--d-base) var(--e-out);margin-left:auto;display:flex}.dcard:hover .dcard__go{color:var(--pink-soft)}.dcard__body{align-content:center;gap:var(--s-8);min-width:0;display:grid}.dcard__sub{font-size:var(--t-micro);color:var(--muted-2)}.dcard__empty{font-size:var(--t-xs);color:var(--muted-2);line-height:1.4}.dcard__spark{display:block}.dcard__spark .spark{width:100%;height:calc(30px * var(--ui));display:block}.formchain{gap:calc(4px * var(--ui));grid-auto-flow:column;display:grid}.formchain__cell{height:calc(6px * var(--ui));border-radius:var(--r-pill);background:var(--surface-hi2)}.formchain__cell[data-win=true]{background:var(--green)}.formchain__cell[data-win=false]{background:var(--red)}.dlist{gap:calc(5px * var(--ui));min-width:0;display:grid}.dlist__row{align-items:baseline;gap:var(--s-8);min-width:0;display:flex}.dlist__name{font-size:var(--t-xs);color:var(--text);min-width:0}.dlist__val{font-family:var(--font-display);font-weight:700;font-size:var(--t-sm);color:var(--text);flex:none;margin-left:auto}.dlist__row[data-off] .dlist__name,.dlist__row[data-off] .dlist__val{color:var(--muted-2)}.sysbar{align-items:center;gap:var(--s-12);padding:var(--s-10) var(--s-16);border-radius:var(--r-control);border:1px solid var(--border);background:var(--surface);font-size:var(--t-xs);color:var(--muted-2);grid-area:sys;grid-template-columns:1fr auto 1fr;display:grid}.sysbar__mid{text-align:center}.sysbar__end{justify-self:end;align-items:center;gap:calc(6px * var(--ui));display:inline-flex}@media (max-width:640px){.sysbar{justify-items:center;gap:var(--s-6);text-align:center;grid-template-columns:minmax(0,1fr)}.sysbar__end{justify-self:center}}.locklist{gap:var(--s-10);margin:0;padding:0;list-style:none;display:grid}.locklist__row{align-items:flex-start;gap:var(--s-10);display:flex}.locklist__ico{width:calc(30px * var(--ui));height:calc(30px * var(--ui));color:var(--pink-soft);background:var(--pink-ghost);border:1px solid #ff2d6b33;border-radius:9px;flex:none;place-items:center;display:grid}@media (max-width:720px){.mm__modes{grid-template-columns:minmax(0,1fr)}.mmmode{min-height:calc(46px * var(--ui))}.mm__setup,.mm__setup--tri{grid-template-columns:repeat(2,minmax(0,1fr))}.playinfo{grid-template-columns:minmax(0,1fr)}.idcard__body{padding:var(--s-14) var(--s-14)}.idcard__who{flex-wrap:wrap}.idcard__acts{width:100%;margin-left:0}}@media (max-width:400px){.mystats{grid-template-columns:repeat(2,minmax(0,1fr))}}
