:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html,body{margin:0}[hidden]{display:none!important}img{max-width:100%}
@font-face{font-family:'Bitter';font-style:normal;font-weight:600 800;font-display:swap;src:url(fonts/bitter-normal-600-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Bitter';font-style:normal;font-weight:600 800;font-display:swap;src:url(fonts/bitter-normal-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Caveat';font-style:normal;font-weight:500 700;font-display:swap;src:url(fonts/caveat-normal-500-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Caveat';font-style:normal;font-weight:500 700;font-display:swap;src:url(fonts/caveat-normal-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/onest-normal-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/onest-normal-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'PT Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/pt-mono-normal-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'PT Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/pt-mono-normal-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'PT Serif';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/pt-serif-italic-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'PT Serif';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/pt-serif-italic-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/pt-serif-normal-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/pt-serif-normal-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/pt-serif-normal-700-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'PT Serif';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/pt-serif-normal-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Russo One';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/russo-one-normal-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Russo One';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/russo-one-normal-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{color-scheme:dark}
html,body{height:100%}
body{margin:0;display:flex;flex-direction:column;background:#0e0f11;color:#ecebe6;font:500 .875rem/1.2 Onest,system-ui,sans-serif;overflow:hidden}
.worlds{flex:1;min-height:0;position:relative}
.worlds>section{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
#sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sprite{position:absolute}
#toast{position:fixed;left:50%;bottom:calc(1rem + env(safe-area-inset-bottom,0px));transform:translate(-50%,1rem);max-width:min(90vw,26rem);opacity:0;background:#ecebe6;color:#0e0f11;padding:.7rem 1.1rem;border-radius:999px;font-weight:600;font-size:.9rem;transition:opacity .2s,transform .2s;pointer-events:none;z-index:50;text-align:center}
#toast.on{opacity:1;transform:translate(-50%,0)}
.g *,.g *::before,.g *::after{box-sizing:border-box}
.g button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:inherit}
.g button:focus-visible{outline:3px solid var(--focus,currentColor);outline-offset:3px}
.g button:disabled{cursor:default;color:inherit}
.g .ic{width:1.1em;height:1.1em;flex:none;vertical-align:-.16em}
.g .vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.g h1,.g h2,.g p,.g ul,.g ol{margin:0}
.g .app{min-height:100%;display:flex;flex-direction:column}
.g .top{flex-wrap:wrap;row-gap:.6rem}
.g .stats{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}
.g .stat{display:inline-flex;align-items:center;gap:.35rem}
.g .view:not([hidden]){animation:viewIn .3s cubic-bezier(.2,.8,.2,1) both}
@keyframes viewIn{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:none}}
.g .round{display:grid;gap:.9rem 1.4rem;grid-template-columns:minmax(0,1fr);grid-template-areas:"prog" "side" "stage" "dock"}
.g .prog{grid-area:prog;display:flex;align-items:center;gap:.5rem}
.g .side{grid-area:side;min-width:0}
.g .stage{grid-area:stage;min-width:0;container-type:inline-size}
.g .dock{grid-area:dock;min-width:0}
.g .dock:empty{display:none}
.g .task{min-height:11rem;display:flex;flex-direction:column;justify-content:center}
.g .word{display:flex;justify-content:center;align-items:flex-end}
.g .ch{display:inline-block;position:relative}
.g .word .ch{display:inline-flex;justify-content:center;align-items:center}
.g .v,.g .tile,.g .gapbtn,.g .tok{cursor:pointer}
.g .tiles{display:flex;justify-content:center;flex-wrap:wrap;gap:.9rem;margin-top:1.4rem}
.g .tile{touch-action:none;user-select:none;-webkit-user-select:none;position:relative}
.g .sentence{margin:0;text-wrap:balance}
.g .sentence .w{white-space:nowrap}
.g .gapbtn{position:relative;display:inline-block;width:.42em;height:1em;vertical-align:baseline;margin-inline:.04em}
.g .gapbtn::before{content:'';position:absolute;inset:-.55em -.4em}
.g .gapbtn .cm{position:static;display:inline;font:inherit;line-height:inherit}
.g .text{margin:0}
.g .tok{position:relative}
.g .fixes{list-style:none;padding:0;display:grid;gap:.5rem}
.g .fixes li{display:grid;gap:.1rem}
.g .fixes s{opacity:.7}
.g .fb{display:grid;grid-template-columns:minmax(0,1fr);gap:.75rem;align-items:start;justify-items:start;overflow-wrap:anywhere}
.g .fb-head{display:flex;align-items:center;flex-wrap:wrap;gap:.3rem 1rem;min-width:0}
.g .fb-body{min-width:0}
.g .chk{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;min-height:3rem}
.g .chk .next{flex:none}
.g .next{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3rem;padding:.7rem 1.3rem;max-width:100%}
.g .next span{min-width:0;overflow-wrap:anywhere}
@media(max-width:500px){
.g .fb .next{padding-inline:min(1.3rem,3cqw);gap:min(.6rem,2cqw)}
}
@media(min-width:900px),(orientation:landscape) and (min-width:640px) and (max-height:520px){
.g .round{grid-template-columns:minmax(0,1fr) minmax(14rem,19rem);grid-template-areas:"prog prog" "stage side" "dock side";align-items:start}
}
@media(prefers-reduced-motion:reduce){
.g *,.g *::before,.g *::after{animation-duration:.001ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
.g .themebtn{display:inline-flex;align-items:center;gap:.4rem;min-height:2.75rem;padding:.35rem .8rem;border:1.5px solid currentColor;border-radius:999px;font-size:.82rem;font-weight:600;white-space:nowrap;transition:transform .12s}
.g .themebtn:hover{transform:translateY(-1px)}
.g .foot{margin-top:2.4rem;padding-top:1rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1.2rem;font-size:.85rem}
.g .foot .hist{max-width:30rem;text-wrap:pretty}
.g .reset{min-height:2.75rem;padding:.4rem .2rem;text-decoration:underline;text-underline-offset:.2em;font-size:.85rem;opacity:.8}
.g .reset:hover{opacity:1}
.g .flip{transform:scaleX(-1)}
.g .prog{flex-wrap:wrap}
.g .backbtn{display:inline-flex;align-items:center;gap:.35rem;min-height:2.75rem;margin-right:.3rem}
.g .prevbtn{display:inline-flex;align-items:center;justify-content:center;min-width:2.75rem;min-height:2.75rem;margin-right:.3rem}
.g .prevbtn[hidden]{display:none}
.g .pip:disabled{cursor:default}
.g .viewnote{font-weight:700;font-size:.9rem}
.g .cardwrap{display:flex;flex-direction:column;align-items:flex-start;gap:.1rem;min-width:0}
.g .cardwrap>.card{width:100%;flex:1}
.g .runnote{font-weight:700}
.g .foot .warn{display:block;margin-top:.4rem}
.g .footbtns{display:flex;flex-wrap:wrap;gap:.2rem 1.2rem}
.g .backup{margin-top:1rem;padding:1.1rem;border:2px dashed currentColor;display:grid;gap:.6rem;max-width:40rem}
.g .backup h3{margin:0;font-size:1.1rem}
.g .backup p{margin:0;font-size:.9rem;text-wrap:pretty}
.g .backup label{font-size:.85rem;font-weight:700;margin-top:.4rem}
.g .backup textarea{width:100%;min-height:4.5rem;padding:.6rem .7rem;font:400 .8rem/1.4 ui-monospace,Menlo,Consolas,monospace;color:inherit;background:transparent;border:2px solid currentColor;border-radius:.3rem;resize:vertical;word-break:break-all}
.g .backup textarea:focus-visible{outline:3px solid var(--focus,currentColor);outline-offset:2px}
.g .bk-row{display:flex;flex-wrap:wrap;gap:.6rem}
.g .bk-msg{min-height:1.3em;font-weight:600}
.g .bk-msg[data-bad="1"]{text-decoration:underline wavy;text-underline-offset:.2em}
.g .bk-apply{display:grid;gap:.5rem;justify-items:start}
.g .reportbox[open]{display:flex;flex-direction:column;width:min(36rem,calc(100vw - 1.5rem));max-height:calc(100vh - 1.5rem);max-height:calc(100dvh - 1.5rem);padding:0;overflow:hidden;border:3px solid var(--ink,currentColor);border-radius:1rem;background:var(--sheet,var(--paper,#fff));color:var(--ink,inherit)}
.g .reportbox::backdrop{background:rgba(20,20,20,.55)}
.g .rp-body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;display:grid;gap:.6rem;align-content:start;padding:1.1rem 1.1rem .6rem}
.g .rp-foot{flex:none;display:grid;gap:.3rem;padding:.6rem 1.1rem .9rem;border-top:2px solid var(--ink,currentColor)}
.g .reportbox h3{margin:0;font-size:1.2rem;line-height:1.2;text-wrap:balance}
.g .reportbox h3:focus{outline:none}
.g .reportbox p{margin:0;font-size:.9rem;text-wrap:pretty}
.g .reportbox label{font-size:.85rem;font-weight:700;margin-top:.3rem}
.g .reportbox textarea{width:100%;min-height:3.4rem;padding:.6rem .7rem;font:400 .85rem/1.4 ui-monospace,Menlo,Consolas,monospace;color:inherit;background:transparent;border:2px solid currentColor;border-radius:.3rem;resize:vertical}
.g .reportbox textarea:focus-visible{outline:3px solid var(--focus,currentColor);outline-offset:2px}
.g .reportbox #rp-prev{opacity:.9}
.g .reportbox .rp-chk{display:flex;align-items:flex-start;gap:.6rem;min-height:2.75rem;font-weight:600;margin-top:.1rem}
.g .reportbox .rp-chk input{flex:none;width:1.4rem;height:1.4rem;margin:.1rem 0 0}
.g .reportbox .rp-where{font-weight:600}
.g .reportbox .bk-row{gap:.4rem .5rem}
.g .reportbox .cta{min-height:2.9rem;padding:.5rem 1.1rem;font-size:1rem;gap:.4rem}
.g .reportbox .ghost{min-height:2.7rem;padding:.4rem .9rem;font-size:.85rem}
.g .reportbox .rp-msg{min-height:0}
.g .reportbox .rp-msg:empty{display:none}
.g .shop-bal{font-weight:700}
.g .offers{list-style:none;padding:0;margin:0;display:grid;gap:.8rem;width:100%}
.g .offer{display:grid;gap:.4rem;justify-items:start;padding:.9rem 1rem;border:2px dashed currentColor;border-radius:.8rem}
.g .offer h3{margin:0}
.g .offer-soon{font-weight:700}
.g .ghost:disabled{opacity:.55;cursor:not-allowed}
.g .ghost:disabled:active{transform:none;box-shadow:inherit}
.g .draftbadge{align-self:center;margin:0 0 .5rem;padding:.15rem .6rem;border:1.5px dashed currentColor;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.8}
.g .msg{position:relative;padding:.9rem 1rem 1rem;max-width:34rem;margin-inline:auto;width:100%}
.g .msg-h{font-size:.8rem;opacity:.75;margin:0 0 .5rem}
.g .msg-b{margin:0;overflow-wrap:anywhere;font-size:clamp(min(1.2rem,8cqw),4.6cqw,1.7rem);line-height:1.6;text-wrap:pretty}
.g .t9gap{display:inline-block;padding:0 .3em;margin-inline:.05em;border-bottom:.1em dashed currentColor;transition:background .15s}
.g .t9gap.hot{background:rgba(255,197,49,.55)}
.g .t9gap b{font-weight:800}
.g .t9tile{min-width:5rem;max-width:100%;font-size:1.2rem!important;height:auto!important;min-height:3.4rem;padding:0 1rem!important;white-space:normal;overflow-wrap:anywhere;line-height:1.15}
.g .turn{margin-left:.4rem;font-size:.85rem}
.g .duelbox{max-width:36rem;margin-inline:auto;display:grid;gap:1rem;justify-items:start}
.g .duelbox h2{font-size:clamp(1.5rem,5vw,2.1rem);line-height:1.1;text-wrap:balance}
.g .duelbox .lead{max-width:30rem;text-wrap:pretty}
.g .duelnames{display:grid;gap:.4rem;width:100%}
.g .duelnames label{font-size:.85rem;font-weight:700;margin-top:.4rem}
.g .duelnames input{width:100%;min-height:3rem;padding:.5rem .8rem;font:inherit;font-size:1.1rem;color:inherit;background:transparent;border:2px solid currentColor;border-radius:.3rem}
.g .duelnames input:focus-visible{outline:3px solid var(--focus,currentColor);outline-offset:2px}
.g .duelbox .acts{display:flex;flex-wrap:wrap;gap:.8rem}
.g .duelres .score{display:flex;align-items:baseline;gap:.5rem;font-size:clamp(3.5rem,16vw,6rem);line-height:1}
.g .duelres .verdict{font-size:1.15rem;text-wrap:balance}
.g .tw{width:100%;overflow-x:auto}
.g .duelt{border-collapse:collapse;width:100%;min-width:15rem}
.g .duelt th,.g .duelt td{padding:.5rem .6rem;text-align:left;border-bottom:1px solid currentColor;font-size:.95rem}
.g .duelt thead th{font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}
.g .duelt td{text-align:center}
.g .duelt td[data-ok="1"]{color:var(--good,inherit)}.g .duelt td[data-ok="0"]{color:var(--bad,inherit)}
.g .tw{position:relative}
.g .duelt td,.g .duelt th{position:relative}
.g .coach{margin:0 0 1.2rem;padding:.9rem 1rem 1rem;display:grid;gap:.4rem;justify-items:start}
.g .coach[hidden]{display:none}
.g .cstep{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.g .ctitle{font-size:1.25rem;line-height:1.15}
.g .ctext{max-width:34rem;text-wrap:pretty}
.g .coach .acts,.g .tutcard .acts{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:.4rem}
.g .tutcard{margin:0 0 1.4rem;padding:1rem;display:grid;gap:.4rem;justify-items:start}
.g .tutcard h2{font-size:1.2rem;line-height:1.15}
.g .spot{outline:3px dashed currentColor;outline-offset:4px;animation:spotp 1.4s ease-in-out infinite}
@keyframes spotp{50%{outline-offset:7px}}
.g .duelres .grid{font-size:1.6rem;letter-spacing:.1em}
.g .fb-acts{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.2rem}
.g .linkbtn{min-height:2.75rem;padding:.3rem .1rem;font-size:.85rem;text-decoration:underline;text-underline-offset:.2em;opacity:.85}
.g .linkbtn:hover{opacity:1}
.g .ctx{overflow-wrap:anywhere;text-align:center;font-size:1.1rem;line-height:1.4;margin:0 auto .3rem;max-width:30rem;text-wrap:balance}
.g .ctxgap{display:inline-block;min-width:2.4em;margin-inline:.15em;border-bottom:2px dashed currentColor;text-align:center}
.g .word .ch.sp{min-width:.32em}
.g .gapbtn.on .caret,.g .gapbtn.is-ok .caret,.g .gapbtn.is-bad .caret,.g .gapbtn.is-key .caret{display:none}
.g .chk .hint{text-wrap:pretty}
.g .lives{display:inline-flex;gap:.35rem;margin-left:.3rem}
.g .life{display:block;width:1.05rem;height:1.05rem;border-radius:50%;background:var(--bad,currentColor);border:2px solid currentColor}
.g .life.lost{background:transparent;opacity:.35}
.g .infobox{gap:.7rem}
.g .infobox h3{margin:.8rem 0 0;font-size:1.1rem;line-height:1.2}
.g .infobox p{max-width:36rem;text-wrap:pretty}
.g .infobox code{font-size:.9em}
.g .week{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.g .week li{display:grid;place-items:center;width:2.6rem;height:2.6rem;border:2px solid currentColor;border-radius:50%;font-size:.85rem;font-weight:700;position:relative}
.g .week li[data-on="1"]{background:var(--good);border-color:var(--good);color:#fff}
.g .week li[data-future="1"]{opacity:.5;border-style:dashed}
.g .week li[data-today="1"]{outline:3px solid currentColor;outline-offset:2px}
.g .rules{list-style:none;padding:0;margin:0;display:grid;gap:.45rem;width:100%}
.g .rules li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.1rem .8rem;padding-bottom:.45rem;border-bottom:1px dotted currentColor}
.g .rules small{grid-column:1/-1;opacity:.8}
.g .stt td{text-align:left}
.g .verdict .who{white-space:nowrap}
.g .foot .upd{display:block;margin-top:.4rem;font-weight:700}
.g [tabindex="-1"]:focus{outline:none}
.g .gapbtn:disabled .caret{display:none}
.g .fb .right{font-weight:700}
.g .stt th,.g .stt td{padding:.45rem .35rem;font-size:.88rem}
.g .stt{min-width:0}
.g .week{gap:.3rem}
.g .week li{width:2.25rem;height:2.25rem;font-size:.8rem}
.g .ctx.big{font-size:clamp(min(1.35rem,9cqw),5.6cqw,2rem);line-height:1.8;margin:.4rem auto 0;max-width:34rem}
.g .ctx .gap.ig{display:inline-block;min-width:3.2em;padding:0 .2em;text-align:center;border-bottom:.08em dashed currentColor;transition:background .15s}
.g .ctx .gap.ig b{font-weight:800}
.g .tiles.wide .tile{min-width:0;max-width:100%;height:auto;min-height:3.4rem;padding:.4rem 1rem;font-size:1.2rem;line-height:1.15;overflow-wrap:anywhere}
.g .winput{position:relative;margin:.9rem auto 0;max-width:34rem;width:100%;min-height:3.7rem;padding:.4rem .8rem;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;font-size:clamp(1.5rem,7cqw,2.3rem);line-height:1.2}
.g .winput.empty::before{content:attr(data-ph);opacity:.4;letter-spacing:.06em;font-size:.7em}
.g .winput .wcur{display:inline-block;width:.09em;height:1.1em;margin-left:.06em;background:currentColor;animation:blink 1s steps(2,start) infinite}
.g .winput.empty .wcur{order:-1;margin:0 .3em 0 0}
@keyframes blink{to{opacity:0}}
.g .winput .x{font-style:normal;color:var(--bad,currentColor);text-decoration:underline wavy;text-decoration-thickness:.08em}
.g .winput.is-ok{color:var(--good,currentColor)}
.g .wline{min-height:1.4em;margin:.35rem 0 0;text-align:center;font-size:.9rem;font-weight:600}
.g .kbd[hidden]{display:none}
.g .kbd{display:grid;gap:.32rem;margin:.6rem auto 0;width:100%;max-width:36rem;user-select:none;-webkit-user-select:none;touch-action:manipulation}
.g .krow{display:flex;gap:.22rem;justify-content:center}
.g .key{flex:1 1 0;min-width:0;height:2.9rem;display:grid;place-items:center;padding:0;font-size:1.15rem;line-height:1}
.g .key.kw{flex:1.6}
.g .key.ksp{flex:3;font-size:.85rem}
.g .key.kok{flex:4;font-size:.9rem}
.g .key:disabled{opacity:.55}
.g .key .ic{width:1.5em;height:1.5em}
@media(max-height:520px){.g .key{height:2.75rem}}
@supports(font-size:1cqw){
.g .round[data-type=write] .key:not(.ksp):not(.kok){font-size:min(1.05rem,8cqw)}
.g .round[data-type=write] .key.ksp{font-size:min(.85rem,5cqw)}
.g .round[data-type=write] .key.kok{font-size:min(.9rem,5cqw)}
}
@media(max-width:899px){
.g .round[data-type=write]{grid-template-columns:minmax(0,1fr);grid-template-areas:"prog" "stage" "dock"}
.g .round[data-type=write] .side{display:none}
.g .round[data-type=write] .fb .quip{display:block}
.g .round[data-type=write] .fb .right{display:none}
}
@media(max-width:360px){
.g .round[data-type=write] .krow{gap:.125rem}
.g .round[data-type=write] .key:not(.ksp):not(.kok){font-size:min(1rem,8cqw)}
}
@supports(height:100dvh){body{height:100dvh}}
.g .stat{min-height:2.75rem}
@media(max-width:520px),(orientation:landscape) and (max-height:520px){
.g .prog[data-many="1"]{flex-wrap:wrap;gap:.22rem}
.g .prog[data-many="1"] .pip{flex:1 1 0;min-width:.35rem;width:auto;height:.7rem;border-width:2px;border-radius:99px;font-size:0;box-shadow:none}
.g .prog[data-many="1"] .pip[data-s]{transform:none}
.g .prog[data-many="1"] .pip[data-s=cur]{height:1.05rem}
.g .prog[data-many="1"] .pip::before,.g .prog[data-many="1"] .pip::after{content:none;display:none}
.g .prog[data-many="1"] .cnt{flex:none;margin-left:.35rem;white-space:nowrap}
.g .prog[data-many="1"] .turn{display:none}
}
.g .dock[data-state=idle]{position:sticky;bottom:max(.4rem,env(safe-area-inset-bottom,0px));z-index:5}
@media(orientation:landscape) and (max-height:520px){
.g .app[data-view=round] .top{display:none}
.g .app[data-view=round] main{margin-top:0}
.g .round{grid-template-columns:minmax(0,1fr);grid-template-areas:"prog" "stage" "dock";gap:.55rem}
.g .round .side{display:none}
.g .round .fb .quip{display:block}
.g .round[data-type=write] .fb .right{display:none}
.g .task{min-height:0}
.g .backbtn{min-height:2.5rem}
.g .round[data-answered]{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-areas:"prog prog" "stage dock";align-items:start}
.g .round[data-answered] .dock{position:sticky;top:.5rem}
.g .tiles{margin-top:.9rem}
.g .round[data-type=write] .task:not([data-done]){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);grid-template-areas:"msg kbd" "inp kbd" "line kbd";column-gap:1.1rem;align-items:start;align-content:center}
.g .round[data-type=write] .task:not([data-done]) .msg{grid-area:msg;max-width:none}
.g .round[data-type=write] .task:not([data-done]) .winput{grid-area:inp;max-width:none;margin-top:.6rem}
.g .round[data-type=write] .task:not([data-done]) .wline{grid-area:line}
.g .round[data-type=write] .task:not([data-done]) .kbd{grid-area:kbd;margin:0;max-width:none;align-self:center}
.g .round[data-type=write] .task .draftbadge{grid-column:1/-1}
.g .round[data-type=write] .key{height:clamp(2.2rem,calc((100vh - 9.5rem)/4.6),3rem)}
@supports(height:100dvh){.g .round[data-type=write] .key{height:clamp(2.2rem,calc((100dvh - 9.5rem)/4.6),3rem)}}
.g .round[data-type=write] .msg{padding:.6rem .8rem .7rem}
.g .round[data-type=write] .msg-b{font-size:1.15rem;line-height:1.45}
.g .round[data-type=write] .winput{min-height:3rem;font-size:1.65rem}
}
@media(orientation:portrait) and (max-height:700px){
.g .round[data-type=write] .key{height:2.55rem}
.g .round[data-type=write] .kbd{gap:.28rem;margin-top:.45rem}
.g .round[data-type=write] .winput{min-height:3rem;margin-top:.6rem}
.g .round[data-type=write] .msg{padding:.65rem .9rem .75rem}
.g .round[data-type=write] .msg-b{font-size:1.15rem;line-height:1.45}
.g .round[data-type=write] .wline{min-height:1.2em;margin-top:.2rem}
.g .round[data-type=write] .task{min-height:0}
}
.g .marks li{position:relative;max-width:100%;overflow-wrap:anywhere}
@media(orientation:portrait) and (max-height:700px){
.g .app[data-view=round][data-type=write] .top{display:none}
.g .app[data-view=round][data-type=write] main{margin-top:0}
}
.g .text .tkw{white-space:nowrap}
@media(orientation:landscape) and (max-height:520px){
.g .coach{grid-template-columns:minmax(0,1fr) auto;column-gap:1rem;row-gap:.15rem;align-items:center;padding:.5rem .8rem;margin-bottom:.5rem}
.g .coach .cstep,.g .coach .ctitle,.g .coach .ctext{grid-column:1}
.g .coach .ctitle{font-size:1.05rem}
.g .coach .ctext{font-size:.9rem;line-height:1.3}
.g .coach .acts{grid-column:2;grid-row:1/4;margin:0;flex-direction:column;align-items:stretch;gap:.4rem}
.g .coach .cta,.g .coach .ghost{min-height:2.6rem;padding:.35rem .9rem;font-size:.9rem;justify-content:center}
}
.g .info-popup{box-shadow:5px 5px 0 var(--ink);}
.g .info-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem}
.g .info-head h3{align-self:center}
.g .info-head button{flex:none}
.g .info-popup .rp-body{padding-bottom:1.1rem}
.g .info-popup .info-head h3{min-width:0;overflow-wrap:anywhere}
.g .info-popup .bk-row>*{max-width:100%;white-space:normal;overflow-wrap:anywhere}
html,body{background-color:#FFC531}
.wb{
--sun:#FFC531;--tomato:#D43C21;--teal:#12A38B;--sky:#9ADDF6;--ink:#141414;--paper:#fff;--focus:#141414;
background-color:var(--sun);
background-image:linear-gradient(116deg,transparent 0 62%,rgba(20,20,20,.07) 62% 100%),radial-gradient(circle at 10% 92%,rgba(240,72,44,.2) 0 9rem,transparent 9.05rem);
color:var(--ink);font:500 1.0625rem/1.45 Onest,system-ui,sans-serif}
.wb .app{width:min(100%,68rem);margin-inline:auto;padding-block:1rem 2.2rem;padding-inline:max(1rem,env(safe-area-inset-left),env(safe-area-inset-right))}
.wb .top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.wb .brand{display:flex;align-items:center;gap:.6rem;font:400 1.7rem/1 'Russo One',sans-serif}
.wb .brand .logo{width:2.1rem;height:2.7rem}
.wb .brand .wm{text-shadow:.08em .08em 0 var(--tomato)}
.wb .stats{gap:.7rem}
.wb .stat{padding:.4rem .8rem;background:var(--paper);border:3px solid var(--ink);border-radius:999px;box-shadow:.2rem .2rem 0 var(--ink);font:800 .95rem/1 Onest,sans-serif}
.wb .s-streak .ic{color:var(--tomato)}.wb .s-ink .ic{color:#086657}
.wb main{margin-top:1.2rem}
.wb .hero{display:grid;gap:1.4rem;align-items:center;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.wb .hero{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:2rem}}
.wb .hostwrap{display:flex;align-items:flex-end;gap:.8rem}
.wb .host{flex:none;width:clamp(6rem,24vw,10.5rem);height:auto;overflow:visible}
.wb .say{position:relative;overflow-wrap:anywhere;padding:.8rem 1rem;background:var(--paper);border:3px solid var(--ink);border-radius:1.1rem;box-shadow:.25rem .25rem 0 var(--ink);font-weight:600;font-size:1rem;max-width:20rem;margin-bottom:2rem;text-wrap:pretty}
.wb .say::before{content:'';position:absolute;left:-.62rem;bottom:1.1rem;width:1rem;height:1rem;background:var(--paper);border-left:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:rotate(45deg)}
.wb .pup{transform:translate(var(--ex,0px),var(--ey,0px));transition:transform .09s linear}
.wb .host .body{transform-box:fill-box;transform-origin:50% 100%}
.wb .brow{transform-box:fill-box;transform-origin:50% 50%;transition:transform .22s cubic-bezier(.2,1.4,.4,1)}
.wb .hero .host .body,.wb [data-phase=idle] .host .body{animation:bob 3.4s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(3px) scaleY(.985)}}
@keyframes hop{0%{transform:scale(1.08,.9)}35%{transform:translateY(-1.3rem) scale(.94,1.1)}70%{transform:scale(1.06,.94)}100%{transform:none}}
@keyframes sag{0%{transform:rotate(-5deg)}25%{transform:rotate(5deg)}50%{transform:rotate(-3deg)}100%{transform:scale(1,.94)}}
.wb [data-phase=ok] .host .body,.wb .big[data-mood=happy] .host .body{animation:hop .7s cubic-bezier(.3,1.5,.5,1) both}
.wb [data-phase=bad] .host .body,.wb .big[data-mood=sad] .host .body{animation:sag .55s ease-out both}
.wb [data-phase=ok] .brow.l,.wb .big[data-mood=happy] .brow.l{transform:translateY(-3px) rotate(-10deg)}
.wb [data-phase=ok] .brow.r,.wb .big[data-mood=happy] .brow.r{transform:translateY(-3px) rotate(10deg)}
.wb [data-phase=bad] .brow.l,.wb .big[data-mood=sad] .brow.l{transform:translateY(1px) rotate(16deg)}
.wb [data-phase=bad] .brow.r,.wb .big[data-mood=sad] .brow.r{transform:translateY(1px) rotate(-16deg)}
.wb h1{font:400 clamp(2rem,6.2vw,3.7rem)/1.02 'Russo One',sans-serif;overflow-wrap:break-word;margin-bottom:1rem;text-wrap:balance}
.wb h1 span{display:inline-block;margin-top:.15em;padding:0 .18em .04em;background:var(--tomato);color:var(--paper);border:3px solid var(--ink);border-radius:.15em;box-shadow:.07em .07em 0 var(--ink);transform:rotate(-1.8deg)}
.wb .lede{max-width:32rem;margin-bottom:1.5rem;font-weight:500;text-wrap:pretty}
.wb .cta,.wb .next{max-width:100%;display:inline-flex;align-items:center;gap:.7rem;min-height:3.5rem;padding:.9rem 1.6rem;background:var(--tomato);color:var(--paper);border:3px solid var(--ink);border-radius:1rem;box-shadow:.35rem .35rem 0 var(--ink);font:400 1.3rem/1 'Russo One',sans-serif;transition:transform .1s,box-shadow .1s}
.wb .cta span{min-width:0;overflow-wrap:anywhere}
.wb .cta:hover,.wb .next:hover{transform:translate(-2px,-2px);box-shadow:.5rem .5rem 0 var(--ink)}
.wb .cta:active,.wb .next:active{transform:translate(.35rem,.35rem);box-shadow:0 0 0 var(--ink)}
.wb .ghost{min-height:3rem;padding:.7rem 1.1rem;background:var(--paper);border:3px solid var(--ink);border-radius:999px;box-shadow:.2rem .2rem 0 var(--ink);font-weight:800;font-size:.95rem;transition:transform .1s,box-shadow .1s}
.wb .ghost:active{transform:translate(.2rem,.2rem);box-shadow:0 0 0 var(--ink)}
.wb .sec{margin:2.4rem 0 1rem;font:400 1.5rem/1 'Russo One',sans-serif}
.wb .modes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,9rem),1fr));gap:1.1rem}
.wb .card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;min-height:9.6rem;padding:.9rem 1rem 1rem;background:var(--paper);border:3px solid var(--ink);border-radius:1.1rem;box-shadow:.3rem .3rem 0 var(--ink);transition:transform .1s,box-shadow .1s}
.wb button.card:hover{transform:translate(-2px,-2px) rotate(-.6deg);box-shadow:.45rem .45rem 0 var(--ink)}
.wb button.card:active{transform:translate(.3rem,.3rem);box-shadow:0 0 0 var(--ink)}
.wb .card .ico{position:relative;font:400 2.5rem/1 'Russo One',sans-serif;margin-bottom:.2rem}
.wb .card .ico .ac{position:absolute;left:.42em;top:-.16em;width:.2em;height:.34em;background:var(--ink);clip-path:polygon(0 100%,45% 100%,100% 0,55% 0)}
.wb .card b{font:400 1.2rem/1.1 'Russo One',sans-serif}
.wb .card small{font-size:.92rem;line-height:1.3;text-wrap:pretty}
.wb .card.soon{background:transparent;border-style:dashed;box-shadow:none}
.wb .card .tag{position:absolute;top:.6rem;right:.6rem;padding:.15rem .55rem;background:var(--sun);border:2px solid var(--ink);border-radius:999px;font-weight:800;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em}
.wb .prog{counter-reset:pp}
.wb .pip{counter-increment:pp;display:grid;place-items:center;width:2.2rem;height:2.2rem;background:var(--paper);border:3px solid var(--ink);border-radius:50%;font:400 .9rem/1 'Russo One',sans-serif;transition:background .2s,transform .25s cubic-bezier(.2,1.6,.4,1)}
.wb .pip::before{content:counter(pp)}
.wb .pip[data-s=cur]{background:var(--sun);transform:scale(1.18);box-shadow:.15rem .15rem 0 var(--ink)}
.wb .pip[data-s=ok]{background:var(--teal)}.wb .pip[data-s=bad]{background:var(--tomato);color:var(--paper)}
.wb .cnt{margin-left:auto;font-weight:800;font-size:.85rem}
.wb .stage{position:relative;padding:1.2rem 1rem 1.5rem;background:var(--paper);border:3px solid var(--ink);border-radius:1.4rem;box-shadow:.5rem .5rem 0 var(--ink)}
.wb .prompt{overflow-wrap:anywhere;font:400 min(1.3rem,9cqw)/1.15 'Russo One',sans-serif;margin-bottom:.9rem;text-wrap:balance}
.wb .word{gap:.06em;padding:1.1rem 0 .4rem;font:400 min(5.2rem,calc(112cqw/var(--n)))/1 'Russo One',sans-serif}
.wb .word .ch{min-width:.64em;padding:.1em .06em .14em;text-align:center;background:var(--paper);border:.05em solid var(--ink);border-radius:.16em;box-shadow:0 .07em 0 var(--ink);transition:transform .1s,box-shadow .1s,background .15s}
.wb .word .ch.v:hover{transform:translateY(-.06em);background:var(--sun)}
.wb .word .ch.v:active{transform:translateY(.06em);box-shadow:0 0 0 var(--ink)}
.wb .word .ch.is-ok,.wb .word .ch.is-key{background:var(--teal)}
.wb .word .ch.is-bad{background:var(--tomato);color:var(--paper);animation:shake .4s}
.wb .stress .ch.is-ok::after,.wb .stress .ch.is-key::after{content:'';position:absolute;top:-.2em;left:50%;width:.16em;height:.32em;background:var(--ink);clip-path:polygon(0 100%,45% 100%,100% 0,55% 0);animation:accIn .4s cubic-bezier(.2,1.7,.4,1) both}
@keyframes accIn{from{transform:translateX(-50%) translateY(-.4em) scale(2);opacity:0}to{transform:translateX(-50%);opacity:1}}
@keyframes shake{20%{transform:translateX(-.08em)}40%{transform:translateX(.08em)}60%{transform:translateX(-.05em)}80%{transform:translateX(.04em)}}
@keyframes signIn{from{transform:translateY(-.3em) scale(1.9);opacity:0}to{transform:none;opacity:1}}
.wb .word .gap{min-width:.64em;border-style:dashed;background:transparent;box-shadow:none}
.wb .word .gap.hot{background:var(--sun)}
.wb .word .gap.is-ok{border-style:solid;background:var(--teal)}.wb .word .gap.is-bad{border-style:solid;background:var(--tomato);color:var(--paper);animation:shake .4s}
.wb .tiles{margin-top:1.6rem}
.wb .tile{min-width:4.2rem;height:4.4rem;padding:0 1.1rem;background:var(--sun);border:3px solid var(--ink);border-radius:1rem;box-shadow:0 .3rem 0 var(--ink);font:400 2.2rem/1 'Russo One',sans-serif;cursor:grab}
.wb .tile.held{cursor:grabbing;z-index:9;box-shadow:0 .9rem 0 var(--ink)}
.wb .sentence{padding:1.4rem 0 .6rem;font:400 clamp(min(1.5rem,10cqw),5.8cqw,2.5rem)/1.65 'Russo One',sans-serif;text-align:center}
.wb .sentence .gapbtn{--mk:',';display:inline-block;position:relative;width:.95em;height:1.3em;margin-inline:.1em;vertical-align:middle;border:.07em dashed var(--ink);border-radius:.36em;background:transparent;transition:background .15s,transform .15s,border-color .15s}
.wb .sentence[data-mark=":"] .gapbtn{--mk:':';--gs:1.35em}
.wb .sentence:not([data-mark=":"]):not([data-mark="—"]) .gapbtn{--gs:1.45em;--lift:.6em}
.wb .sentence[data-mark="—"] .gapbtn{--mk:'—';width:1.9em}
.wb .gapbtn .caret{position:absolute;inset:0;display:grid;place-items:center;padding-bottom:var(--lift,0)}
.wb .gapbtn .caret::after{content:var(--mk);font-size:var(--gs,1em);line-height:1;opacity:.5;transition:opacity .15s}
.wb .gapbtn:hover{background:var(--sun);border-style:solid}
.wb .gapbtn:hover .caret::after{opacity:1}
.wb .sentence .gapbtn .cm{position:absolute;inset:0;display:grid;place-items:center;padding-bottom:var(--lift,0);font-size:var(--gs,1em);font-weight:400;line-height:1;color:var(--ink)}
.wb .gapbtn.on{background:var(--sun);border-style:solid;box-shadow:.08em .08em 0 var(--ink)}
.wb .gapbtn.on .caret,.wb .gapbtn.is-ok .caret,.wb .gapbtn.is-bad .caret,.wb .gapbtn.is-key .caret{display:none}
.wb .gapbtn.is-ok,.wb .gapbtn.is-bad,.wb .gapbtn.is-key{box-shadow:none}
.wb .gapbtn.is-ok::after,.wb .gapbtn.is-bad::after,.wb .gapbtn.is-key::after{position:absolute;right:-.75em;top:-.95em;display:grid;place-items:center;width:1.6em;height:1.6em;border:.12em solid var(--ink);border-radius:50%;background:var(--paper);color:var(--ink);font:800 .5em/1 Onest,sans-serif}
.wb .gapbtn.is-ok{background:var(--teal);border-style:solid}
.wb .gapbtn.is-ok::after{content:'✓'}
.wb .gapbtn.is-ok .cm{animation:signIn .4s cubic-bezier(.2,1.7,.4,1) both}
.wb .gapbtn.is-bad{background:var(--tomato);border-style:solid;animation:shake .4s}
.wb .gapbtn.is-bad::after{content:'✕';background:var(--ink);color:var(--paper)}
.wb .gapbtn.is-bad .cm{color:var(--paper)}
.wb .gapbtn.is-key{background:var(--paper);border:.09em dashed var(--good)}
.wb .gapbtn.is-key::after{content:'+';background:var(--sun)}
.wb .gapbtn.is-key .cm{color:var(--good);animation:signIn .4s cubic-bezier(.2,1.7,.4,1) both}
.wb .gapbtn:disabled:not(.is-ok):not(.is-bad):not(.is-key){border-color:transparent;background:transparent}
.wb .cap{display:inline-block;margin-bottom:.6rem;padding:.2rem .7rem;background:var(--sky);border:2px solid var(--ink);border-radius:999px;font-weight:800;font-size:.8rem}
.wb .text{font:600 clamp(1.05rem,3.5cqw,1.4rem)/2.1 Onest,sans-serif}
.wb .tok{padding:.06em .2em;margin:.05em calc(-.2em - 3px);border:3px solid transparent;border-radius:.6em;transition:background .12s,transform .12s,box-shadow .12s}
.wb .tok:hover{background:var(--sun)}
.wb .tok[aria-pressed=true]{background:var(--sun);border-color:var(--ink);box-shadow:.12em .12em 0 var(--ink);transform:rotate(-1.2deg)}
.wb .tok.hit{background:var(--teal);border-color:var(--ink);box-shadow:none;transform:none}
.wb .tok.miss{background:var(--paper);border:3px dashed var(--tomato);transform:none;box-shadow:none}
.wb .tok.fp{background:var(--tomato);color:var(--paper);border-color:var(--ink);box-shadow:none;transform:none}
.wb .hint{font-weight:600}
.wb .dock:not(:empty){padding-top:.2rem}
.wb .fb{padding:1rem 1.1rem;border:3px solid var(--ink);border-radius:1.2rem;box-shadow:.4rem .4rem 0 var(--ink);background:#C9F2E6}
.wb .fb[data-ok="0"]{background:#FFD5CB}
.wb .vd{display:inline-block;flex:none;padding:.1rem .6rem .18rem;background:var(--paper);border:3px solid var(--ink);border-radius:.6rem;box-shadow:.15rem .15rem 0 var(--ink);font:400 1.8rem/1.1 'Russo One',sans-serif;transform:rotate(-2deg);animation:vdIn .45s cubic-bezier(.2,1.7,.4,1) both}
.wb .vd.is-ok{color:#086657}.wb .vd.is-bad{color:#a3200d}
@keyframes vdIn{from{transform:rotate(-12deg) scale(.3);opacity:0}to{transform:rotate(-2deg);opacity:1}}
.wb .why{text-wrap:pretty}
.wb .fb .quip{display:none}
.wb .fb .next{background:var(--ink);color:var(--paper);box-shadow:.3rem .3rem 0 var(--tomato);font-size:1.1rem;min-height:3.2rem}
.wb .fixes li{padding-bottom:.5rem;border-bottom:2px dotted rgba(20,20,20,.3)}
.wb .fixes .fx{font-weight:800}.wb .fixes b{color:#086657}.wb .fixes .nt{font-size:.95rem}
.wb .fixes li.lost .fx s{color:#a3200d}.wb .fixes li.fp b{color:#a3200d}
.wb .chk .n{display:inline-grid;place-items:center;min-width:1.6rem;height:1.6rem;border-radius:50%;background:var(--sun);color:var(--ink);font:400 .9rem 'Russo One',sans-serif}
.wb .side .hostwrap{align-items:flex-end}
.wb .side .host{width:clamp(4.2rem,17vw,5.5rem)}
.wb .side .say{margin-bottom:1.1rem;font-size:.95rem}
.wb .side{overflow-x:clip}
.wb .camwrap{flex:none;width:clamp(3.6rem,14vw,4.6rem);transform:translateX(140%);opacity:0;transition:transform .4s cubic-bezier(.2,1.5,.4,1),opacity .2s;pointer-events:none}
.wb .side[data-phase=bad] .camwrap{transform:none;opacity:1}
.wb .cam{display:block;width:100%;height:auto}
@media(min-width:900px),(orientation:landscape) and (min-width:640px) and (max-height:520px){
.wb .side .hostwrap{flex-wrap:wrap;position:sticky;top:1rem}
.wb .side .host{width:8.5rem}
.wb .camwrap{width:5.6rem;margin-left:-1.5rem}
.wb .side .say{order:3;flex-basis:100%;max-width:none;margin:.4rem 0 0}
.wb .side .say::before{left:2rem;top:-.6rem;bottom:auto;transform:rotate(135deg)}
}
.wb .cf{position:absolute;left:50%;top:40%;pointer-events:none;z-index:6;font:400 1.7rem/1 'Russo One',sans-serif}
.wb .res{display:grid;gap:1rem;justify-items:center;text-align:center;max-width:36rem;margin-inline:auto;position:relative}
.wb .res h2{font:400 clamp(1.5rem,5vw,2.1rem)/1.1 'Russo One',sans-serif;text-wrap:balance}
.wb .res .big{font:400 clamp(4.5rem,20vw,8rem)/1 'Russo One',sans-serif;color:var(--paper);text-shadow:.045em .045em 0 var(--ink),-.02em -.02em 0 var(--ink),.02em -.02em 0 var(--ink),-.02em .02em 0 var(--ink)}
.wb .res .big span{font-size:.4em}
.wb .marks{list-style:none;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem}
.wb .marks li{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .8rem;border:3px solid var(--ink);border-radius:999px;background:var(--paper);font-weight:800;font-size:.9rem}
.wb .marks li[data-ok="1"]{background:var(--teal)}.wb .marks li[data-ok="0"]{background:var(--tomato);color:var(--paper)}
.wb .earn{text-wrap:pretty}
.wb .acts{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem}
.wb .themebtn{padding:.4rem .8rem;background:var(--paper);border:3px solid var(--ink);box-shadow:.2rem .2rem 0 var(--ink);font:800 .85rem/1 Onest,sans-serif;color:var(--ink)}
.wb .themebtn:active{transform:translate(.2rem,.2rem);box-shadow:0 0 0 var(--ink)}
.wb .foot{border-top:3px dashed var(--ink);font-weight:500}
.wb .backbtn{padding:.35rem .9rem .35rem .7rem;background:var(--paper);border:3px solid var(--ink);border-radius:999px;box-shadow:.15rem .15rem 0 var(--ink);font:800 .85rem/1 Onest,sans-serif}
.wb .backbtn:active{transform:translate(.15rem,.15rem);box-shadow:0 0 0 var(--ink)}
.wb .stress .ch.v{background:#FFF1BF}
.wb .stress .ch.v::before{content:'';position:absolute;left:12%;right:12%;bottom:-.24em;border-bottom:.07em dashed var(--ink);opacity:.75}
.wb .stress .ch.v.is-ok::before,.wb .stress .ch.v.is-bad::before,.wb .stress .ch.v.is-key::before{display:none}
.wb .stress .ch.v.is-ok,.wb .stress .ch.v.is-key{background:var(--teal)}
.wb .stress .ch.v.is-bad{background:var(--tomato)}
@media(min-width:900px){.wb h1{font-size:clamp(2rem,4.2vw,3.7rem)}}
.wb .chars{display:grid;gap:.9rem}
.wb .hostwrap.duo{align-items:flex-end}
.wb .duo .cam{flex:none;width:clamp(3.6rem,15vw,5.2rem);height:auto;overflow:visible}
.wb .duo .sof{flex:none;width:clamp(3rem,12vw,4.2rem);height:auto;overflow:visible;align-self:flex-end}
.wb .duo .say{margin-bottom:1.6rem;font-size:.95rem}
.wb .side[data-phase=ok][data-who=soft] .sofwrap{transform:none;opacity:1}
.wb .sofwrap{margin-left:-1rem}
.wb .sof,.wb .t9g{display:block;width:100%;height:auto}
@media(max-width:899px){.wb .side .sofwrap{width:clamp(3rem,12vw,4rem)}}
.wb .msg{background:var(--paper);border:3px solid var(--ink);border-radius:1.2rem 1.2rem 1.2rem .3rem;box-shadow:.3rem .3rem 0 var(--ink);padding-right:5.2rem}
.wb .msg-b{font-family:Onest,sans-serif;font-weight:600}
.wb .t9peek{position:absolute;right:.7rem;bottom:-.4rem;width:4.2rem;pointer-events:none;transform:rotate(6deg)}
.wb .t9peek[data-mood=happy]{animation:hop .7s cubic-bezier(.3,1.5,.5,1) both}
.wb .t9peek[data-mood=sad]{transform:rotate(-14deg) translateY(.6rem);opacity:.85}
.wb .t9gap s{text-decoration-color:var(--tomato);text-decoration-thickness:.1em}
.wb .t9gap.is-ok{background:var(--teal);border-bottom-color:transparent;border-radius:.3em}
.wb .t9gap.is-bad{border-bottom-color:transparent}
.wb .t9gap.is-bad s{color:var(--tomato)}.wb .t9gap.is-bad b{color:#086657}
.wb .duo .cam{width:clamp(4.6rem,20vw,6.2rem)}
.wb .duo .sof{width:clamp(3.4rem,14vw,4.6rem)}
.wb{--good:#086657;--bad:#a3200d}
.wb .duelbox{background:var(--paper);border:3px solid var(--ink);border-radius:1.4rem;box-shadow:.5rem .5rem 0 var(--ink);padding:1.4rem 1.2rem}
.wb .duelbox h2{font-family:'Russo One',sans-serif;font-weight:400}
.wb .duelres .score{font-family:'Russo One',sans-serif}
.wb .duelnames input{border-width:3px;border-radius:.8rem;background:#fff}
.wb .turn{padding:.25rem .7rem;background:var(--sky);border:3px solid var(--ink);border-radius:999px;font-weight:800}
@media(max-width:899px){
.wb .side .hostwrap{position:relative}
.wb .side .camwrap{position:absolute;right:0;bottom:.2rem;margin:0}
.wb .side[data-phase=bad] .say,.wb .side[data-who=soft] .say{margin-right:clamp(3.6rem,14vw,4.6rem)}
}
@media(max-width:480px){
.wb .prog{gap:.3rem}
.wb .pip{width:1.85rem;height:1.85rem;font-size:.75rem;border-width:2.5px}
}
.wb .side[data-phase=bad] .sofwrap,.wb .side[data-phase=idle] .sofwrap{transform:translateX(140%);opacity:0}
.wb .coach,.wb .tutcard{background:var(--sky);border:3px solid var(--ink);border-radius:1.2rem;box-shadow:.35rem .35rem 0 var(--ink)}
.wb .ctitle,.wb .tutcard h2{font-family:'Russo One',sans-serif;font-weight:400}
.wb .spot{outline-color:var(--ink);border-radius:999px}
.wb .coach .ghost,.wb .tutcard .ghost{background:var(--paper)}
.wb .res .speech{display:flex;align-items:flex-end;gap:.7rem;width:100%;max-width:32rem}
.wb .res .speech .art{flex:none;width:clamp(4.4rem,19vw,6.4rem)}
.wb .res .speech svg{display:block;width:100%;height:auto;overflow:visible}
.wb .res .speech .say{flex:1;min-width:0;max-width:none;margin:0 0 1.2rem;text-align:left;font-size:1.05rem;line-height:1.45}
.wb .res .speech .say::before{left:-.62rem;top:auto;bottom:1.1rem;margin:0;transform:rotate(45deg)}
.wb .res .speech .say b{font-weight:800}
.wb .speech[data-mood=happy] .host .body{animation:hop .7s cubic-bezier(.3,1.5,.5,1) both}
.wb .speech[data-mood=sad] .host .body{animation:sag .55s ease-out both}
.wb .speech[data-mood=happy] .brow.l{transform:translateY(-3px) rotate(-10deg)}
.wb .speech[data-mood=happy] .brow.r{transform:translateY(-3px) rotate(10deg)}
@media(max-width:360px){.wb .res .speech{flex-direction:column;align-items:center}.wb .res .speech .say{margin:0}.wb .res .speech .say::before{left:50%;top:-.62rem;bottom:auto;margin-left:-.5rem;transform:rotate(135deg)}}
.wb .word .ch.sp{border:0;background:none;box-shadow:none;padding:0;min-width:.3em}
.wb .ctx{font-weight:600}
.wb .life{border-color:var(--ink);background:var(--tomato)}
.wb .infobox h3{font:400 1.15rem/1.2 'Russo One',sans-serif}
.wb .week li{border-width:3px}
.wb .chars,.wb .chars>.hostwrap{min-width:0;max-width:100%}
.wb .chars .say{min-width:0;flex:0 1 auto}
@media(max-width:520px){.wb .chars .hostwrap.duo{flex-wrap:wrap}.wb .chars .hostwrap.duo .say{flex:1 1 0;min-width:8rem}}
.wb .card .tag{position:static;align-self:flex-start;order:-1;margin-bottom:.15rem;max-width:100%;overflow-wrap:anywhere}
.wb .msg.wmsg{padding-right:1rem}
.wb .wbad{overflow-wrap:anywhere;padding:0 .2em;background:#FFD5CB;border-radius:.35em;text-decoration:underline wavy var(--tomato);text-decoration-thickness:.07em;text-underline-offset:.24em;text-decoration-skip-ink:none}
.wb .winput{font-family:'Russo One',sans-serif;background:#FFF1BF;border:3px dashed var(--ink);border-radius:1rem}
.wb .winput.is-ok{background:var(--teal);border-style:solid;color:var(--ink)}
.wb .winput.is-bad{background:#FFD5CB;border-style:solid}
.wb .key{background:var(--paper);border:3px solid var(--ink);border-radius:.55rem;box-shadow:0 .22rem 0 var(--ink);font:400 1.05rem/1 'Russo One',sans-serif;transition:transform .06s,box-shadow .06s,background .1s}
.wb .key:active{transform:translateY(.18rem);box-shadow:0 .04rem 0 var(--ink);background:var(--sun)}
.wb .key.kw{background:var(--sky)}
.wb .key.kok{background:var(--tomato);color:var(--paper)}
.wb .key:disabled:active{transform:none;box-shadow:0 .22rem 0 var(--ink)}
.wb .ctx.big{font-family:'Russo One',sans-serif;font-weight:400}
.wb .ctx .gap.ig.hot{background:var(--sun)}
.wb .ctx .gap.ig.is-ok{background:var(--teal);border-bottom-color:transparent;border-radius:.3em}
.wb .ctx .gap.ig.is-bad{border-bottom-color:transparent}
.wb .ctx .gap.ig.is-bad s{color:var(--tomato)}
.wb .ctx .gap.ig.is-bad b{color:var(--good)}
.wb .round[data-type=write] .fb .quip{font-weight:700;font-size:.95rem}
@media(min-width:900px) and (min-height:521px){.wb .round[data-type=write] .fb .quip{display:none}}
@media(max-width:360px){.wb .round[data-type=write] .key{border-width:2px}}
.wb .card b{order:-3;margin-bottom:.15rem}
.wb .card .tag{order:-2;margin-bottom:.35rem}
.wb .card .ico{margin-top:.1rem}
.wb .card.tr{background:var(--paper)}
.wb .card.ch{background:var(--sky)}
.wb .revrow{margin-top:1.1rem}
.wb .card.rev{flex-direction:row;align-items:center;gap:1rem;min-height:0;width:100%;padding:1rem 1.1rem}
.wb .card.rev .ico{flex:none;display:grid;place-items:center;width:3.4rem;height:3.4rem;margin:0;border:3px solid var(--ink);border-radius:50%;background:var(--paper);color:var(--ink);font-size:1.9rem}
.wb .card.rev .rt{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;min-width:0}
.wb .card.rev small{font-size:.95rem}
.wb .card.rev .praise{font-weight:700}
.wb .card.rev.st-due{background:var(--tomato);color:var(--paper)}
.wb .card.rev.st-due .tag{color:var(--ink)}
.wb .card.rev.st-clean,.wb .card.rev.st-rest{background:var(--teal);color:var(--ink)}
.wb .card.rev.st-empty{background:var(--paper);border-style:dashed;box-shadow:none}
.wb .card.rev.st-empty .ico{border-style:dashed}
.wb button.stat{cursor:pointer;transition:transform .1s,box-shadow .1s}
.wb button.stat:active{transform:translate(.15rem,.15rem);box-shadow:0 0 0 var(--ink)}
.wb .dock[data-state=idle] .chk{padding:.45rem .7rem;background:var(--paper);border:3px solid var(--ink);border-radius:1.1rem;box-shadow:.25rem .25rem 0 var(--ink)}
.wb .dock[data-state=idle] .chk .next{box-shadow:.2rem .2rem 0 var(--ink);min-height:2.9rem}
@media(orientation:landscape) and (max-height:520px){
.wb .app[data-view=round]{padding-block:.6rem 1.2rem}
.wb .stage{padding:.75rem 1rem 1rem;border-radius:1.2rem;box-shadow:.35rem .35rem 0 var(--ink)}
.wb .prompt{font-size:1.1rem;margin-bottom:.5rem}
.wb .word{padding:.6rem 0 .3rem}
.wb .tile{height:3.6rem;font-size:1.9rem}
.wb .round[data-type=write] .fb .quip{display:block}
.wb .fb{padding:.8rem 1rem}
.wb .hero{grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr);gap:1.2rem}
.wb .hero .host{width:5.2rem}
.wb .hero .duo .cam{width:4.2rem}
.wb .hero .duo .sof{width:3.1rem}
.wb .hero .say{font-size:.88rem;margin-bottom:1rem;padding:.55rem .75rem}
.wb .hero h1{font-size:2.1rem;margin-bottom:.6rem}
.wb .hero .lede{margin-bottom:.9rem;font-size:.95rem}
.wb .res .big{font-size:4.2rem}
.wb .res{max-width:62rem;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:1.6rem;row-gap:.55rem;align-items:start}
.wb .res>h2{grid-column:1;grid-row:1;font-size:1.35rem}
.wb .res>.big{grid-column:1;grid-row:2;font-size:3.6rem}
.wb .res>.acts{grid-column:1;grid-row:3/6;align-self:start}
.wb .res>.speech{grid-column:2;grid-row:1/3;max-width:none}
.wb .res>.marks{grid-column:2;grid-row:3;gap:.4rem}
.wb .res>.marks li{padding:.2rem .6rem;font-size:.82rem}
.wb .res>.earn{grid-column:2;grid-row:4;font-size:.92rem}
.wb .res .acts .cta{min-height:3rem;padding:.6rem 1.2rem;font-size:1.1rem}
.wb .res .acts .ghost{min-height:2.75rem;padding:.5rem .9rem}
}
@media(max-width:520px){
.wb .modes{grid-template-columns:repeat(auto-fit,minmax(max(8rem,calc(50% - .6rem)),1fr))}
.wb .card b,.wb .card small{overflow-wrap:anywhere}
.wb .modes>.card:last-child:nth-child(odd){grid-column:1/-1;min-height:0}
}
.wb .proofbox{border:3px solid var(--ink);border-radius:1rem;background:#FFFEF6;box-shadow:.3rem .3rem 0 var(--ink);overflow:hidden}
.wb .prhead{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .6rem;padding:.5rem .8rem;background:#FFD5CB;border-bottom:3px solid var(--ink)}
.wb .prlbl{font:400 1rem/1.15 'Russo One',sans-serif}
.wb .prhead .cap{margin:0;padding:.12rem .6rem;background:var(--paper);font-size:.78rem}
.wb .proofbox .text{position:relative;padding:.35em .9rem .5em 1.5rem;line-height:2.1;
background-image:repeating-linear-gradient(to bottom,transparent 0,transparent calc(2.1em - 2px),rgba(42,86,184,.16) calc(2.1em - 2px),rgba(42,86,184,.16) 2.1em);background-position:0 .35em}
.wb .proofbox .text::before{content:'';position:absolute;left:.75rem;top:0;bottom:0;width:2px;background:rgba(212,60,33,.5)}
.wb .proofbox .tok{padding:.04em .15em;margin:0 -.15em;border:0;border-radius:.3em;transform:none;box-shadow:none}
.wb .proofbox .tok[aria-pressed=true]{background:var(--sun);border:0;box-shadow:none;transform:none;text-decoration:underline .12em var(--tomato);text-underline-offset:.2em;text-decoration-skip-ink:none}
.wb .proofbox .tok.hit{background:var(--teal);text-decoration:none}
.wb .proofbox .tok.miss{background:#FFD5CB;border:0;text-decoration:underline wavy .08em var(--tomato);text-underline-offset:.22em}
.wb .proofbox .tok.fp{background:#E6E6E6;color:var(--ink);border:0;text-decoration:none;box-shadow:inset 0 0 0 .12em #555}
.wb .proofbox .tok.hit::after,.wb .proofbox .tok.fp::after{position:absolute;right:-.45em;top:-.6em;display:grid;place-items:center;width:1.55em;height:1.55em;border:.12em solid var(--ink);border-radius:50%;font:800 .66em/1 Onest,sans-serif;pointer-events:none}
.wb .proofbox .tok.hit::after{content:'✓';background:var(--paper);color:var(--ink)}
.wb .proofbox .tok.fp::after{content:'✕';background:var(--ink);color:var(--paper)}
.wb .proofbox .tok:focus-visible{outline:3px solid var(--ink);outline-offset:1px}
.wb .card.shopcard{flex-direction:row;align-items:center;gap:1rem;min-height:0;width:100%;padding:1rem 1.1rem;background:var(--ink);color:var(--paper);box-shadow:.3rem .3rem 0 var(--tomato)}
.wb button.card.shopcard:hover{box-shadow:.45rem .45rem 0 var(--tomato)}
.wb button.card.shopcard:active{box-shadow:0 0 0 var(--tomato)}
.wb .shopcard .ico{flex:none;display:grid;place-items:center;width:3.8rem;height:3.8rem;margin:0;border:3px solid var(--paper);border-radius:50%;background:var(--sun);color:var(--ink)}
.wb .shopcard .ico .ic{width:1.9rem;height:1.9rem;vertical-align:0}
.wb .shopcard .rt{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;min-width:0}
.wb .shopcard .tag{order:0;margin:0}
.wb .shopcard b{order:0;margin:0}
.wb .shopcard small{font-size:.95rem}
.wb .inkpill{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.1rem .35rem;max-width:100%;margin-top:.35rem;padding:.2rem .7rem;background:var(--paper);color:var(--ink);border-radius:.9rem;font-weight:800;font-size:.85rem;overflow-wrap:anywhere}
.wb .inkpill .ic{color:#086657}
.wb .inknum{font-weight:800}
.wb .shop h2 .ic{width:1.1em;height:1.1em;vertical-align:-.12em}
.wb .shop-bal{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .9rem;background:var(--sun);border:3px solid var(--ink);border-radius:999px;box-shadow:.15rem .15rem 0 var(--ink)}
.wb .shop-bal .ic{color:var(--ink)}
.wb .shop .offer{display:flex;align-items:center;gap:.9rem;padding:.9rem 1rem;background:var(--paper);border:3px dashed var(--ink);border-radius:1.1rem}
.wb .shop .offer-ico{flex:none;display:grid;place-items:center;width:3rem;height:3rem;border:3px solid var(--ink);border-radius:50%;background:var(--sky)}
.wb .shop .offer-rt{display:grid;gap:.4rem;justify-items:start;min-width:0}
.wb .shop .offer h3{font:400 1.15rem/1.2 'Russo One',sans-serif;overflow-wrap:anywhere}
.wb .prevbtn{padding:.35rem .6rem;background:var(--paper);border:3px solid var(--ink);border-radius:999px;box-shadow:.15rem .15rem 0 var(--ink)}
.wb .prevbtn:active{transform:translate(.15rem,.15rem);box-shadow:0 0 0 var(--ink)}
.wb .pip:not(:disabled):hover{transform:scale(1.1)}
.wb .pip[data-v="1"]:not([data-s=cur]){transform:scale(1.18);box-shadow:.15rem .15rem 0 var(--ink)}
.g .prog[data-many="1"] .pip[data-v="1"]{height:1.05rem}
.wb .viewnote{padding:.4rem .7rem;background:var(--sky);border:2px solid var(--ink);border-radius:.8rem;margin-bottom:.6rem}
.wb .card .tag{border-radius:.9rem;line-height:1.25}
.wb .runnote{margin-top:-.6rem;margin-bottom:1rem}
.wb .restart{display:inline-flex;align-items:center;font-size:.9rem;font-weight:700}
.wb .cardwrap .restart{align-self:flex-start;min-height:2.4rem;padding:.2rem .3rem}
@media(max-width:520px){
.wb .modes>.cardwrap:last-child:nth-child(odd){grid-column:1/-1}
.wb .modes>.cardwrap:last-child:nth-child(odd)>.card{min-height:0}
}