@import"https://fonts.googleapis.com/css2?family=Kanit:wght@400;500;600;700;800&display=swap";:root{font-family:Kanit,system-ui,sans-serif;color:#f5f7fb;background:#080a0e;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 10% 5%,#18221e 0,transparent 28%),#080a0e}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}a{color:inherit;text-decoration:none}.app-shell{width:min(1120px,calc(100% - 40px));margin:0 auto;padding:28px 0 60px}.app-header{min-height:58px;display:flex;justify-content:space-between;align-items:center;padding-bottom:24px;border-bottom:1px solid #20242b}.brand{display:flex;gap:12px;align-items:center}.brand-mark,.settings-title>span{width:42px;height:42px;display:grid;place-items:center;color:#06140d;background:#4df08a;border-radius:11px;box-shadow:0 0 28px #4df08a26}.brand small{display:block;color:#7f8995;font-size:10px;font-weight:700;letter-spacing:.16em}.brand strong{font-size:20px;line-height:1.1}.connection-badge{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid;border-radius:99px;font:500 12px/1 system-ui}.connection-badge.connected{color:#4df08a;border-color:#4df08a4d;background:#4df08a14}.connection-badge.reconnecting{color:#f4bd50;border-color:#f4bd5047;background:#f4bd5014}.connection-badge.offline{color:#f36c72;border-color:#f36c7247;background:#f36c7214}.spin{animation:spin 1s linear infinite}.control-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(290px,.85fr);gap:22px;margin-top:28px}.panel{border:1px solid #252a31;background:linear-gradient(145deg,#16191ef5,#0d0f13f7);border-radius:18px;box-shadow:0 24px 80px #00000038}.score-panel{position:relative;min-height:600px;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:42px;overflow:hidden}.score-panel:before{content:"";position:absolute;width:320px;height:320px;top:120px;border-radius:50%;background:#4df08a09;filter:blur(4px)}.room-line{position:absolute;top:26px;left:30px;display:flex;gap:10px;align-items:center;font-size:12px}.room-line span,.eyebrow{color:#6f7985;font:700 10px/1.2 system-ui;letter-spacing:.16em}.room-line strong{color:#9ea8b3;font-weight:500}.score-label{position:relative;color:#89939f;margin:0 0 -8px;font-size:15px}.score-number{position:relative;color:#fff;font:800 clamp(120px,18vw,220px)/1 "Kanit";letter-spacing:-.06em;text-shadow:0 8px 50px rgba(255,255,255,.05)}.controls-row{position:relative;display:flex;gap:14px;width:min(440px,100%);margin-top:26px}.action-button{height:67px;flex:1;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid;border-radius:12px;font-weight:700;font-size:19px;transition:transform .14s,filter .14s}.action-button:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.12)}.action-button.minus{color:#ff7279;border-color:#ff727957;background:#ff525b17}.action-button.plus{color:#07150d;border-color:#4df08a;background:#4df08a;box-shadow:0 8px 30px #4df08a24}.reset-button{margin-top:22px;display:flex;align-items:center;gap:7px;color:#7f8995;background:transparent;border:0;font-size:13px}.reset-button:hover{color:#fff}.custom-change{position:relative;width:min(300px,100%);margin-top:24px;padding-top:20px;border-top:1px solid #252a31}.custom-change>label{display:block;margin-bottom:8px;color:#7f8995;text-align:center;font-size:12px}.custom-change-row{display:grid;grid-template-columns:48px 1fr 48px;gap:8px}.custom-change-row input{text-align:center;font-weight:700;-moz-appearance:textfield}.custom-change-row input::-webkit-inner-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}.custom-step{display:grid;place-items:center;color:#d7dde4;border:1px solid #303640;border-radius:9px;background:#171b21}.custom-step.subtract:hover:not(:disabled){color:#ff7279;border-color:#ff7279}.custom-step.add:hover:not(:disabled){color:#4df08a;border-color:#4df08a}.side-stack{display:flex;flex-direction:column;gap:14px}.compact-panel,.shortcuts{padding:22px}.eyebrow{margin:0 0 17px}.field-label{color:#aeb6c0;display:block;margin:16px 0 7px;font-size:13px}input,select{width:100%;color:#f6f7f9;background:#0c0f13;border:1px solid #2b3038;border-radius:9px;outline:0;padding:11px 12px;transition:border-color .15s,box-shadow .15s}input:focus,select:focus{border-color:#4df08a;box-shadow:0 0 0 3px #4df08a1a}.field-help{display:flex;gap:7px;align-items:flex-start;color:#737e89;margin:12px 0 0;font:12px/1.4 system-ui}.primary-wide{width:100%;min-height:44px;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;color:#06140d;border:0;border-radius:9px;background:#4df08a;font-weight:700}.shortcuts>div{display:grid;grid-template-columns:76px 1fr auto;gap:10px;align-items:center;color:#abb3bd;padding:11px 0;border-top:1px solid #24282f;font-size:13px}.shortcuts>div:first-of-type{border-top:0}kbd{color:#e6e9ed;background:#292e35;border:1px solid #3a4049;border-bottom-width:3px;padding:6px 7px;border-radius:6px;font:700 11px system-ui;text-align:center}.shortcuts svg{color:#4df08a}.shortcuts>div:last-child svg{color:#ff7279}.secondary-link{min-height:48px;display:flex;align-items:center;justify-content:center;gap:9px;color:#aeb7c1;border:1px solid #2a2f36;border-radius:11px;background:#12151a;font-size:13px;transition:border-color .15s,color .15s}.secondary-link:hover{border-color:#4df08a;color:#fff}.toast{position:fixed;z-index:20;left:50%;bottom:28px;transform:translate(-50%);width:min(480px,calc(100% - 32px));padding:13px 18px;color:#fff;border-radius:10px;box-shadow:0 12px 40px #0006;text-align:center;font-size:13px}.toast.error{background:#8d2830}.toast.success{color:#06140d;background:#4df08a}html.overlay-mode,body.overlay-mode,body.overlay-mode #root{background:transparent!important;overflow:hidden}.overlay-canvas{width:100vw;height:100vh;padding:6vh 5vw;display:flex;background:transparent}.win-display{max-width:100%;color:#fff;font-family:Kanit,sans-serif;font-weight:800;line-height:1;letter-spacing:-.035em;white-space:nowrap;-webkit-text-stroke:3px rgba(0,0,0,.8);paint-order:stroke fill;text-shadow:0 5px 4px rgba(0,0,0,.72),0 0 18px rgba(0,0,0,.48);transform-origin:center}.position-top-left{align-items:flex-start;justify-content:flex-start}.position-top-center{align-items:flex-start;justify-content:center}.position-top-right{align-items:flex-start;justify-content:flex-end}.position-center-left{align-items:center;justify-content:flex-start}.position-center{align-items:center;justify-content:center}.position-center-right{align-items:center;justify-content:flex-end}.position-bottom-left{align-items:flex-end;justify-content:flex-start}.position-bottom-center{align-items:flex-end;justify-content:center}.position-bottom-right{align-items:flex-end;justify-content:flex-end}.animate-up{animation:win-pop .65s cubic-bezier(.2,1.5,.45,1)}.animate-down{animation:win-down .65s ease-out}.overlay-message,.guard-card{width:fit-content;margin:32px auto;padding:14px 18px;color:#fff;background:#781820eb;border:1px solid #f2646c;border-radius:10px;font:500 14px/1.4 Kanit}.overlay-message{margin-top:4vh}.settings-shell{max-width:1050px}.back-link{display:flex;align-items:center;gap:8px;color:#9ba5b0;font-size:13px}.back-link:hover{color:#fff}.settings-title{display:flex;align-items:center;gap:15px;margin:28px 0 22px}.settings-title h1{margin:4px 0 0;font-size:27px}.settings-title .eyebrow{margin:0}.settings-grid{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(360px,1.1fr);gap:24px;align-items:start}.settings-form{padding:24px}.settings-form>.field-label:first-child{margin-top:0}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.color-field,.unit-field{display:flex;align-items:center;min-height:46px;background:#0c0f13;border:1px solid #2b3038;border-radius:9px;overflow:hidden}.color-field input{width:48px;height:44px;padding:6px;border:0}.color-field code{color:#aeb7c1;padding:0 8px;font-size:12px}.unit-field input{border:0}.unit-field span{color:#727c87;padding:0 12px}.save-button{margin-top:24px}.form-error{color:#ff747b;font-size:12px;text-align:center}.preview-section{padding:2px 0}.preview-section .eyebrow{display:flex;align-items:center;gap:7px}.preview-phone{position:relative;width:min(100%,400px);aspect-ratio:9/16;margin:0 auto;display:flex;padding:5%;overflow:hidden;background:radial-gradient(circle at 70% 20%,#4b304b,transparent 30%),radial-gradient(circle at 35% 70%,#233e4c,transparent 35%),#161a20;border:8px solid #262b32;border-radius:24px;box-shadow:0 24px 70px #00000059}.preview-phone .win-display{font-size:clamp(22px,5vw,53px)!important;-webkit-text-stroke-width:1.5px;z-index:1}.safe-area{position:absolute;top:5%;right:5%;bottom:5%;left:5%;border:1px dashed rgba(255,255,255,.11);pointer-events:none}.preview-note{color:#69737f;text-align:center;font-size:11px}@keyframes win-pop{0%{transform:scale(1);filter:brightness(1)}38%{transform:scale(1.24);filter:brightness(1.8) drop-shadow(0 0 22px currentColor)}to{transform:scale(1);filter:brightness(1)}}@keyframes win-down{0%{transform:translate(0);color:#ff303b;filter:drop-shadow(0 0 18px #ff303b)}22%{transform:translate(-12px)}44%{transform:translate(10px)}66%{transform:translate(-5px)}to{transform:translate(0)}}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:780px){.app-shell{width:min(100% - 24px,580px);padding-top:16px}.app-header{padding-bottom:16px}.control-grid,.settings-grid{grid-template-columns:1fr}.score-panel{min-height:470px;padding:26px 20px}.score-number{font-size:clamp(110px,40vw,170px)}.preview-section{order:-1}.preview-phone{max-width:280px}}@media(max-width:420px){.brand strong{font-size:17px}.connection-badge{padding:7px}.connection-badge{font-size:0}.score-panel{min-height:420px}.controls-row{gap:9px}.action-button{height:59px}.two-fields{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}