@font-face{font-family:Spoqa Han Sans Neo;src:url(/fonts/SpoqaHanSansNeo-Regular.ttf) format("truetype");font-style:normal;font-weight:400;font-display:swap}:root{--paper:#fbf8f4;--surface:#ffffff;--ink:#1f1d1b;--ink-secondary:#5c554e;--orange:#ff6b26;--orange-hover:#fa5a10;--orange-dark:#d95416;--orange-soft:#fff2e8;--line:#e8e1d9;--line-strong:#d0c5b8;--muted:#80776f;--shadow-sm:0 2px 8px rgba(31,29,27,.04);--shadow:0 10px 28px rgba(31,29,27,.07);--shadow-lg:0 16px 40px rgba(31,29,27,.1)}*{box-sizing:border-box}body,html{background:var(--paper)}body{margin:0;color:var(--ink);font-family:Apple SD Gothic Neo,Pretendard,Noto Sans KR,system-ui,Spoqa Han Sans Neo,sans-serif;font-synthesis:weight;-webkit-text-size-adjust:100%}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}.home-shell,.room-shell{min-height:100svh;padding:24px clamp(16px,4vw,56px) 64px}.home-shell{max-width:1200px;margin:0 auto}.brand-header,.join-header,.room-header{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;padding-bottom:20px;border-bottom:1px solid var(--line)}.brand-lockup{gap:9px;color:var(--ink);font-size:14px;font-weight:800;letter-spacing:.02em}.brand-button,.brand-lockup{display:inline-flex;align-items:center}.brand-button{border:0;background:transparent;padding:0;cursor:pointer}.brand-icon{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--orange);color:#ffffff;box-shadow:0 2px 6px rgba(255,107,38,.3)}.brand-name{font-weight:800;font-size:14px;letter-spacing:.02em}.language-switcher{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:var(--surface);padding:3px}.language-option{min-height:28px;border:0;border-radius:999px;background:transparent;color:var(--muted);padding:4px 12px;font-size:12px;font-weight:700;transition:all .15s ease}.language-option.is-active{background:var(--orange);color:#ffffff;box-shadow:0 2px 6px rgba(255,107,38,.25)}.hero-intro{text-align:center;padding:clamp(36px,6vw,64px) 16px clamp(28px,4vw,44px);max-width:780px;margin:0 auto}.hero-intro h1{margin:0 0 16px;font-size:clamp(2.4rem,6vw,4.4rem);line-height:1.15;letter-spacing:-.03em;font-weight:850;color:var(--ink)}.hero-intro h1 .hero-highlight{color:var(--orange)}.hero-intro p{margin:0 auto;color:var(--ink-secondary);font-size:clamp(1rem,1.6vw,1.2rem);font-weight:500;line-height:1.6;max-width:580px}.action-hub{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:stretch;max-width:980px;margin:0 auto}.hub-card{border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:var(--shadow);padding:clamp(22px,3.5vw,32px);display:flex;flex-direction:column}.hub-card-header{margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid var(--line)}.hub-card-header h2{margin:0;font-size:1.25rem;font-weight:800;letter-spacing:-.02em;color:var(--ink)}.hub-card-desc{margin:0 0 20px;color:var(--ink-secondary);font-size:14px;line-height:1.5}.form-fields{display:grid;gap:16px;flex:1 1}.field-group{display:grid;gap:6px;font-size:13px;font-weight:700;color:var(--ink);text-align:left}.field-hint{color:var(--muted);font-size:12px;font-weight:500;margin-top:2px}input{min-width:0;border:1.5px solid var(--line);border-radius:12px;outline:0;background:var(--paper);color:var(--ink);padding:12px 14px;font-size:14px;font-weight:600;transition:border-color .15s,box-shadow .15s}input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,107,38,.15);background:#ffffff}input::placeholder{color:#a8a099}.segmented-control{display:grid;grid-template-columns:1fr 1fr;gap:4px;border:1.5px solid var(--line);border-radius:12px;background:var(--paper);padding:3px}.segment-btn{min-height:36px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:13px;font-weight:700;transition:all .15s ease}.segment-btn.is-selected{background:#ffffff;color:var(--ink);box-shadow:0 2px 6px rgba(0,0,0,.06)}.primary-button,.secondary-button{min-height:48px;border:0;border-radius:12px;padding:12px 20px;font-size:14px;font-weight:800;letter-spacing:-.01em;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:transform .12s,background-color .15s,box-shadow .15s}.primary-button{background:var(--orange);color:#ffffff;box-shadow:0 4px 14px rgba(255,107,38,.3)}.primary-button:hover:not(:disabled){background:var(--orange-hover);transform:translateY(-1px);box-shadow:0 6px 18px rgba(255,107,38,.35)}.primary-button:active:not(:disabled){transform:translateY(0)}.secondary-button{background:var(--paper);color:var(--ink);border:1.5px solid var(--line-strong)}.secondary-button:hover:not(:disabled){background:var(--surface);border-color:var(--ink);transform:translateY(-1px)}.cta-button{margin-top:20px;width:100%}.wide{width:100%}.join-input-group{display:flex;gap:8px;margin-top:auto}.code-input{flex:1 1;text-transform:lowercase;font-weight:700;font-size:16px;letter-spacing:.08em;text-align:center}.join-btn{min-width:90px;background:var(--ink);color:#ffffff;border-color:var(--ink)}.join-btn:hover:not(:disabled){background:#36322f;color:#ffffff}.public-section{max-width:980px;margin:48px auto 0;padding-top:36px;border-top:1px solid var(--line)}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.section-heading h2{margin:0;font-size:1.25rem;font-weight:800;letter-spacing:-.02em}.section-heading.compact h2{font-size:1.15rem}.section-heading h2 small{color:var(--muted);font-size:.8em}.room-counter{color:var(--muted);font-size:13px;font-weight:700}.public-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.public-room{border:1.5px solid var(--line);border-radius:14px;background:var(--surface);padding:16px 18px;text-align:left;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow-sm);transition:transform .15s,border-color .15s,box-shadow .15s}.public-room:hover{border-color:var(--orange);transform:translateY(-2px);box-shadow:var(--shadow)}.room-badge{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:11px;font-weight:700}.room-status-dot{width:7px;height:7px;border-radius:50%;background:#36b779}.room-title{font-size:15px;font-weight:800;color:var(--ink)}.room-code-tag{color:var(--orange-dark);font-size:12px;font-weight:700}.empty-card{border:1.5px dashed var(--line-strong);border-radius:16px;padding:36px 20px;text-align:center;background:rgba(255,255,255,.4)}.empty-card p{margin:0;color:var(--muted);font-size:14px;font-weight:600}.toast-error{position:fixed;right:20px;bottom:20px;z-index:100;max-width:min(90vw,400px);border:1px solid #fecaca;border-radius:12px;background:#fef2f2;color:#991b1b;padding:12px 18px;font-size:13px;font-weight:700;box-shadow:var(--shadow-lg)}.room-shell{max-width:1400px;margin:0 auto}.room-header-meta{display:flex;align-items:center;gap:8px;min-width:0;flex:1 1 auto;font-size:13px;font-weight:700}.room-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-privacy-tag{border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--muted);padding:2px 7px;font-size:11px;font-weight:700}.connection-dot{width:8px;height:8px;border-radius:50%;background:#36b779;box-shadow:0 0 0 3px rgba(54,183,121,.2)}.connection-dot.offline{background:var(--orange);box-shadow:none}.room-header-actions{display:flex;align-items:center;gap:8px}.share-button{min-height:34px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);padding:4px 14px;font-size:12px;font-weight:800;transition:all .15s}.share-button:hover{border-color:var(--ink)}.room-lobby{width:min(100%,980px);display:grid;grid-template-columns:.9fr 1.1fr;gap:24px;align-items:start;margin:clamp(36px,6vw,64px) auto}.finished-panel,.loading-card,.room-code-card,.room-lobby-side{border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:var(--shadow);padding:clamp(24px,4vw,36px)}.room-code-card{text-align:center}.card-badge{display:inline-block;background:var(--orange-soft);color:var(--orange-dark);font-size:11px;font-weight:800;padding:4px 10px;border-radius:999px;margin-bottom:12px}.room-code-card>strong{display:block;margin:12px 0 20px;color:var(--orange);font-size:clamp(3.2rem,8vw,5.5rem);line-height:1;letter-spacing:.06em;font-weight:850}.room-code-card button{min-height:44px;width:100%;border:0;border-radius:12px;background:var(--ink);color:#ffffff;font-size:13px;font-weight:800;transition:opacity .15s}.room-code-card button:hover{opacity:.9}.room-code-card p{color:var(--muted);font-size:13px;font-weight:500;margin:14px 0 0}.round-settings{display:grid;gap:6px;margin-top:18px;border-top:1px solid var(--line);padding-top:16px}.round-settings label{display:flex;align-items:center;justify-content:space-between;gap:12px}.round-settings label,select{font-size:13px;font-weight:700}select{border:1.5px solid var(--line);border-radius:10px;background:var(--paper);padding:8px 12px;outline:0}.host-wait,.round-settings small{color:var(--muted);font-size:12px;font-weight:500}.host-wait{border:1.5px dashed var(--line);border-radius:12px;padding:14px;text-align:center}.host-wait,.room-lobby-side .primary-button{margin-top:18px}.player-list{display:grid;gap:8px}.player-tile{position:relative;display:flex;align-items:center;gap:10px;min-height:48px;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:8px 12px}.player-tile.drawer{border-color:var(--orange);background:var(--orange-soft)}.player-number{color:var(--muted);font-size:11px;font-weight:800;min-width:14px}.player-avatar,.score-avatar{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--orange);color:#ffffff;font-size:13px;font-weight:800}.player-name{flex:1 1;font-size:14px;font-weight:700}.player-name small{margin-left:6px;color:var(--orange-dark);font-size:11px}.player-tile>strong{font-size:13px}.player-tile em{position:absolute;top:4px;right:8px;color:var(--orange-dark);font-size:9px;font-style:normal;font-weight:800}.game-layout{width:min(100%,1360px);display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;margin:24px auto 0}.game-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.game-status-label{color:var(--orange-dark);font-size:12px;font-weight:800}.game-topline h1{margin:4px 0 0;font-size:clamp(1.6rem,3.5vw,2.4rem);letter-spacing:-.03em;font-weight:850}.timer{display:grid;place-items:center;width:68px;height:68px;border-radius:16px;background:var(--orange);color:#ffffff;font-size:28px;font-weight:850;box-shadow:0 4px 12px rgba(255,107,38,.35)}.timer.urgent{background:#ef4444;box-shadow:0 4px 12px rgba(239,68,68,.4)}.canvas-card{overflow:hidden;border:1.5px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}.canvas-wrap{position:relative;width:100%;height:min(60vh,600px);min-height:360px;background:#ffffff}.drawing-surface{display:block;width:100%;height:100%;touch-action:none}.drawing-surface.is-drawable{cursor:crosshair}.canvas-note{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-size:14px;font-weight:700;pointer-events:none}.canvas-toolbar{justify-content:space-between;gap:12px;border-top:1px solid var(--line);background:var(--paper);padding:10px 14px}.canvas-toolbar,.tool-group{display:flex;align-items:center}.tool-group{gap:8px}.color-dot{width:28px;height:28px;border:2px solid #ffffff;border-radius:50%;padding:0;box-shadow:0 1px 4px rgba(0,0,0,.2);transition:transform .12s}.color-dot.selected{outline:2.5px solid var(--ink);outline-offset:2px;transform:scale(1.1)}.tool-button{min-height:32px;border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:4px 10px;font-size:12px;font-weight:700}.tool-button.selected,.tool-button:hover{background:var(--orange-soft);border-color:var(--orange);color:var(--orange-dark)}.clear-button{color:#dc2626}.answer-row{display:flex;gap:10px;margin-top:16px}.answer-row>input{flex:1 1;min-height:52px;font-size:16px}.answer-button{min-width:110px;min-height:52px}.prompt-card{display:flex;align-items:center;justify-content:space-between;width:100%;border:1.5px solid var(--orange);border-radius:14px;background:var(--orange-soft);padding:14px 20px}.prompt-card span{color:var(--orange-dark);font-size:12px;font-weight:800}.prompt-card strong{font-size:22px;color:var(--ink)}.game-side{display:grid;align-content:start;gap:16px}.side-block{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:16px;box-shadow:var(--shadow-sm)}.guess-feed{min-height:220px}.muted-copy{color:var(--muted);font-size:13px;font-weight:500;margin:12px 0 0}.guess-item{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding:8px 2px;font-size:13px}.guess-item>span{color:var(--muted);font-size:16px}.guess-item strong{flex:1 1}.guess-answer{max-width:38%;overflow:hidden;color:var(--muted);text-overflow:ellipsis;white-space:nowrap}.guess-item.correct b,.guess-item.correct>span{color:#16a34a}.guess-item b{font-size:12px}.correct-feedback{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;border-radius:14px;background:#16a34a;color:#ffffff;padding:12px 18px;box-shadow:0 4px 14px rgba(22,163,74,.25);animation:feedback-pop .2s ease-out}.correct-feedback strong{font-size:15px}.reveal-banner{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin:0 0 14px;border:1.5px solid var(--orange);border-radius:14px;background:var(--orange-soft);padding:12px 16px}.banner-title{color:var(--orange-dark);font-size:12px;font-weight:800}.reveal-banner strong{font-size:18px}.reveal-banner p{margin:0;color:var(--orange-dark);font-size:12px;font-weight:700;text-align:right}@keyframes feedback-pop{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.loading-card{width:min(100%,520px);margin:12vh auto;text-align:center}.loading-card h1{margin:8px 0 12px;font-size:clamp(2rem,5vw,3rem);letter-spacing:-.03em}.loading-card p{color:var(--ink-secondary);font-size:14px;margin:0 0 24px}.join-card{max-width:440px}.join-card h1{margin:6px 0 8px}.join-card .card-badge{display:inline-block;margin:0 auto 12px}.join-desc{margin:0 0 24px;color:var(--ink-secondary);font-size:14px;line-height:1.5}.join-form-fields{display:grid;gap:18px}.join-submit-btn{margin-top:4px}.finished-panel{width:min(100%,640px);margin:clamp(40px,8vw,80px) auto;text-align:center}.finished-panel h1{margin:8px 0 6px;font-size:clamp(2.4rem,6vw,3.8rem);letter-spacing:-.03em}.finished-panel>p{margin:0 0 24px;color:var(--ink-secondary);font-size:14px}.score-board{display:grid;gap:8px;text-align:left}.score-row{display:flex;align-items:center;gap:10px;min-height:52px;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:8px 14px}.score-row.winner{border-color:var(--orange);background:var(--orange-soft)}.rank-badge{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ink);color:#ffffff;font-size:12px;font-weight:800}.score-row strong{flex:1 1;font-size:14px}.score-row b{font-size:15px}.score-row b small{color:var(--muted);font-size:11px;margin-left:2px}.finish-actions{display:flex;gap:10px;justify-content:center;margin-top:24px}@media (max-width:820px){.action-hub,.game-layout,.room-lobby{grid-template-columns:1fr}.game-side{grid-template-columns:1fr 1fr}}@media (max-width:560px){.home-shell,.room-shell{padding:16px 12px 40px}.hero-intro{padding:24px 8px}.hero-intro h1{font-size:2.2rem}.game-side,.reveal-banner{grid-template-columns:1fr}.reveal-banner{gap:4px}.reveal-banner p{text-align:left}.canvas-toolbar{flex-direction:column;align-items:stretch}.tool-group{justify-content:center}}