.tet{--tet-gap: clamp(var(--sp-2),1.6cqi,var(--sp-4));--tet-field-h: min( calc(2 * (100cqi - 2 * var(--tet-gap))), max(calc(var(--fold, 100vh - 16rem) - var(--tet-chrome)), 23.5rem), 40rem );--tet-sides: calc(2 * 7.5rem + 4 * var(--tet-gap));--tet-chrome: 11.75rem;display:flex;flex-direction:column;gap:var(--tet-gap);width:100%;min-width:0;padding:var(--tet-gap);color:#eaf1f7;font-family:inherit}.tet__bar{width:100%;max-width:42rem;margin-inline:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-2) var(--sp-4)}.tet__stats{display:flex;gap:var(--sp-5)}.tet__ctl{display:flex;justify-content:center;padding-block:0 var(--sp-2)}.tet__ctl:empty{display:none}.tet__stat{display:flex;flex-direction:column;line-height:1.15}.tet__stat span{font-size:var(--fs-1);letter-spacing:.08em;text-transform:uppercase;opacity:.65}.tet__stat b{font-size:var(--fs-4);font-weight:800;font-variant-numeric:tabular-nums}.tet__actions{display:flex;gap:var(--sp-2)}.tet__btn{appearance:none;border:1px solid var(--wash-4);background:var(--wash-2);color:inherit;font:inherit;font-size:var(--fs-2);font-weight:600;padding:var(--sp-2) var(--sp-3h);border-radius:var(--r-sm);cursor:pointer;min-height:44px;transition:background-color .12s,transform .12s cubic-bezier(.2,.8,.3,1)}.tet__btn:active:not(:disabled){transform:translateY(1px)}.tet__btn:hover:not(:disabled){background:var(--wash-4)}.tet__btn:disabled{opacity:.4;cursor:default}.tet__btn--icon{min-width:44px;padding:0}.tet__btn[aria-pressed=true]{background:var(--action, var(--action));border-color:var(--action, var(--action));color:var(--bar)}.tet__btn--pad{touch-action:none;user-select:none;-webkit-user-select:none}.tet__chip{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-1) var(--sp-2);border-radius:var(--r-chip);align-self:center;background:color-mix(in srgb,var(--cat-board) 16%,transparent);color:var(--cat-board);font-weight:800;font-size:var(--fs-1);white-space:nowrap}.tet__float{font-size:clamp(var(--fs-3),4cqi,var(--fs-6));color:#fff;text-shadow:var(--ink-shade-strong)}.tet__float--combo{color:var(--cat-board)}.tet__layout{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--tet-gap);justify-items:center;align-items:start;width:100%;max-width:42rem;margin-inline:auto}@media(min-width:44rem){.tet__layout{grid-template-columns:max-content max-content max-content;justify-content:center}}.tet__side{display:none;width:100%}@media(min-width:44rem){.tet__side{display:block}}.tet__side h3,.tet__side .tet__h{margin:0 0 .4rem;font-size:var(--fs-1);letter-spacing:.08em;text-transform:uppercase;opacity:.65;font-weight:700}.tet__side canvas{width:100%;height:auto;display:block;background:var(--scrim-2);border-radius:var(--r-sm)}.tet__side--hold canvas{aspect-ratio:120 / 90}.tet__side--next canvas{aspect-ratio:120 / 330}.tet__side--next canvas{max-block-size:calc(var(--tet-field-h, 30rem) - 2rem);inline-size:auto}.tet__stage{position:relative;block-size:var(--tet-field-h);inline-size:calc(var(--tet-field-h) / 2);flex:none}.tet__canvas{inline-size:100%;block-size:100%;display:block;background:var(--scrim-2);border-radius:var(--r-sm);touch-action:none;-webkit-user-select:none;user-select:none}.tet__canvas:focus-visible{outline:3px solid var(--action, #C6FF4A);outline-offset:2px}.tet{position:relative;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}@media(prefers-reduced-motion:reduce){.tet__btn{transition:none}}.tet__say{position:absolute;left:50%;top:12%;translate:-50% -6px;z-index:6;margin:0;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-chip);background:#080a14eb;color:#e8eeff;font-size:var(--fs-1);font-weight:700;text-align:center;max-inline-size:90%;opacity:0;pointer-events:none;transition:opacity .16s var(--tet-ease-out, cubic-bezier(.2, .7, .3, 1)),translate .16s var(--tet-ease-out, cubic-bezier(.2, .7, .3, 1))}.tet__say.is-on{opacity:1;translate:-50% 0}@media(prefers-reduced-motion:reduce){.tet__say{transition:none}}.tet__pad{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--sp-1);max-width:26rem;margin-inline:auto;width:100%}.tet__pad .tet__btn{min-height:44px;font-size:var(--fs-3);padding-inline:var(--sp-1)}@media(hover:hover)and (pointer:fine)and (min-width:44rem){.tet__pad{display:none}.tet{--tet-chrome: 8.8125rem}}@container (min-height: 1px){.tet{--tet-field-h: max(12rem, min( calc(100cqh - var(--tet-chrome)), calc((100cqi - var(--tet-sides) - 2 * var(--tet-gap)) * 2) ))}.tet__layout{flex:1 1 auto;min-block-size:0;align-content:center}}