/*! © 2026 youngil kim (당구 길보기). All rights reserved. 무단 복제·수정·재배포·AI 학습 금지. Unauthorized copying, modification, redistribution or use for AI training is prohibited. 제3자 코드(three.js MIT, pooltool 기반 물리 Apache-2.0)는 licenses/ 참고. */
@import"https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&family=Playfair+Display:wght@700;900&display=swap";*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg-deep: #0a0a0c;--bg-card: #141418;--bg-elevated: #1c1c22;--felt-green: #1a4a7a;--felt-dark: #123660;--rail-wood: #5a3322;--rail-light: #7a4a33;--gold: #c9a84c;--gold-dim: #8a7235;--white-ball: #f0ece4;--red-ball: #c41e2a;--yellow-ball: #e8c840;--text: #e8e4dc;--text-dim: #7a7670;--accent: #c9a84c}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg-deep);color:var(--text);font-family:Noto Sans KR,sans-serif;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;overscroll-behavior:none;-webkit-touch-callout:none}@supports (height: 100dvh){html,body{height:100dvh}}:root{--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}button{touch-action:manipulation}body{display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 30%,rgba(201,168,76,.04) 0%,transparent 60%),radial-gradient(ellipse at 50% 80%,rgba(26,80,150,.08) 0%,transparent 50%),var(--bg-deep)}.header{position:fixed;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:calc(5px + var(--safe-top)) calc(10px + var(--safe-right)) 5px calc(10px + var(--safe-left));z-index:100;background:linear-gradient(to bottom,rgba(10,10,12,.97),transparent);gap:12px}.logo{font-family:Playfair Display,serif;font-size:15px;font-weight:900;color:var(--gold);letter-spacing:1px;white-space:nowrap}.logo span{font-family:Noto Sans KR,sans-serif;font-weight:300;font-size:10px;color:var(--text-dim);margin-left:6px;letter-spacing:2px;text-transform:uppercase}.tab-switch{position:fixed;left:calc(3px + var(--safe-left, 0px));top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:4px 0;background:linear-gradient(180deg,#4a3e26f5,#1e1d22f5 16% 84%,#4a3e26f5),linear-gradient(90deg,#c9a84c1f,#0000 70%);border:1px solid rgba(201,168,76,.24);border-radius:9px;box-shadow:inset 0 1px #ffe2a41f,inset -1px 0 #0000008c,0 10px 28px #0000008c;overflow-y:auto;scrollbar-width:none;max-height:92vh;z-index:150}.tab-switch::-webkit-scrollbar{display:none}.tab-btn{position:relative;background:none;border:none;color:var(--text-dim);font-family:Noto Sans KR,sans-serif;font-size:12px;font-weight:600;writing-mode:vertical-rl;letter-spacing:5px;padding:15px 9px;cursor:pointer;white-space:nowrap;border-radius:5px;text-shadow:0 1px 0 rgba(0,0,0,.85),0 -1px 0 rgba(255,222,158,.07);transition:color .18s ease,background .18s ease}.tab-btn:active{background:#c9a84c1a}.tab-btn.active{background:linear-gradient(90deg,#c9a84c33,#c9a84c0f);color:var(--gold);text-shadow:0 1px 0 rgba(0,0,0,.7),0 0 10px rgba(201,168,76,.35)}.tab-btn.active:before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:2px;background:var(--gold);border-radius:0 2px 2px 0;box-shadow:0 0 7px #c9a84cd9}.side-divider{height:1px;margin:4px 6px;background:linear-gradient(90deg,#c9a84c0d,#c9a84c61,#c9a84c0d);flex-shrink:0}.tab-switch .tab-btn[hidden]~.side-divider{display:none}.rail-more{flex-shrink:0;width:40px;height:40px;background:none;border:none;border-radius:6px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:0}.rail-more i{display:block;width:3px;height:3px;border-radius:50%;background:#e2dcd08c;transition:transform .22s cubic-bezier(.2,.8,.3,1),background .18s,opacity .18s}.rail-more.open i{background:var(--gold)}.rail-more.open i:nth-child(1){transform:translateY(6px) rotate(45deg) scaleX(4.2)}.rail-more.open i:nth-child(2){opacity:0}.rail-more.open i:nth-child(3){transform:translateY(-6px) rotate(-45deg) scaleX(4.2)}.rail-more:active i{background:var(--gold)}.q-tray{position:fixed;left:calc(44px + var(--safe-left, 0px));top:50%;z-index:149;padding:10px 10px 12px;border-radius:11px;border:1px solid rgba(201,168,76,.26);background:radial-gradient(120% 80% at 50% 0%,#3c6e9633,#0000 62%),linear-gradient(180deg,#18191dfb,#0f1013fb);box-shadow:inset 0 1px #ffe2a417,0 16px 42px #0000009e;max-height:88vh;overflow-y:auto;scrollbar-width:none;transform:translateY(-50%) translate(-10px);opacity:0;visibility:hidden;transition:opacity .2s ease,transform .24s cubic-bezier(.2,.85,.3,1),visibility .24s}.q-tray::-webkit-scrollbar{display:none}.q-tray.open{opacity:1;visibility:visible;transform:translateY(-50%) translate(0)}.q-sec+.q-sec{margin-top:10px}.q-sec-t{font-family:Noto Sans KR,sans-serif;font-size:9px;font-weight:700;letter-spacing:3px;color:#c9a84cb8;margin:0 0 5px 2px;display:flex;align-items:center;gap:7px}.q-sec-t:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,#c9a84c47,#c9a84c00)}.q-tray.open .q-sec{animation:qIn .26s both cubic-bezier(.2,.85,.3,1)}.q-tray.open .q-sec:nth-child(1){animation-delay:.02s}.q-tray.open .q-sec:nth-child(2){animation-delay:.06s}.q-tray.open .q-sec:nth-child(3){animation-delay:.1s}.q-tray.open .q-sec:nth-child(4){animation-delay:.14s}@keyframes qIn{0%{opacity:0;transform:translate(-6px)}}.q-grid{display:grid;grid-template-columns:repeat(2,60px);gap:5px}.q-btn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:46px;padding:5px 2px;border:1px solid rgba(201,168,76,.13);border-radius:7px;background:#ffffff07;color:#eee8dceb;font-family:Noto Sans KR,sans-serif;font-size:13px;font-weight:700;line-height:1;cursor:pointer;transition:background .16s,border-color .16s,color .16s}.q-btn:before{content:attr(data-label);font-size:9px;font-weight:500;letter-spacing:.2px;line-height:1;color:#e2dcd06b;transition:color .16s}.q-btn:active{background:#c9a84c29}.q-btn.active{background:linear-gradient(180deg,#c9a84c33,#c9a84c14);border-color:#c9a84c7a;color:var(--gold);box-shadow:inset 0 1px #ffe2a429}.q-btn.active:before{color:#c9a84cb8}body.spectate .q-tray,body.replay .q-tray{display:none!important}@media (prefers-reduced-motion: reduce){.q-tray,.q-tray.open .q-sec,.rail-more i{transition:none;animation:none}}.btn-reset{background:none;border:1px solid var(--gold-dim);color:var(--gold);font-family:Noto Sans KR,sans-serif;font-size:11px;font-weight:500;padding:6px 12px;border-radius:4px;cursor:pointer;transition:all .2s;white-space:nowrap}.btn-reset:hover{background:var(--gold);color:var(--bg-deep)}.line-toggle{background:none;border:1px solid rgba(201,168,76,.2);color:var(--text-dim);font-family:Noto Sans KR,sans-serif;font-size:10px;padding:5px 8px;border-radius:4px;cursor:pointer;transition:all .2s;white-space:nowrap;touch-action:manipulation}.line-toggle.active{border-color:var(--gold-dim);color:var(--gold);background:#c9a84c1f}#toggleAuto.active{border-color:#40c878;color:#40c878;background:#40c87824}.follow-slider-row,.side-slider-row,.elev-row{display:flex;align-items:center;gap:4px;font-size:8px;color:var(--text-dim);letter-spacing:.5px;margin-top:4px}#followSlider,#sideSlider,#elevSlider,#powerSlider{-webkit-appearance:none;appearance:none;width:76px;height:4px;border-radius:2px;outline:none;background:#3a3a42}#followSlider{background:linear-gradient(to right,#4090e8,#3a3a42 50%,#e8a020)}#sideSlider{background:linear-gradient(to right,#40c878,#3a3a42 50%,#40c878)}#elevSlider{background:linear-gradient(to right,#3a3a42,#e06040)}#followSlider::-webkit-slider-thumb,#sideSlider::-webkit-slider-thumb,#elevSlider::-webkit-slider-thumb,#powerSlider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#b8b4ac);border:1px solid rgba(0,0,0,.4);box-shadow:0 1px 4px #00000080}#elevVal{min-width:24px;color:var(--gold);font-weight:700}.table-wrap{position:relative;display:flex;align-items:center;justify-content:center;flex:1;min-height:0;width:100%;padding:calc(74px + var(--safe-top)) calc(4px + var(--safe-right)) 4px calc(4px + var(--safe-left))}#table{position:relative;z-index:1}#table3d{z-index:0;box-shadow:none}canvas{display:block;border-radius:6px;will-change:transform;transform-origin:center center;box-shadow:0 0 0 2px #c9a84c26,0 20px 60px #0009,0 0 120px #1a50a01f;touch-action:none}.game-hud{position:absolute;top:calc(66px + var(--safe-top));left:0;right:0;display:none;pointer-events:none;z-index:10;padding:0 10px}body.game-mode .logo{display:none}.game-hud.visible{display:flex;justify-content:space-between;align-items:flex-start}.score-panel{background:linear-gradient(180deg,#2c2c34f2,#0c0c0ff2);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 14px;min-width:80px;text-align:center;backdrop-filter:blur(4px);box-shadow:inset 0 1px #ffffff24,0 4px 12px #00000080}.score-panel .player-name{font-size:10px;color:var(--text-dim);letter-spacing:1px;text-transform:uppercase;margin-bottom:2px}.score-panel .player-name{display:flex;align-items:center;justify-content:center;gap:4px}.cue-dot{width:8px;height:8px;border-radius:50%;border:1px solid rgba(0,0,0,.4);box-shadow:inset 0 1px 1px #ffffff80}.cd-white{background:radial-gradient(circle at 35% 30%,#fff,#cfcbc2)}.cd-yellow{background:radial-gradient(circle at 35% 30%,#ffe37a,#d6a824)}.score-panel .score-num{font-family:Playfair Display,serif;font-size:26px;font-weight:700;color:var(--gold);line-height:1}.score-sub{font-size:8.5px;color:var(--text-dim);margin-top:3px;letter-spacing:.2px;white-space:nowrap}.score-sub span{color:var(--text);font-weight:700}.score-panel.active-player{border-color:#c9a84c99;box-shadow:0 0 16px #c9a84c26}.cushion-display{background:linear-gradient(180deg,#2c2c34f2,#0c0c0ff2);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:6px 14px;text-align:center;backdrop-filter:blur(4px);box-shadow:inset 0 1px #ffffff24,0 4px 12px #00000080}.cushion-display .cushion-label{font-size:9px;color:var(--text-dim);letter-spacing:1px;text-transform:uppercase;margin-bottom:1px}.cushion-count{font-family:Playfair Display,serif;font-size:26px;font-weight:700;color:var(--text-dim);line-height:1;transition:color .2s}.cushion-count.c1{color:#e8a020}.cushion-count.c2{color:#e86020}.cushion-count.c3{color:#40c878}.dock{flex:none;width:100%;display:flex;flex-direction:column-reverse;background:linear-gradient(to top,#0a0a0cf7,#0a0a0cd1);border-top:1px solid rgba(201,168,76,.14);padding-bottom:var(--safe-bottom)}.dock-mini{display:flex;align-items:center;gap:8px;padding:5px calc(8px + var(--safe-right)) 6px calc(8px + var(--safe-left))}.dock-grip{flex:none;width:26px;height:34px;background:none;border:none;cursor:pointer;position:relative}.dock-grip:before{content:"";position:absolute;top:50%;left:50%;width:20px;height:4px;margin:-2px 0 0 -10px;border-radius:2px;background:#c9a84c99;transition:transform .25s}.dock.collapsed .dock-grip:before{transform:rotate(0)}.mini-spin{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid rgba(201,168,76,.3);cursor:crosshair;touch-action:none}.mini-power{flex:1 1 auto;min-width:60px}.mini-pct{flex:none}#sbShoot{flex:none;padding:9px 18px}.shot-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 14px;max-height:60px;overflow:hidden;padding:6px calc(8px + var(--safe-right)) 4px calc(8px + var(--safe-left));opacity:1;transition:max-height .28s ease,opacity .2s ease,padding .28s ease;border-bottom:1px solid rgba(201,168,76,.1)}.dock.collapsed .shot-bar{max-height:0;opacity:0;padding-top:0;padding-bottom:0;border-bottom:none}.sb-fine{padding:6px 11px;font-size:12px;min-height:32px}#sbThick canvas{display:block}.status-pill{position:fixed;top:calc(46px + var(--safe-top));left:50%;transform:translate(-50%);z-index:90;background:#0c0c10e0;border:1px solid rgba(201,168,76,.3);border-radius:999px;padding:4px 13px;font-size:11px;color:var(--text);pointer-events:none;white-space:nowrap}.status-pill:empty{display:none}.spectate-stop{display:none}body.spectate .header,body.spectate .dock,body.spectate .game-hud,body.spectate .status-pill{display:none!important}body.spectate .table-wrap{padding:calc(var(--safe-top) + 3px) 2px calc(var(--safe-bottom) + 2px) 2px!important}body.spectate .spectate-stop{display:block;position:fixed;top:calc(6px + var(--safe-top));right:calc(8px + var(--safe-right));z-index:300;background:#0c0c10b3;border:1px solid rgba(201,168,76,.35);color:var(--gold);font-family:Noto Sans KR,sans-serif;font-size:11px;padding:5px 11px;border-radius:999px;backdrop-filter:blur(4px);opacity:.75;cursor:pointer}.sb-item{display:flex;align-items:center;gap:5px}.sb-col{display:flex;flex-direction:column;gap:3px}.sb-row{display:flex;align-items:center;gap:5px}.sb-l{font-size:9px;color:var(--text-dim);letter-spacing:.5px;white-space:nowrap}.sb-v{font-size:10px;font-weight:700;color:var(--gold);min-width:30px;text-align:right}.sb-spin #spinCanvas{width:56px;height:56px;border-radius:50%;border:1px solid rgba(201,168,76,.3);cursor:crosshair;touch-action:none}#powerSlider{height:8px;background:linear-gradient(to right,#3a1e0e,#6b4020 12%,#b98a4e 34%,#efd7a0 62%,#e0c48c 80%,#2f6098);box-shadow:inset 0 1px 2px #0006}#powerSlider::-webkit-slider-thumb{border-radius:3px!important;background:linear-gradient(180deg,#fff,#c9a84c)!important;border:1px solid rgba(0,0,0,.5)!important}.toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);background:#0a0a0ced;border:1px solid var(--gold);border-radius:12px;padding:16px 32px;font-family:Playfair Display,serif;font-size:24px;color:var(--gold);z-index:200;pointer-events:none;opacity:0;transition:all .3s;text-align:center;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.controls{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:6px;padding:12px calc(16px + var(--safe-right)) calc(20px + var(--safe-bottom)) calc(16px + var(--safe-left));background:linear-gradient(to top,rgba(10,10,12,.97) 60%,transparent);z-index:100}.mode-btn{background:var(--bg-elevated);border:1px solid rgba(201,168,76,.12);color:var(--text-dim);font-family:Noto Sans KR,sans-serif;font-size:12px;font-weight:500;padding:9px 14px;border-radius:6px;cursor:pointer;transition:all .25s;position:relative;overflow:hidden;letter-spacing:.3px}.mode-btn:before{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:0;height:2px;background:var(--gold);transition:width .3s}.mode-btn.active{background:#c9a84c1a;border-color:var(--gold);color:var(--gold)}.mode-btn.active:before{width:60%}.mode-btn:hover:not(.active){border-color:#c9a84c4d;color:var(--text)}.fine-btn{font-size:14px;padding:9px 13px;user-select:none;-webkit-user-select:none}.fine-btn:active{background:#c9a84c40;color:var(--gold)}.info-badge{position:fixed;bottom:calc(78px + var(--safe-bottom));left:50%;transform:translate(-50%);background:var(--bg-elevated);border:1px solid rgba(201,168,76,.15);border-radius:20px;padding:5px 14px;font-size:11px;color:var(--text-dim);letter-spacing:.5px;z-index:100;white-space:nowrap;pointer-events:none;opacity:.8;transition:opacity .3s}.info-badge .dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;vertical-align:middle;position:relative;top:-1px}.info-badge .dot.white{background:var(--white-ball)}.info-badge .dot.red{background:var(--red-ball)}.info-badge .dot.yellow{background:var(--yellow-ball)}.photomap{position:fixed;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#050507f7;z-index:300;padding:calc(10px + var(--safe-top)) 0 calc(10px + var(--safe-bottom))}.photomap-guide{font-size:14px;font-weight:700;letter-spacing:.3px;text-align:center;padding:8px 16px;background:var(--bg-elevated);border:1px solid rgba(201,168,76,.3);border-radius:8px;max-width:90vw}#photoCanvas{touch-action:none;border-radius:4px;box-shadow:0 8px 40px #000000b3}.photomap-buttons{display:flex;gap:10px}#loupeCanvas{position:fixed;display:none;z-index:310;pointer-events:none;border-radius:50%;box-shadow:0 4px 20px #000c}.menu-panel{position:fixed;inset:0;overflow-y:auto;display:none;z-index:250;background:#0a0a0cfa;border:none;border-radius:0;padding:calc(20px + var(--safe-top)) calc(16px + var(--safe-right)) calc(24px + var(--safe-bottom)) calc(16px + var(--safe-left));box-shadow:none;backdrop-filter:blur(6px)}.menu-panel.visible{display:block}.menu-panel>*{max-width:480px;margin-left:auto;margin-right:auto}.menu-sec{padding:8px 0;border-bottom:1px solid rgba(201,168,76,.12)}.menu-sec:last-child{border-bottom:none}.menu-h{font-size:9px;color:var(--text-dim);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:7px}.menu-row{display:flex;flex-wrap:wrap;gap:5px;align-items:center}.menu-hint{font-size:10px;color:var(--text-dim)}.menu-char{display:none;align-items:center;gap:9px;margin-top:9px;padding:8px;background:#ffffff0a;border-radius:9px}.menu-char.visible{display:flex}.menu-char img{width:44px;height:44px;border-radius:8px;image-rendering:pixelated;border:1px solid rgba(255,255,255,.15)}.menu-char .mc-name{font-size:12.5px;font-weight:700;color:var(--text)}.menu-char .mc-desc{font-size:10px;color:var(--text-dim);line-height:1.35}#charAvatar{width:40px;height:40px;border-radius:50%;border:2px solid var(--gold-dim);display:block;margin:0 auto 3px;object-fit:cover;box-shadow:0 2px 8px #0009}.char-bubble{position:absolute;top:calc(112px + var(--safe-top));right:calc(12px + var(--safe-right));max-width:210px;background:#101014f0;border:1px solid var(--gold-dim);border-radius:12px;padding:9px 13px;font-size:12.5px;line-height:1.45;color:var(--text);z-index:20;opacity:0;transform:translateY(-6px) scale(.96);transition:opacity .22s,transform .22s;pointer-events:none;backdrop-filter:blur(4px);box-shadow:0 6px 18px #0000008c}.char-bubble.show{opacity:1;transform:translateY(0) scale(1)}.manual-overlay{position:fixed;inset:0;display:none;z-index:400;background:var(--bg-deep)}.manual-overlay.visible{display:block}.manual-overlay iframe{width:100%;height:100%;border:none;background:var(--bg-deep)}.manual-close{position:fixed;top:calc(10px + var(--safe-top));right:calc(12px + var(--safe-right));z-index:410;background:#141418e6;border:1px solid var(--gold-dim);color:var(--gold);font-family:Noto Sans KR,sans-serif;font-size:13px;font-weight:600;padding:8px 16px;border-radius:8px;cursor:pointer;backdrop-filter:blur(4px);box-shadow:0 4px 14px #00000080}#particleCanvas{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:150}@media (max-width: 600px){.logo{font-size:14px}.logo span{display:none}.mode-btn{font-size:11px;padding:7px 10px}.info-badge{font-size:9px;bottom:calc(70px + var(--safe-bottom))}.score-panel .score-num{font-size:22px}.cushion-count{font-size:20px}}@media (pointer: coarse){.btn-shoot,.mode-btn,.btn-reset,.tab-btn{min-height:42px}#followSlider::-webkit-slider-thumb,#sideSlider::-webkit-slider-thumb,#elevSlider::-webkit-slider-thumb,#powerSlider::-webkit-slider-thumb{width:19px;height:19px}}@media (max-height: 440px){.table-wrap{padding-top:calc(44px + var(--safe-top));padding-bottom:2px}.mini-spin{width:38px;height:38px}.dock-mini{padding-top:3px;padding-bottom:3px}.shot-bar{padding:3px 10px;gap:3px 10px}.game-hud{top:calc(44px + var(--safe-top))}.score-panel .score-num{font-size:18px}.cushion-count{font-size:17px}.score-panel{padding:5px 10px;min-width:60px}.cushion-display{padding:4px 10px}.controls{padding-top:8px;padding-bottom:calc(10px + var(--safe-bottom))}.info-badge{display:none}}.btn-shoot{background:#c9a84c26;border:1px solid var(--gold);color:var(--gold);font-family:Noto Sans KR,sans-serif;font-size:12px;font-weight:700;padding:8px 16px;border-radius:6px;cursor:pointer;letter-spacing:1px;transition:all .2s;white-space:nowrap}.btn-shoot:hover{background:#c9a84c59}.tut-panel{position:fixed;display:none;flex-direction:column;transition:transform .28s cubic-bezier(.3,.9,.3,1);z-index:240;background:#1010148c;border:1px solid rgba(201,168,76,.25);border-radius:10px;padding:5px 6px;backdrop-filter:blur(3px)}.tut-panel .tut-head:empty,.tut-panel .tut-slang:empty,.tut-panel .tut-body:empty,.tut-panel .tut-result:empty{display:none}.tut-panel .tut-step:empty,.tut-panel .tut-title:empty{display:none}.tut-panel.visible{display:flex}.ch-panel.up{transform:translateY(calc(-100% - 26px));box-shadow:none}.ch-panel.up .tut-handle{bottom:calc(-27px - 22px - var(--safe-top))}.tut-handle{position:absolute;left:50%;bottom:-27px;transform:translate(-50%);width:44px;height:26px;background:#101014f5;border:1px solid rgba(201,168,76,.35);border-top:none;border-radius:0 0 10px 10px;color:#c9a84c;font-size:13px;line-height:1;cursor:pointer;padding:0;transition:bottom .28s cubic-bezier(.3,.9,.3,1)}.tut-head{display:flex;align-items:center;gap:8px}.tut-step{font-size:12px;color:var(--text-dim);border:1px solid rgba(201,168,76,.3);border-radius:8px;padding:1px 6px;white-space:nowrap}.tut-title{flex:1;font-size:17px;font-weight:800;color:#c9a84c;letter-spacing:.2px;line-height:1.2}.tut-x{background:none;border:none;color:var(--text-dim);font-size:17px;padding:2px 4px;cursor:pointer}.tut-slang{font-size:13.5px;color:var(--text-dim);margin:2px 0 6px}.tut-body{flex:1 1 auto;min-height:0;overflow-y:auto}.tut-line{font-size:15.5px;color:var(--text);line-height:1.55;margin:5px 0}.tut-line b{color:#e8c840}.tut-result{min-height:18px;font-size:14.5px;font-weight:700;color:#7cc8ff;margin:6px 0 3px}.tut-result b{color:#40c878}.tut-row{display:flex;gap:5px;flex-wrap:wrap}.tut-row .tut-demo{border-color:#40c87880;color:#40c878}.tut-row .tut-hide{border-color:#c9a84c80;color:var(--gold)}.tut-row .tut-hide.active{background:#c9a84c38;color:#ffe6a0}.tut-calc{font-size:17px;font-weight:800;color:var(--text);background:#ffffff0d;border-radius:8px;padding:6px 10px;margin:7px 0 3px;letter-spacing:.3px}.tut-calc b{color:#ffbe5a}.tut-calc .tc-blue{color:#78c8ff}.tut-calc:empty{display:none}.tut-diagram{float:right;margin:2px 0 6px 8px}.tut-body:after{content:"";display:block;clear:both}.cue-slide{position:fixed;right:calc(2px + var(--safe-right, 0px));top:50%;transform:translateY(-50%);z-index:150;touch-action:none;background:#1c1c22e0;border:1px solid rgba(201,168,76,.2);border-radius:21px}body.spectate .cue-slide{display:none!important}.fine-dial{display:block;flex:1;border-radius:9px;border:1px solid rgba(201,168,76,.25);touch-action:none}.tab-btn.auto-tab{color:var(--text-dim)}.tab-btn.auto-tab.active{background:#40c87829;color:#40c878}.tab-btn.ch-tab.active{background:#78c8ff29;color:#78c8ff}.ch-panel{border-color:#78c8ff59}.ch-tier{font-size:10px;font-weight:800;padding:1px 7px;border-radius:8px;white-space:nowrap;border:1px solid currentColor}.ch-tier.t-입문{color:#40c878}.ch-tier.t-초급{color:#8ad04a}.ch-tier.t-중급{color:#e8c840}.ch-tier.t-고급{color:#e8a020}.ch-tier.t-최상{color:#e06040}.ch-panel .tut-calc{font-size:11.5px;color:#78c8ff}.quick-btn{position:absolute;bottom:-27px;width:34px;height:26px;display:none;background:#101014f5;border:1px solid rgba(201,168,76,.35);border-top:none;color:#c9a84c;font-size:12px;line-height:1;padding:0;cursor:pointer;transition:bottom .28s cubic-bezier(.3,.9,.3,1)}.quick-btn.qb-left{left:calc(50% - 58px);border-radius:0 0 10px 10px}.quick-btn.qb-right{left:calc(50% + 24px);border-radius:0 0 10px 10px}.ch-panel.up .quick-btn{display:block;bottom:calc(-27px - 22px - var(--safe-top))}.replay-btn{display:none;position:absolute;top:calc(78px + var(--safe-top));right:calc(10px + var(--safe-right));z-index:120;width:40px;height:40px;align-items:center;justify-content:center;border-radius:50%;background:#0c0c10b8;border:1px solid rgba(201,168,76,.4);color:var(--gold);font-size:21px;line-height:1;padding:0 0 2px;backdrop-filter:blur(4px)}.replay-btn:active{background:#c9a84c38}.replay-stop{display:none}body.replay .header,body.replay .dock,body.replay .tab-switch,body.replay .game-hud,body.replay .replay-btn,body.replay .cue-slide,body.replay .cue-slide-pct,body.replay .status-pill{display:none!important}body.replay .table-wrap{padding:calc(var(--safe-top) + 3px) 2px calc(var(--safe-bottom) + 2px) 2px!important}body.replay .replay-stop{display:block;position:fixed;top:calc(6px + var(--safe-top));right:calc(8px + var(--safe-right));z-index:300;background:#0c0c10b3;border:1px solid rgba(201,168,76,.35);color:var(--gold);font-family:Noto Sans KR,sans-serif;font-size:11px;padding:5px 11px;border-radius:999px}.spin-pad{position:fixed;left:50%;bottom:calc(var(--safe-bottom, 0px) + 190px);width:240px;height:240px;z-index:260;pointer-events:none;border-radius:50%;opacity:0;transform:translate(-50%) scale(.86);transition:opacity .13s ease,transform .17s cubic-bezier(.2,.9,.3,1);filter:drop-shadow(0 14px 34px rgba(0,0,0,.6));box-shadow:none}.spin-pad.show{opacity:1;transform:translate(-50%) scale(1)}@media (prefers-reduced-motion: reduce){.spin-pad{transition:none}}.mini-draw{flex:1;display:flex;align-items:center;gap:7px;min-width:0;padding:0 2px}.mini-draw input[type=range]{flex:1;min-width:0;height:30px}.mini-draw .sb-v{min-width:42px}.dock-stack{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:6px}.dock-row{display:flex;align-items:center;gap:8px;min-width:0}.dock-row-power .mini-power{flex:1 1 auto}.dock-row-cue{height:44px}.dock-row-cue .cue-slide{position:static;transform:none;width:100%;height:44px;right:auto;top:auto}@media (min-width: 1000px){.mini-spin{width:84px;height:84px}.dock-mini{gap:16px;padding:10px 18px 12px}.dock-grip{width:34px;height:40px}.mini-power{height:40px}#followSlider::-webkit-slider-thumb,#sideSlider::-webkit-slider-thumb,#elevSlider::-webkit-slider-thumb,#powerSlider::-webkit-slider-thumb{width:22px;height:22px}.mini-pct,.mini-draw .sb-v{font-size:15px;min-width:54px}.tab-btn{font-size:15px;letter-spacing:6px;padding:14px 7px}.tab-switch{gap:3px;border-radius:11px}.sg-btn{width:58px;height:58px;font-size:24px;border-radius:15px}.sg-advice{font-size:18px;padding:9px 20px}}.menu-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:8px;margin-bottom:4px;border-bottom:1px solid rgba(201,168,76,.18)}.menu-title{font-size:14px;font-weight:800;letter-spacing:3px;color:var(--gold);text-transform:uppercase}.menu-close{width:40px;height:40px;border-radius:10px;border:1px solid rgba(201,168,76,.22);background:#ffffff0a;color:var(--gold);font-size:15px;line-height:1;cursor:pointer}.menu-close:active{background:#c9a84c2e}.menu-panel .menu-h{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--gold-dim);margin-bottom:8px}.menu-panel .menu-sec{padding:12px 0}.tile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:78px;padding:10px 4px;border:1px solid rgba(201,168,76,.16);border-radius:12px;background:#ffffff09;color:#eee8dcf0;font-family:Noto Sans KR,sans-serif;font-size:20px;font-weight:800;line-height:1.1;text-align:center;cursor:pointer;transition:background .16s,border-color .16s,color .16s,transform .08s}.tile:before{content:attr(data-label);font-size:11px;font-weight:600;letter-spacing:.3px;color:var(--text-dim)}.tile:active{transform:scale(.96);background:#c9a84c24}.tile.active{border-color:var(--gold);background:#c9a84c29;color:var(--gold)}.tile.active:before{color:#c9a84cbf}.style-grid .tile{font-size:24px}.menu-panel .menu-hint{display:block;margin-top:8px;font-size:11px;line-height:1.5;color:var(--text-dim)}@media (prefers-reduced-motion: reduce){.tile{transition:none}}.tab-btn.rail-icon{writing-mode:horizontal-tb;letter-spacing:0;font-size:19px;padding:10px 6px;line-height:1}.tab-btn.rail-icon:active{background:#c9a84c29}.bp-banner{position:fixed;top:calc(54px + var(--safe-top));left:50%;transform:translate(-50%);z-index:260;display:none;align-items:center;gap:10px;padding:9px 12px 9px 14px;border:1px solid rgba(201,168,76,.35);border-radius:999px;background:#101014f0;color:var(--text);font-family:Noto Sans KR,sans-serif;font-size:13px;font-weight:600;box-shadow:0 6px 20px #0000008c;backdrop-filter:blur(6px)}.bp-banner i{display:inline-block;width:13px;height:13px;margin-right:6px;border-radius:50%;border:1px solid rgba(0,0,0,.5);vertical-align:-2px}.bp-banner b{color:var(--gold);font-weight:700}.bp-banner button{width:30px;height:30px;border-radius:50%;border:1px solid rgba(201,168,76,.3);background:#ffffff0d;color:var(--gold);font-size:13px;line-height:1;cursor:pointer}.ts-overlay{position:fixed;inset:0;z-index:500;display:none;align-items:center;justify-content:center;background:#0000008c;backdrop-filter:blur(3px)}.ts-overlay.open{display:flex}.ts-card{width:min(320px,86vw);background:var(--bg-card);border:1px solid var(--gold-dim);border-radius:16px;padding:18px 18px 16px;box-shadow:0 12px 40px #0009;font-family:Noto Sans KR,sans-serif}.ts-title{color:var(--gold);font-weight:700;font-size:15px;margin-bottom:12px;text-align:center}.ts-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;justify-content:center}.ts-chip{border:1px solid rgba(201,168,76,.3);background:#ffffff0d;color:var(--text);font-size:12px;font-weight:600;padding:6px 10px;border-radius:999px;cursor:pointer}.ts-chip:active{background:#c9a84c33}.ts-row{display:flex;align-items:center;gap:10px;margin-bottom:16px}.ts-step{width:40px;height:40px;flex:none;border-radius:50%;border:1px solid rgba(201,168,76,.3);background:#ffffff0d;color:var(--gold);font-size:15px;font-weight:700;cursor:pointer}.ts-row input{flex:1;min-width:0;text-align:center;font-size:22px;font-weight:700;color:var(--text);background:#ffffff0f;border:1px solid rgba(201,168,76,.25);border-radius:10px;padding:8px 4px}.ts-actions{display:flex;gap:10px}.ts-actions button{flex:1;padding:11px 0;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;font-family:Noto Sans KR,sans-serif}.ts-cancel{background:#ffffff0f;color:var(--text-dim);border:1px solid rgba(255,255,255,.1)}.ts-ok{background:var(--gold);color:#1a1a1a;border:none}.tab-btn.rail-text{font-family:Playfair Display,serif;font-size:15px;font-weight:700;letter-spacing:.5px;color:var(--gold)}body.game-mode .game-hud{position:fixed;top:calc(4px + var(--safe-top));left:calc(10px + var(--safe-left));right:calc(10px + var(--safe-right));padding:0;align-items:center}body.game-mode .score-panel{padding:4px 11px;min-width:66px}body.game-mode .score-panel .player-name{font-size:9px;margin-bottom:0}body.game-mode .score-panel .score-num{font-size:19px}body.game-mode .score-panel .score-sub{font-size:8px;margin-top:1px}body.game-mode .cushion-display{padding:3px 11px}body.game-mode .cushion-count{font-size:17px}body.game-mode #charAvatar{width:26px;height:26px}.tut-panel.peeking{display:none!important}.tut-cloth{position:fixed;display:none;z-index:200;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:10px 12px;font-family:Noto Sans KR,sans-serif;text-shadow:0 1px 3px rgba(0,0,0,.85),0 0 10px rgba(0,0,0,.6);scrollbar-width:none}.tut-cloth::-webkit-scrollbar{display:none}.tc-title{font-size:25px;font-weight:800;color:#ffe296;line-height:1.25}.tc-slang{font-size:16px;color:#e2dcced9;margin:2px 0 10px}.tc-line{font-size:18px;font-weight:600;color:#f4f2ee;line-height:1.6;margin:8px 0}.tc-line b{color:#ffd24a}.tc-res{font-size:18px;font-weight:700;color:#8fd2ff;margin-top:10px}.tut-peek{position:fixed;transform:translate(-50%,-50%);z-index:300;padding:8px 16px;border-radius:999px;border:1px solid var(--gold);background:#101014f2;color:#ffe6a0;font-family:Noto Sans KR,sans-serif;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 6px 20px #0009;backdrop-filter:blur(6px)}.tut-peek:active{background:#c9a84c40}