:root{--ink:#3b2a4a;--ink-soft:#6b5a7b;--cream:#fff6e5;--cream-d:#ffe9c2;--white:#fff;--yellow:#ffd23f;--yellow-l:#fff0b3;--yellow-d:#e0a800;--pink:#ff7ab6;--pink-l:#ffd9ea;--pink-d:#e0508f;--sky:#5cc8ff;--sky-l:#d4f0ff;--sky-d:#2e9fe0;--mint:#5ee0b0;--mint-l:#d2f7e8;--mint-d:#2db585;--grape:#9b6bff;--grape-l:#e8deff;--grape-d:#7444e0;--orange:#ff9f43;--orange-l:#ffe4c9;--stage-dark:#2b2045;--scrim:#3b2a4a8c;--placeholder:#b7a9c4;--blush:#ff8fb1;--mouth:#5a2440;--line:4px;--line-s:3px;--line-l:5px;--radius:28px;--radius-s:22px;--radius-l:36px;--radius-modal:32px;--pill:999px;--drop-s:0 4px 0 var(--ink);--drop:0 6px 0 var(--ink);--drop-l:0 7px 0 var(--ink);--drop-xl:0 10px 0 var(--ink);--drop-pressed:0 2px 0 var(--ink);--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--tap:64px;--font:ui-rounded, "SF Pro Rounded", "Arial Rounded MT Bold", "Hiragino Maru Gothic ProN", "Thonburi", "Sukhumvit Set", "Leelawadee UI", "Noto Sans Thai", system-ui, sans-serif;--ease-pop:cubic-bezier(.3, 1.8, .5, 1);--ease-soft:cubic-bezier(.3, 1.6, .5, 1);--ease-screen:cubic-bezier(.2, 1.4, .4, 1);--ease-rise:cubic-bezier(.2, 1, .3, 1);--ease-meter:cubic-bezier(.2, 1.3, .4, 1);--t-press:80ms;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{text-size-adjust:100%}body{min-height:100dvh;color:var(--ink);font:18px/1.35 var(--font);-webkit-font-smoothing:antialiased;background:var(--cream) radial-gradient(var(--cream-d) 2.5px, transparent 3px) 0 0 / 30px 30px;-webkit-user-select:none;user-select:none;overscroll-behavior:none;-webkit-touch-callout:none;margin:0}:lang(th) body,body:lang(th){line-height:1.5}h1,h2,h3{letter-spacing:.01em;margin:0;font-weight:900;line-height:1.1}h1{font-size:clamp(28px,5vw,44px)}h2{font-size:clamp(22px,3.6vw,32px)}h3{font-size:22px}:lang(th) h1,:lang(th) h2,:lang(th) h3{line-height:1.3}:lang(th) *{text-transform:none;letter-spacing:0}p{margin:0}button{font:inherit;color:inherit;touch-action:manipulation;cursor:pointer}button:disabled{cursor:default}input,textarea{font:inherit;color:inherit;-webkit-user-select:text;user-select:text}svg{flex:none}[hidden]{display:none!important}:focus{outline:none}:focus-visible{outline:4px solid var(--yellow);outline-offset:2px}#app{min-height:100dvh}.preview-park{opacity:0;pointer-events:none;z-index:-1;width:2px;height:2px;position:fixed;bottom:0;left:0;overflow:hidden}.screen{gap:var(--s4);max-width:1120px;min-height:100dvh;padding:calc(12px + var(--safe-t)) calc(16px + var(--safe-r)) calc(24px + var(--safe-b)) calc(16px + var(--safe-l));animation:screen-in .32s var(--ease-screen);flex-direction:column;margin:0 auto;display:flex}.screen>*{min-width:0}.stack{gap:var(--s4);flex-direction:column;min-width:0;display:flex}.row{align-items:center;gap:var(--s3);flex-wrap:wrap;display:flex}.row.center{justify-content:center}.grow{flex:auto;min-width:0}.center-text{text-align:center}.split{gap:var(--s4);grid-template-columns:minmax(0,1fr);align-items:start;display:grid}@media (min-aspect-ratio:1){.split{grid-template-columns:minmax(0,58fr) minmax(0,42fr)}}.side{gap:var(--s4);flex-direction:column;min-width:0;display:flex}.title{font-size:clamp(28px,4.2vw,40px);font-weight:900;line-height:1.1}:lang(th) .title{line-height:1.3}.subtitle{color:var(--ink-soft);font-size:17px;font-weight:800}.hint{font-size:21px;font-weight:800;line-height:1.3}.label{text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);font-size:15px;font-weight:900}:lang(th) .label{letter-spacing:0;text-transform:none}.outline-text{color:var(--white);-webkit-text-stroke:5px var(--ink);paint-order:stroke fill;text-shadow:0 4px 0 var(--ink);font-weight:900}:lang(th) .outline-text{-webkit-text-stroke-width:3px}.big-title{color:var(--white);-webkit-text-stroke:7px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink);animation:label-pop .5s var(--ease-pop) 50ms both;font-size:clamp(36px,min(8vw,9vh),84px);font-weight:900;line-height:1.05}:lang(th) .big-title{-webkit-text-stroke-width:5px;line-height:1.25}svg.ic{width:30px;height:30px;overflow:visible}svg.ic .ol,svg.ic .ol *{stroke:var(--ink);stroke-width:7px;stroke-linejoin:round;stroke-linecap:round;fill:none!important}svg.ic.big{width:64px;height:64px}svg.ic.hero{width:96px;height:96px}.btn{--c:var(--yellow);min-height:72px;min-width:var(--tap);background:var(--c);color:var(--ink);border:var(--line) solid var(--ink);border-radius:var(--pill);box-shadow:var(--drop);text-align:center;transition:transform var(--t-press), box-shadow var(--t-press);touch-action:manipulation;justify-content:center;align-items:center;gap:10px;padding:0 28px;font-size:22px;font-weight:900;line-height:1.15;display:inline-flex}.btn:active:not(:disabled){box-shadow:var(--drop-pressed);transform:translateY(4px)}.btn:disabled{opacity:.45;filter:saturate(.3)}.btn.busy:disabled{opacity:1;filter:none;--c:var(--mint-l);box-shadow:var(--drop-s)}.btn.huge{min-height:88px;padding:0 40px;font-size:28px}.btn.wide{width:100%}.btn.mint{--c:var(--mint)}.btn.pink{--c:var(--pink)}.btn.sky{--c:var(--sky)}.btn.orange{--c:var(--orange)}.btn.cream{--c:var(--cream)}.btn.white{--c:var(--white)}.btn.grape{--c:var(--grape);color:var(--white)}.btn svg.ic{width:30px;height:30px}.btn.huge svg.ic{width:38px;height:38px}.icon-btn{width:var(--tap);height:var(--tap);min-width:var(--tap);min-height:var(--tap);background:var(--white);border:var(--line) solid var(--ink);box-shadow:var(--drop-s);transition:transform var(--t-press), box-shadow var(--t-press);touch-action:manipulation;border-radius:50%;flex:none;place-items:center;padding:0;display:grid}.icon-btn:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.icon-btn svg.ic{width:32px;height:32px}.icon-btn.yellow{background:var(--yellow)}.icon-btn.mint{background:var(--mint)}.icon-btn.sky{background:var(--sky-l)}.icon-btn.grape{background:var(--grape-l)}.pulse{animation:1.8s ease-in-out infinite glow}.breathe{animation:1.8s ease-in-out infinite breathe}.topbar{align-items:center;gap:var(--s3);min-height:var(--tap);display:flex}.topbar .title{overflow-wrap:anywhere;flex:auto;min-width:0}.topbar .end{gap:var(--s3);align-items:center;margin-left:auto;display:flex}.panel{--bg:var(--yellow-l);background:var(--bg);border:var(--line) solid var(--ink);border-radius:var(--radius);box-shadow:var(--drop-l);gap:var(--s3);flex-direction:column;padding:18px 20px;display:flex}.panel.white{--bg:var(--white)}.panel.sky{--bg:var(--sky-l)}.panel.mint{--bg:var(--mint-l)}.panel.pink{--bg:var(--pink-l)}.panel.grape{--bg:var(--grape-l)}.panel.cream{--bg:var(--cream)}.panel.orange{--bg:var(--orange-l)}.note{align-items:center;gap:var(--s3);background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--radius-s);padding:12px 16px;font-size:22px;font-weight:900;line-height:1.25;display:flex}.tag{border:var(--line-s) solid var(--ink);border-radius:var(--pill);background:var(--white);align-items:center;gap:6px;padding:2px 12px;font-size:15px;font-weight:900;display:inline-flex}.tag.pink{background:var(--pink);color:var(--white)}.tag.mint{background:var(--mint)}.tiles{gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(132px,1fr));display:grid}.tiles>*{min-width:0}.tile{min-height:148px;min-width:var(--tap);background:var(--cream);border:var(--line-s) solid var(--ink);border-radius:var(--radius-s);box-shadow:var(--drop-s);font:inherit;color:inherit;touch-action:manipulation;transition:transform var(--t-press), box-shadow var(--t-press);flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:10px 8px 12px;display:flex;position:relative}.tile:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.tile.on,.tile[aria-pressed=true]{background:var(--yellow);outline:4px solid var(--pink);outline-offset:2px}.tile-art{border:var(--line-s) solid var(--ink);background:var(--sky-l);border-radius:18px;place-items:center;width:96px;height:96px;font-size:56px;line-height:1;display:grid;overflow:hidden}.tile-name{text-align:center;font-size:18px;font-weight:800;line-height:1.2}.mode-grid{gap:var(--s5);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));display:grid}.mode-tile{--bg:var(--yellow-l);justify-content:center;align-items:center;gap:var(--s3);background:var(--bg);border:var(--line) solid var(--ink);border-radius:var(--radius);min-height:210px;box-shadow:var(--drop-l);transition:transform var(--t-press), box-shadow var(--t-press);touch-action:manipulation;animation:rise-in .45s var(--ease-rise) backwards;animation-delay:calc(var(--i,0) * 80ms);flex-direction:column;padding:20px 16px;display:flex}.mode-tile:active{box-shadow:var(--drop-pressed);transform:translateY(5px)}.mode-tile .art{background:var(--white);border:var(--line) solid var(--ink);width:112px;height:112px;box-shadow:var(--drop-s);border-radius:26px;place-items:center;display:grid}.mode-tile .art svg.ic{width:80px;height:80px}.mode-tile .name{text-align:center;font-size:28px;font-weight:900;line-height:1.15}.mode-tile.yellow{--bg:var(--yellow-l)}.mode-tile.pink{--bg:var(--pink-l)}.mode-tile.sky{--bg:var(--sky-l)}.mode-tile.mint{--bg:var(--mint-l)}.mode-tile.grape{--bg:var(--grape-l)}.mode-tile.orange{--bg:var(--orange-l)}.chip{min-height:var(--tap);min-width:var(--tap);background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--pill);box-shadow:0 3px 0 var(--ink);transition:transform var(--t-press), box-shadow var(--t-press), background-color .15s;touch-action:manipulation;justify-content:center;align-items:center;gap:8px;padding:0 22px;font-size:20px;font-weight:900;line-height:1.15;display:inline-flex}.chip:active{box-shadow:0 1px 0 var(--ink);transform:translateY(2px)}.chip.on,.chip[aria-pressed=true]{background:var(--ink);color:var(--white)}.chip svg.ic{width:28px;height:28px}.toggle{align-items:center;gap:var(--s4);background:var(--white);border:var(--line) solid var(--ink);border-radius:var(--radius-s);width:100%;min-height:72px;box-shadow:var(--drop-s);text-align:left;transition:transform var(--t-press), box-shadow var(--t-press);touch-action:manipulation;padding:10px 14px 10px 20px;font-size:20px;font-weight:900;line-height:1.25;display:flex}.toggle:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.toggle .toggle-text{flex-direction:column;flex:auto;gap:2px;min-width:0;display:flex}.toggle .toggle-hint{color:var(--ink-soft);font-size:16px;font-weight:700}.toggle .switch{border-radius:var(--pill);background:var(--cream-d);border:var(--line-s) solid var(--ink);flex:none;width:76px;height:44px;transition:background-color .15s;position:relative}.toggle .switch:after{content:"";background:var(--white);border:var(--line-s) solid var(--ink);width:32px;height:32px;transition:transform .2s var(--ease-soft);border-radius:50%;position:absolute;top:3px;left:3px}.toggle[aria-pressed=true] .switch{background:var(--mint)}.toggle[aria-pressed=true] .switch:after{transform:translate(32px)}.progress{background:var(--white);border:var(--line) solid var(--ink);border-radius:var(--pill);height:32px;position:relative;overflow:hidden}.progress>i{height:100%;width:calc(var(--p,0) * 100%);background-color:var(--fill,var(--mint));border-radius:var(--pill);background-image:repeating-linear-gradient(-45deg,#ffffff59 0 10px,#0000 10px 20px);transition:width .2s ease-out;display:block}.progress[data-value="0"]>i{border-right:0}.progress:not([data-value="0"])>i{border-right:var(--line) solid var(--ink)}.progress.big{height:40px}.meter-label{justify-content:space-between;gap:8px;margin-bottom:6px;font-weight:900;display:flex}.meter{background:var(--white);border:var(--line) solid var(--ink);border-radius:var(--pill);height:32px;position:relative;overflow:hidden}.meter>i{height:100%;width:calc(var(--p,0) * 100%);background-color:var(--fill,var(--sky));border-right:var(--line) solid var(--ink);border-radius:var(--pill);background-image:repeating-linear-gradient(-45deg,#ffffff59 0 10px,#0000 10px 20px);min-width:22px;transition:width .2s ease-out,background-color .2s;display:block}.meter>em{top:0;bottom:0;left:calc(var(--goal,.7) * 100%);background:var(--ink);opacity:.35;width:4px;margin-left:-2px;position:absolute}.meter.met>i{--fill:var(--mint)}.meter.met{box-shadow:0 0 0 4px var(--mint-l)}.preview-stage{background:radial-gradient(circle at 50% 30%, #fff 0 30%, var(--sky-l) 70%);border:var(--line) solid var(--ink);border-radius:var(--radius);width:100%;box-shadow:var(--drop);position:relative;overflow:hidden}.preview{aspect-ratio:4/3;width:100%;position:relative;transform:scaleX(-1)}.preview>canvas,.preview>video{object-fit:cover;background:0 0;width:100%;height:100%;display:block}.preview-stage.compact .preview{max-height:46vh}.face-lost{z-index:2;background:var(--white);border:var(--line) solid var(--ink);border-radius:var(--pill);max-width:calc(100% - 28px);box-shadow:var(--drop-s);pointer-events:none;animation:pop-in-centered .35s var(--ease-pop);align-items:center;gap:10px;padding:8px 20px 8px 10px;font-size:22px;font-weight:900;line-height:1.2;display:flex;position:absolute;top:14px;left:50%;transform:translate(-50%)}.face-lost svg.ic{width:40px;height:40px}.engine-msg{z-index:3;justify-content:center;align-items:center;gap:var(--s3);text-align:center;background:#fff6e5eb;flex-direction:column;padding:24px;font-size:22px;font-weight:900;line-height:1.3;display:flex;position:absolute;inset:0}.engine-msg svg.ic{width:72px;height:72px}.engine-msg.busy svg.ic{animation:1.4s ease-in-out infinite breathe}[data-color=yellow]{--pc:var(--yellow);--pcl:var(--yellow-l)}[data-color=pink]{--pc:var(--pink);--pcl:var(--pink-l)}[data-color=sky]{--pc:var(--sky);--pcl:var(--sky-l)}[data-color=mint]{--pc:var(--mint);--pcl:var(--mint-l)}[data-color=grape]{--pc:var(--grape);--pcl:var(--grape-l)}[data-color=orange]{--pc:var(--orange);--pcl:var(--orange-l)}.avatar{background:var(--pc,var(--sky-l));border:var(--line-s) solid var(--ink);border-radius:50%;flex:none;place-items:center;width:72px;height:72px;font-size:42px;line-height:1;display:grid}.avatar.big{border-width:var(--line);width:128px;height:128px;box-shadow:var(--drop);font-size:76px}.avatar.small{width:48px;height:48px;font-size:28px}.avatar .emoji{display:block;transform:translateY(1px)}.player-grid{gap:var(--s4);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.player-card{justify-content:center;align-items:center;gap:var(--s3);background:var(--pcl,var(--white));border:var(--line) solid var(--ink);border-radius:var(--radius);min-height:190px;box-shadow:var(--drop-l);text-align:center;transition:transform var(--t-press), box-shadow var(--t-press);touch-action:manipulation;animation:rise-in .4s var(--ease-rise) backwards;animation-delay:calc(var(--i,0) * 60ms);flex-direction:column;padding:18px 14px;font-size:24px;font-weight:900;line-height:1.2;display:flex}.player-card:active{box-shadow:var(--drop-pressed);transform:translateY(5px)}.player-card .name{overflow-wrap:anywhere}.player-card.new{background:var(--white);border-style:solid}.player-card.new svg.ic{width:72px;height:72px}.player-chip{min-height:var(--tap);min-width:var(--tap);background:var(--pcl,var(--white));border:var(--line) solid var(--ink);border-radius:var(--pill);box-shadow:var(--drop-s);transition:transform var(--t-press), box-shadow var(--t-press);touch-action:manipulation;align-items:center;gap:10px;max-width:50%;padding:4px 18px 4px 4px;font-size:20px;font-weight:900;line-height:1.2;display:inline-flex}.player-chip:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.player-chip .avatar{width:52px;height:52px;font-size:30px}.player-chip .name{overflow-wrap:anywhere;min-width:0}.pick-grid{gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(84px,1fr));display:grid}.avatar-option{aspect-ratio:1;background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--radius-s);min-width:84px;min-height:84px;box-shadow:var(--drop-s);transition:transform var(--t-press), box-shadow var(--t-press);place-items:center;padding:0;font-size:50px;line-height:1;display:grid}.avatar-option:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.avatar-option[aria-pressed=true]{background:var(--yellow);outline:5px solid var(--pink);outline-offset:2px}.swatch-row{gap:var(--s3);flex-wrap:wrap;display:flex}.color-option{width:76px;height:76px;min-width:var(--tap);min-height:var(--tap);background:var(--pc);border:var(--line) solid var(--ink);box-shadow:var(--drop-s);transition:transform var(--t-press), box-shadow var(--t-press);border-radius:50%;place-items:center;padding:0;display:grid;position:relative}.color-option:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.color-option[aria-pressed=true]{outline:5px solid var(--pink);outline-offset:3px}.color-option svg.ic{opacity:0;width:40px;height:40px;transition:opacity .15s, transform .25s var(--ease-pop);transform:scale(.6)}.color-option[aria-pressed=true] svg.ic{opacity:1;transform:none}.field{flex-direction:column;gap:6px;display:flex}.field input{background:var(--white);border:var(--line-s) solid var(--ink);border-radius:18px;width:100%;min-height:72px;padding:0 20px;font-size:24px;font-weight:800;box-shadow:inset 0 3px #3b2a4a14}.field input::placeholder{color:var(--placeholder)}.field input:focus{border-color:var(--grape);box-shadow:0 0 0 4px var(--grape-l)}.scrim{z-index:60;background:var(--scrim);place-items:center;padding:16px;animation:.18s ease-out both fade-in;display:grid;position:fixed;inset:0}.modal{gap:var(--s4);background:var(--cream);border:var(--line) solid var(--ink);border-radius:var(--radius-modal);width:min(560px,100%);box-shadow:var(--drop-xl);animation:pop-in .4s var(--ease-soft) both;text-align:center;flex-direction:column;padding:24px;display:flex}.modal .row{justify-content:center}.toast{left:50%;bottom:calc(18px + var(--safe-b));z-index:65;background:var(--ink);max-width:calc(100% - 32px);color:var(--white);border-radius:var(--pill);animation:toast-in .35s var(--ease-soft) both;padding:14px 24px;font-size:20px;font-weight:800;position:fixed;transform:translate(-50%);box-shadow:0 6px #0003}.celebrate{z-index:70;justify-content:center;align-items:center;gap:var(--s3);text-align:center;padding:calc(20px + var(--safe-t)) 16px calc(20px + var(--safe-b));background:var(--bgc,var(--yellow));animation:cel-in .22s var(--ease-pop) both;flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}.celebrate.leaving{animation:.25s ease-in both fade-out}.celebrate>*{z-index:2;position:relative}.celebrate>.rays{z-index:0;pointer-events:none;background:repeating-conic-gradient(from 0deg, #ffffff59 0 10deg, transparent 10deg 20deg);width:260vmax;height:260vmax;margin:-130vmax 0 0 -130vmax;animation:14s linear infinite spin;position:absolute;top:50%;left:50%}.celebrate .snap{aspect-ratio:3/4;border:var(--line-l) solid var(--ink);border-radius:var(--radius);width:min(320px,60vw);box-shadow:0 8px 0 var(--ink);background:var(--white);animation:pop-in .45s var(--ease-pop) .2s both;overflow:hidden}.confetti{pointer-events:none;z-index:80;position:fixed;inset:0;overflow:hidden}.confetti i{border:2px solid var(--ink);width:14px;height:20px;animation:fall var(--d,2.2s) cubic-bezier(.25, .6, .4, 1) var(--delay,0s) forwards;border-radius:4px;position:absolute;top:-20px}.confetti i.round{border-radius:50%;width:16px;height:16px}@keyframes screen-in{0%{opacity:0;transform:translateY(14px)scale(.98)}}@keyframes pop-in{0%{opacity:0;transform:scale(.3)}}@keyframes pop-in-centered{0%{opacity:0;transform:translate(-50%)scale(.3)}}@keyframes rise-in{0%{opacity:0;transform:translateY(18px)}}@keyframes squash{30%{transform:scale(1.12,.88)}60%{transform:scale(.94,1.08)}}@keyframes wiggle{0%,to{transform:rotate(-4deg)}50%{transform:rotate(4deg)scale(1.06)}}@keyframes nudge{30%{transform:rotate(-2deg)scale(1.02)}60%{transform:rotate(2deg)}}@keyframes label-pop{0%{opacity:0;transform:scale(.2)rotate(-12deg)}70%{transform:scale(1.12)rotate(3deg)}}@keyframes stamp{0%{opacity:0;transform:scale(3)rotate(-30deg)}to{transform:rotate(12deg)}}@keyframes cel-in{0%{opacity:0;transform:scale(1.08)}}@keyframes fade-in{0%{opacity:0}}@keyframes fade-out{to{opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,40px)}}@keyframes fall{to{transform:translate3d(var(--dx,0), 110vh, 0) rotate(var(--r,540deg))}}@keyframes glow{0%,to{box-shadow:var(--drop), 0 0 0 0 #5ee0b0bf}60%{box-shadow:var(--drop), 0 0 0 20px #5ee0b000}}@keyframes breathe{50%{transform:scale(1.04)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important}.pulse{box-shadow:var(--drop), 0 0 0 8px #5ee0b080}.celebrate>.rays,.confetti{display:none}}@media (max-width:640px){body{font-size:17px}.screen{padding-left:calc(14px + var(--safe-l));padding-right:calc(14px + var(--safe-r));gap:14px}.panel{padding:14px 16px}.mode-grid{gap:var(--s3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.mode-tile{min-height:170px}.mode-tile .art{width:88px;height:88px}.mode-tile .art svg.ic{width:64px;height:64px}.mode-tile .name{font-size:22px}}.meter-row{flex-direction:column;gap:6px;display:flex}.meter-row .meter-text{font-size:20px;font-weight:900;line-height:1.2}.profiles-screen .player-grid{grid-template-columns:repeat(auto-fit,minmax(220px,250px));place-content:start center}.profiles-screen.start{justify-content:center}.profiles-screen.start .topbar{text-align:center;justify-content:center}.profiles-screen.start .topbar .title{flex:0 auto}.brand{padding-top:var(--s4);justify-content:center;display:flex}.brand .big-title{margin:0;transform:rotate(-3deg)}.profiles-screen .player-card{min-height:220px}.edit-layout{gap:var(--s5);grid-template-columns:minmax(0,1fr);align-items:start;display:grid}@media (min-aspect-ratio:1){.edit-layout{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}}.edit-layout .panel{gap:var(--s4)}.pick-grid.avatars{grid-template-columns:repeat(4,minmax(84px,128px));justify-content:center}.avatar-option{font-size:clamp(48px,5.5vw,64px)}.avatar-option .emoji{display:block}.edit-layout .swatch-row{justify-content:center}.edit-side{align-items:stretch}.buddy-preview{padding:var(--s2) 0;place-items:center;display:grid}.buddy-preview .avatar.big{animation:.45s ease-out squash}@media (max-aspect-ratio:1){.edit-side{grid-template-columns:auto minmax(0,1fr);align-items:end;display:grid}.edit-side>.btn{grid-column:1/-1}.buddy-preview{padding:0}}.calibrate-side{justify-content:center}@media (min-aspect-ratio:1){.calibrate-screen .split{align-items:center}}.calibrate-side .who{gap:var(--s3)}.calibrate-side .who-name{overflow-wrap:anywhere;min-width:0;font-size:26px;font-weight:900}.calibrate-side .hint{min-height:2.6em}.home-top{flex-wrap:wrap}.home-title{text-align:center}.home-screen .mode-grid{flex:auto;align-content:center}.home-screen .mode-tile{min-height:250px}.home-screen .mode-tile .art{border-radius:32px;width:136px;height:136px}.home-screen .mode-tile .art svg.ic{width:100px;height:100px}@media (min-aspect-ratio:1) and (min-width:900px){.home-screen .mode-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}@media (max-aspect-ratio:1){.home-screen .mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-screen .mode-tile{min-height:300px}}.preview-stage .preview.stream-fit{aspect-ratio:var(--preview-ar);width:min(100%, calc(100% * 3 / 4 * var(--preview-ar)));margin-left:auto;margin-right:auto}.preview-stage .preview.stream-fit>video{object-fit:contain;object-position:50% 0%}.recipe-grid{gap:var(--s4);grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;display:grid}@media (min-aspect-ratio:1){.recipe-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.recipe-tile{justify-content:center;align-items:center;gap:var(--s3);min-height:240px;min-width:var(--tap);background:var(--pcl,var(--yellow-l));border:var(--line) solid var(--ink);border-radius:var(--radius);box-shadow:var(--drop-l);font:inherit;color:inherit;touch-action:manipulation;transition:transform var(--t-press), box-shadow var(--t-press);animation:rise-in .45s var(--ease-rise) backwards;animation-delay:calc(var(--i,0) * 60ms);flex-direction:column;padding:18px 12px 16px;display:flex}.recipe-tile:active{box-shadow:var(--drop-pressed);transform:translateY(5px)}.recipe-art{background:var(--white);border:var(--line) solid var(--ink);width:136px;height:136px;box-shadow:var(--drop-s);border-radius:50%;flex:none;place-items:center;display:grid}.recipe-art svg.ic{width:112px;height:112px}.recipe-name{text-align:center;overflow-wrap:anywhere;font-size:30px;font-weight:900;line-height:1.15}:lang(th) .recipe-name{line-height:1.35}@media (max-width:640px){.recipe-grid{gap:var(--s3)}.recipe-tile{min-height:190px}.recipe-art{width:104px;height:104px}.recipe-art svg.ic{width:84px;height:84px}.recipe-name{font-size:24px}}.round-screen{gap:var(--s4)}.round-title-art{flex:none;place-items:center;display:grid}.round-title-art svg.ic{width:56px;height:56px}.round-stage{grid-template-columns:minmax(0,1fr);align-items:start;display:grid}.round-stage>*{grid-area:1/1}.round-stage>.round-card{place-self:end center}.round-overlay{z-index:3;pointer-events:none;place-self:center;position:relative}.round-flash{z-index:4;background:var(--white);pointer-events:none;animation:.6s ease-out both round-flash;position:absolute;inset:0}@keyframes round-flash{0%{opacity:.9}to{opacity:0}}.round-side{gap:var(--s4);transition:opacity .2s ease-out}.round-slot{gap:var(--s4);flex-direction:column;min-width:0;display:flex}.round-slot:empty{display:none}.round-screen.face-away .round-side{opacity:.6}.round-meters{gap:var(--s3);grid-template-columns:minmax(0,1fr);display:grid}.round-meter{background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--radius-s);box-shadow:var(--drop-s);gap:8px;padding:10px 14px 14px;transition:background-color .2s}.round-meter.met{background:var(--mint-l)}.round-meter .meter-head{justify-content:space-between;align-items:center;gap:8px;min-height:36px;display:flex}.round-meter .meter-text{font-variant-numeric:tabular-nums;min-width:0;font-size:21px;font-weight:900;line-height:1.2}.round-meter .meter-check{opacity:0;width:34px;height:34px;transition:opacity .15s, transform .3s var(--ease-pop);flex:none;transform:scale(.4)}.round-meter.met .meter-check{opacity:1;transform:none}.round-meter .meter.big{height:44px}.round-meter>.meter{margin-top:auto}.round-meter.big .meter-text{font-size:26px}.round-hold{background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--radius-s);box-shadow:var(--drop-s);flex-direction:column;gap:8px;padding:10px 14px 14px;display:flex}.round-hold-head{align-items:center;gap:8px;min-height:36px;font-size:21px;font-weight:900;line-height:1.2;display:flex}.round-hold-head svg.ic{width:34px;height:34px}.round-hint{background:var(--sky-l);border:var(--line-s) solid var(--ink);border-radius:var(--pill);visibility:hidden;align-items:center;gap:10px;min-height:60px;padding:8px 18px 8px 10px;font-size:21px;font-weight:900;line-height:1.25;display:flex}.round-hint.on{visibility:visible;animation:pop-in .3s var(--ease-soft) both}.round-hint svg.ic{width:36px;height:36px}.round-panel{gap:var(--s3);background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--radius-s);box-shadow:var(--drop-s);flex-direction:column;padding:14px 16px;display:flex}@media (max-aspect-ratio:1) and (min-width:641px){.round-meters{grid-template-columns:none;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column}}.round-card{--cel:var(--yellow);z-index:5;gap:var(--s3);background:var(--sky-l);border:var(--line) solid var(--ink);border-radius:var(--radius);width:calc(100% - 24px);max-width:600px;box-shadow:var(--drop-l);animation:rise-in .35s var(--ease-rise) both;flex-direction:column;margin:12px;padding:16px 18px 18px;display:flex;position:relative}.round-card.is-success{background:var(--cel)}.round-card>*{z-index:1;min-width:0;position:relative}.round-card>.round-card-bg{z-index:0;pointer-events:none;border-radius:calc(var(--radius) - var(--line));position:absolute;inset:0;overflow:hidden}.round-card-bg .rays{background:repeating-conic-gradient(from 0deg, #ffffff59 0 10deg, transparent 10deg 20deg);width:1400px;height:1400px;margin:-700px 0 0 -700px;animation:14s linear infinite spin;display:none;position:absolute;top:50%;left:50%}.round-card.is-success .round-card-bg .rays{display:block}.rc-success{align-items:center;gap:var(--s3);display:flex}svg.rc-star{width:60px;height:60px;animation:label-pop .5s var(--ease-pop) both}.rc-shout{animation:label-pop .5s var(--ease-pop) 50ms both;font-size:clamp(30px,3.6vw,44px);line-height:1.1}:lang(th) .rc-shout{line-height:1.35}.rc-saved{align-items:center;gap:var(--s3);visibility:hidden;display:flex}.rc-saved.on{visibility:visible}.rc-photo{aspect-ratio:4/3;background:var(--white);border:var(--line-s) solid var(--ink);width:96px;box-shadow:var(--drop-s);border-radius:12px;flex:none;margin:0;padding:4px;transform:rotate(-4deg)}.rc-photo img{object-fit:cover;background:var(--sky-l);border-radius:7px;width:100%;height:100%;display:block}.rc-saved.on .rc-photo{animation:rc-photo-in .5s var(--ease-pop) both}@keyframes rc-photo-in{0%{opacity:0;transform:scale(.3)rotate(-20deg)}to{transform:rotate(-4deg)}}.rc-saved-tag{background:var(--white);padding:6px 16px 6px 8px;font-size:20px}.rc-saved-tag svg.ic{width:28px;height:28px}.rc-saved.on .rc-saved-tag{animation:pop-in .4s var(--ease-pop) .1s both}.rc-end{align-items:center;gap:var(--s3);display:flex}svg.rc-flag{width:48px;height:48px}.rc-end-title{font-size:30px;font-weight:900;line-height:1.15}:lang(th) .rc-end-title{line-height:1.35}.rc-note{font-size:24px}.rc-note svg.ic{width:38px;height:38px}.rc-note-slot:empty{display:none}.rc-prompt{align-items:center;gap:var(--s3);background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--pill);animation:pop-in .4s var(--ease-soft) .15s both;padding:10px 18px 10px 12px;font-size:22px;font-weight:900;line-height:1.25;display:flex}.rc-prompt svg.ic{width:42px;height:42px}.rc-buttons{align-items:center;gap:var(--s3);flex-wrap:wrap;margin-top:4px;display:flex}.rc-buttons .rc-again{flex:220px}.round-card.is-success[data-cel=mint] .rc-again{--c:var(--yellow)}.rc-buttons .rc-done{flex:0 auto}@media (prefers-reduced-motion:reduce){.round-card-bg .rays,.round-flash{display:none!important}}@media (max-width:640px){.round-title-art svg.ic{width:44px;height:44px}.rc-shout{font-size:28px}.rc-end-title{font-size:26px}.rc-note{font-size:21px}}.looks-screen{gap:var(--s4)}.look-grid{gap:var(--s4);grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;display:grid}@media (min-aspect-ratio:1){.look-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-aspect-ratio:1) and (min-width:1100px){.look-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.look-card{min-width:0;animation:rise-in .45s var(--ease-rise) backwards;animation-delay:calc(var(--i,0) * 60ms);position:relative}.look-card>.icon-btn{z-index:1;position:absolute;top:10px;right:10px}.look-card>.icon-btn svg.ic{width:32px;height:32px}.look-tile{justify-content:center;align-items:center;gap:var(--s3);width:100%;height:100%;min-height:236px;min-width:var(--tap);background:var(--pcl,var(--yellow-l));border:var(--line) solid var(--ink);border-radius:var(--radius);box-shadow:var(--drop-l);font:inherit;color:inherit;touch-action:manipulation;transition:transform var(--t-press), box-shadow var(--t-press);flex-direction:column;padding:18px 12px 16px;display:flex}.look-tile:active{box-shadow:var(--drop-pressed);transform:translateY(5px)}.look-new-tile{background:var(--mint-l);animation:rise-in .45s var(--ease-rise) backwards}.look-art{background:var(--white);border:var(--line) solid var(--ink);width:136px;height:136px;box-shadow:var(--drop-s);border-radius:50%;flex:none;place-items:center;display:grid}.look-art svg.ic{width:112px;height:112px}.look-art svg.look-plus{width:84px;height:84px}.look-name{text-align:center;overflow-wrap:anywhere;font-size:28px;font-weight:900;line-height:1.15}:lang(th) .look-name{line-height:1.35}.looks-empty{background:var(--pink-l)}.looks-empty svg.ic{width:56px;height:56px}.looks-empty-text{flex-direction:column;gap:2px;min-width:0;display:flex}.looks-empty-title{font-size:24px}.looks-empty-hint{color:var(--ink-soft);font-size:19px;font-weight:800}.look-dialog-art{background:var(--pcl,var(--white));margin:0 auto}.look-capture-split{align-items:start}.look-capture-stage-wrap{min-width:0;position:relative}.look-saved-slot{z-index:4;pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.look-saved-slot:empty{display:none}.look-saved-art{background:var(--pcl,var(--white));width:168px;height:168px;box-shadow:var(--drop);animation:pop-in .45s var(--ease-pop) both}.look-saved-art svg.ic{width:136px;height:136px}.look-capture-side{gap:var(--s4)}.look-names{gap:var(--s3)}.look-name-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.look-name-chip{min-height:var(--tap);text-align:left;justify-content:flex-start;gap:10px;min-width:0;padding:6px 14px 6px 8px;font-size:19px}.look-name-chip svg.look-chip-face{width:42px;height:42px}.look-chip-text{overflow-wrap:anywhere;min-width:0}:lang(th) .look-chip-text{line-height:1.3}.look-name-field input{min-height:72px}.look-name-field input:disabled{opacity:.6}.look-capture-screen.is-capturing .look-names{opacity:.7}.look-capture-hint{margin:0}@media (max-aspect-ratio:1){.look-capture-stage .preview{max-height:38vh}.look-name-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.look-target{align-items:center;gap:var(--s3);background:var(--pcl,var(--white));flex-direction:row}.look-target-art{width:88px;height:88px}.look-target-art svg.ic{width:72px;height:72px}.look-target-text{flex-direction:column;gap:2px;min-width:0;display:flex}.look-target-hint{color:var(--ink-soft);font-size:17px;font-weight:800}.look-target-name{overflow-wrap:anywhere;font-size:26px;font-weight:900;line-height:1.15}:lang(th) .look-target-name{line-height:1.35}@media (max-width:640px){.look-tile{min-height:190px}.look-art{width:104px;height:104px}.look-art svg.ic{width:84px;height:84px}.look-name{font-size:22px}.look-name-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.hi-title-art{flex:none;place-items:center;display:grid}.hi-title-art svg.ic{width:52px;height:52px}.hi-head{align-items:center;gap:10px;font-size:24px;line-height:1.2;display:flex}:lang(th) .hi-head{line-height:1.4}.hi-head svg.ic{width:38px;height:38px}.tint-yellow{--tint:var(--yellow-l)}.tint-pink{--tint:var(--pink-l)}.tint-sky{--tint:var(--sky-l)}.tint-mint{--tint:var(--mint-l)}.tint-grape{--tint:var(--grape-l)}.tint-orange{--tint:var(--orange-l)}.tint-white,.tint-cream{--tint:var(--cream)}.hi-setup{gap:var(--s4);grid-template-columns:minmax(0,1fr);align-items:start;display:grid}@media (min-aspect-ratio:1){.hi-setup{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}.hi-setup-col{gap:var(--s4)}.hi-looks{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.hi-look{background:var(--white)}.hi-look .tile-art{background:var(--tint,var(--sky-l))}.hi-look .tile-art svg.ic{width:76px;height:76px}.hi-look .tile-name{overflow-wrap:anywhere;font-size:19px;font-weight:900}.hi-best{background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--pill);color:var(--ink-soft);align-self:flex-start;align-items:center;gap:10px;padding:8px 20px 8px 10px;font-size:21px;font-weight:900;line-height:1.25;display:flex}.hi-best.has-best{color:var(--ink);background:var(--yellow)}.hi-best svg.ic{width:34px;height:34px}.hi-bpm-row{align-items:center;gap:var(--s3);display:flex}.icon-btn.hi-step{width:88px;min-width:88px;height:88px;min-height:88px;box-shadow:var(--drop)}.icon-btn.hi-step:active{box-shadow:var(--drop-pressed);transform:translateY(4px)}.icon-btn.hi-step svg.ic{width:56px;height:56px}.hi-bpm{background:var(--white);border:var(--line) solid var(--ink);border-radius:var(--pill);white-space:nowrap;font-variant-numeric:tabular-nums;flex:auto;justify-content:center;align-items:center;gap:14px;min-width:0;min-height:88px;padding:0 16px;font-size:34px;font-weight:900;line-height:1.1;display:flex}.hi-bpm-dot{background:var(--orange);border:var(--line-s) solid var(--ink);width:24px;height:24px;animation:hi-tick var(--beat,.6s) ease-out infinite;border-radius:50%;flex:none}@keyframes hi-tick{0%{background-color:var(--yellow);transform:scale(1.4)}35%{background-color:var(--orange);transform:scale(1)}}.hi-counts{gap:var(--s3);flex-wrap:wrap;display:flex}.chip.hi-count-chip{flex:1 1 0;min-height:72px;padding:0 16px;font-size:22px}.toggle.hi-click svg.ic{width:42px;height:42px}@media (max-aspect-ratio:1){.hi-setup{flex-direction:column;align-items:stretch;display:flex}.hi-setup>.hi-setup-col{display:contents}.btn.hi-start{bottom:calc(12px + var(--safe-b));z-index:6;flex:none;position:sticky}.holdit-round-screen .preview{max-height:40vh}}.hi-status{align-items:center;gap:10px;min-height:44px;font-size:24px;font-weight:900;line-height:1.25;display:flex}.hi-status svg.ic{width:38px;height:38px}.hi-count{background:var(--orange-l);border:var(--line) solid var(--ink);border-radius:var(--radius);min-height:min(290px,36vh);box-shadow:var(--drop-l);place-items:center;padding:4px 12px;transition:background-color .15s ease-out;display:grid;position:relative;overflow:visible}.hi-count.is-counting{background:var(--white)}.hi-count.is-counting.on{background:var(--mint-l)}.hi-num{grid-area:1/1;place-items:center;display:grid}.hi-digits{transform-origin:50% 55%;letter-spacing:0;font-variant-numeric:tabular-nums;color:var(--white);-webkit-text-stroke:9px var(--ink);paint-order:stroke fill;text-shadow:0 9px 0 var(--ink);font-size:min(220px,30vw,27vh);font-weight:900;line-height:1;display:block}.hi-countin .hi-digits{color:var(--orange)}.hi-count.on .hi-beat .hi-digits{color:var(--mint)}.hi-streak{background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--radius-s);box-shadow:var(--drop-s);flex-direction:column;gap:10px;padding:10px 14px 14px;display:flex}.hi-streak-head{align-items:center;gap:8px;min-height:36px;font-size:21px;font-weight:900;line-height:1.2;display:flex}.hi-streak-head svg.ic{width:32px;height:32px}.hi-streak-text{font-variant-numeric:tabular-nums;margin-left:auto}.hi-pips{grid-template-columns:repeat(var(--n,4), minmax(0, 1fr));gap:6px;display:grid}.hi-pip{background:var(--cream);border:var(--line-s) dashed #3b2a4a73;border-radius:10px;height:30px;transition:background-color .15s,border-color .15s;display:block}.hi-pip.on{background:var(--mint);border:var(--line-s) solid var(--ink);animation:pop-in .3s var(--ease-pop) both}.hi-best-line{background:var(--yellow);align-self:flex-start;padding:6px 16px 6px 8px;font-size:20px}.hi-best-line svg.ic{width:30px;height:30px}.hi-info{gap:var(--s2);flex-wrap:wrap;display:flex}.hi-chip{padding:4px 14px 4px 6px;font-size:18px}.hi-chip svg.ic{width:30px;height:30px}@media (prefers-reduced-motion:reduce){.hi-bpm-dot{animation:none}}@media (max-width:640px){.icon-btn.hi-step{width:72px;min-width:72px;height:72px;min-height:72px}.hi-bpm{min-height:72px;font-size:28px}.hi-count{min-height:200px}}.gallery-owner{align-items:center;gap:var(--s2);background:var(--pcl,var(--white));border:var(--line-s) solid var(--ink);border-radius:var(--pill);max-width:40vw;min-height:56px;padding:4px 16px 4px 4px;font-size:18px;font-weight:900;display:inline-flex}.gallery-owner .avatar{width:46px;height:46px;font-size:26px}.gallery-owner .name{text-overflow:ellipsis;min-width:0;overflow:hidden}.gallery-body{gap:var(--s4);flex-direction:column;min-width:0;display:flex}.gallery-grid{gap:var(--s5) var(--s4);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));align-items:start;display:grid}.gallery-grid>*{min-width:0}@media (max-width:640px){.gallery-grid{gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}.gallery-item{--bg:var(--yellow-l);gap:var(--s2);background:var(--bg);border:var(--line) solid var(--ink);box-shadow:var(--drop);animation:rise-in .4s var(--ease-rise) backwards;animation-delay:calc(var(--i,0) * 60ms);border-radius:26px;flex-direction:column;padding:10px;display:flex}.gallery-item.looks{--bg:var(--pink-l)}.gallery-item.holdit{--bg:var(--orange-l)}.gallery-photo{aspect-ratio:4/3;background:radial-gradient(circle at 50% 30%, #fff 0 30%, var(--sky-l) 70%);border:var(--line-s) solid var(--ink);touch-action:manipulation;width:100%;transition:transform var(--t-press);border-radius:18px;padding:0;display:block;overflow:hidden}.gallery-photo:active{transform:scale(.98)}.gallery-photo img{object-fit:cover;-webkit-user-drag:none;width:100%;height:100%;display:block}.gallery-meta{align-items:center;gap:var(--s2);min-width:0;display:flex}.gallery-mode{background:var(--white);border:var(--line-s) solid var(--ink);border-radius:14px;flex:none;place-items:center;width:44px;height:44px;display:grid}.gallery-mode svg.ic{width:32px;height:32px}.gallery-text{flex-direction:column;flex:auto;min-width:0;display:flex}.gallery-text .name{overflow-wrap:anywhere;font-size:20px;font-weight:900;line-height:1.2}.gallery-text .date{color:var(--ink-soft);font-size:15px;font-weight:700}:lang(th) .gallery-text .name{line-height:1.4}.gallery-meta .icon-btn{flex:none}.gallery-note{justify-content:center;align-items:center;gap:var(--s2);color:var(--ink-soft);text-align:center;margin:auto 0 0;font-size:17px;font-weight:800;display:flex}.gallery-note svg.ic{width:28px;height:28px}.gallery-empty{text-align:center;align-items:center;gap:var(--s4);width:min(620px,100%);animation:rise-in .4s var(--ease-rise) both;align-self:center;padding:32px 24px}.gallery-empty svg.ic.hero{animation:2.2s ease-in-out infinite breathe}.gallery-empty-title{font-size:clamp(28px,4vw,38px)}.gallery-confirm-pic{aspect-ratio:4/3;object-fit:cover;border:var(--line-s) solid var(--ink);width:min(240px,60vw);box-shadow:var(--drop-s);background:var(--white);border-radius:18px;align-self:center;display:block}.gallery-viewer{z-index:62;gap:var(--s4);cursor:pointer;align-content:center}.viewer-card{gap:var(--s2);background:var(--cream);border:var(--line) solid var(--ink);border-radius:var(--radius-modal);width:min(900px,100%);box-shadow:var(--drop-xl);animation:pop-in .4s var(--ease-soft) both;flex-direction:column;margin:0;padding:12px;display:flex}.viewer-pic{object-fit:contain;border:var(--line-s) solid var(--ink);background:var(--white);border-radius:20px;width:100%;max-height:calc(100dvh - 240px);display:block}.viewer-card figcaption{justify-content:space-between;align-items:baseline;gap:var(--s2);flex-wrap:wrap;padding:0 6px;display:flex}.viewer-card .name{font-size:24px;font-weight:900}.viewer-card .date{color:var(--ink-soft);font-size:17px;font-weight:700}.viewer-close{justify-self:center}.gallery-toast{align-items:center;gap:var(--s2);pointer-events:none;display:flex}.gallery-toast svg.ic{width:28px;height:28px}.gallery-toast svg.ic .ol,.gallery-toast svg.ic .ol *{stroke:var(--white)}@media (prefers-reduced-motion:reduce){.gallery-empty svg.ic.hero{animation:none}}.settings-grid{gap:var(--s5);grid-template-columns:minmax(0,1fr);align-items:start;display:grid}@media (min-aspect-ratio:1){.settings-grid{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}}.settings-grid .panel{gap:var(--s4);animation:rise-in .4s var(--ease-rise) backwards}.settings-grid>.panel{animation-delay:80ms}.stack.settings-col{gap:var(--s5)}.settings-col>.panel+.panel{animation-delay:40ms}.settings-head{align-items:center;gap:var(--s3);margin:0;font-size:24px;font-weight:900;line-height:1.2;display:flex}.settings-head svg.ic{width:40px;height:40px}:lang(th) .settings-head{line-height:1.4}.lang-row{gap:var(--s3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.lang-row .chip{min-height:88px;box-shadow:var(--drop-s);padding:0 16px;font-size:26px}.lang-row .chip[aria-pressed=true]{outline:4px solid var(--pink);outline-offset:3px}.lang-row .chip span{line-height:1.4}.rest-row{align-items:center;gap:var(--s3);display:flex}.rest-row .avatar{box-shadow:var(--drop-s)}.btn.rest-again{flex:auto;min-width:0;min-height:80px;padding:0 18px;font-size:21px}.btn.rest-again svg.ic{width:38px;height:38px}.btn.rest-again .btn-text{overflow-wrap:anywhere;min-width:0}.settings-note{color:var(--ink-soft);margin:0;font-size:16px;font-weight:700;line-height:1.35}.settings-engine{border-radius:var(--radius-s);background:var(--grape-l);color:var(--ink);margin:-4px 0 0;padding:8px 14px;font-size:17px;font-weight:800;line-height:1.35}.settings-privacy{justify-content:center;align-items:center;gap:var(--s2);color:var(--ink-soft);text-align:center;margin:0;font-size:17px;font-weight:800;display:flex}.settings-privacy svg.ic{width:28px;height:28px}.tuning-layout{gap:var(--s4);grid-template-columns:minmax(0,1fr);align-items:start;display:grid}@media (min-aspect-ratio:1){.tuning-layout{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}.tuning-layout .bs-panel{max-height:calc(100dvh - 120px - var(--safe-t) - var(--safe-b))}.tuning-layout .bs-list{overscroll-behavior:contain;overflow-y:auto}}.tuning-layout .side{gap:var(--s3)}.tuning-layout .preview-stage{align-self:center;width:min(100%,48vh)}.tuning-layout .preview-stage.compact .preview{max-height:none}.tuning-engine{color:var(--ink-soft);margin:0;font-size:15px;font-weight:800}.stat-row{gap:var(--s2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.stat{background:var(--white);border:var(--line-s) solid var(--ink);border-radius:var(--radius-s);min-width:0;box-shadow:var(--drop-s);flex-direction:column;gap:2px;padding:10px 12px;display:flex}.stat .stat-name{color:var(--ink-soft);overflow-wrap:anywhere;font-size:14px;font-weight:900;line-height:1.25}.stat .stat-value{font-variant-numeric:tabular-nums;font-size:30px;font-weight:900;line-height:1.1}.stat .stat-hint{color:var(--ink-soft);overflow-wrap:anywhere;font-size:13px;font-weight:700;line-height:1.25}.stat.sky{background:var(--sky-l)}.stat.mint{background:var(--mint-l)}.stat.yellow{background:var(--yellow-l)}.trace-panel{gap:var(--s3)}.trace-panel .field input{min-height:72px}.trace-buttons{gap:var(--s3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.trace-buttons .btn{gap:8px;padding:0 12px;font-size:19px}.trace-buttons .btn svg.ic{width:26px;height:26px}.trace-status{margin:0;font-size:17px;font-weight:800;line-height:1.35}.trace-hint{color:var(--ink-soft);margin:0;font-size:15px;font-weight:700}.trace-panel .progress{height:26px}.bs-panel{gap:var(--s3);min-height:0;padding:14px 14px 14px 16px}.bs-panel .settings-head{font-size:20px}.bs-panel .settings-head svg.ic{width:32px;height:32px}.bs-list{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(var(--bs-rows,26), auto);column-gap:var(--s5);grid-auto-flow:column;row-gap:3px;min-height:0;margin:0;padding:0 4px 0 0;display:grid}.bs-panel.stale .bs-list{opacity:.55}.bs-row{align-items:center;gap:var(--s2);grid-template-columns:minmax(0,1fr) 64px 42px;min-height:24px;font-size:14px;line-height:1.2;display:grid}.bs-name{text-overflow:ellipsis;white-space:nowrap;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:13px;font-weight:800;overflow:hidden}.bs-bar{background:var(--white);border:2px solid var(--ink);border-radius:var(--pill);height:14px;position:relative;overflow:hidden}.bs-bar>i{width:calc(var(--p,0) * 100%);background:var(--sky);border-radius:var(--pill);position:absolute;inset:0 auto 0 0}.bs-row.hi .bs-bar>i{background:var(--mint)}.bs-value{text-align:right;font-variant-numeric:tabular-nums;font-weight:900}@media (max-width:640px){.stat-row,.trace-buttons{grid-template-columns:minmax(0,1fr)}.bs-list{grid-template-rows:none;grid-template-columns:minmax(0,1fr);grid-auto-flow:row}}