:root{font-family:Arial Rounded MT Bold,NanumSquareRound,Apple SD Gothic Neo,Segoe UI,sans-serif;color:#123149;background:#eaf6ef;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--ink-dark: #173047;--paper-cream: rgba(255, 251, 239, .92);--panel-border: rgba(20, 52, 75, .16);--shadow-soft: 0 20px 60px rgba(28, 52, 64, .16)}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100vh;overflow-x:hidden;background:radial-gradient(circle at top left,rgba(104,202,255,.36),transparent 34%),radial-gradient(circle at top right,rgba(255,183,112,.3),transparent 32%),linear-gradient(180deg,#effbf5,#e8f8f0 52%,#f6efe0)}button,input{font:inherit}button{cursor:pointer}input{outline:none}.start-lobby{position:relative;min-height:100dvh;padding:clamp(14px,1.5vw,22px);display:grid;grid-template-rows:auto minmax(0,1fr);gap:clamp(12px,1.4vw,18px);isolation:isolate}.lobby-main{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:clamp(12px,1.4vw,18px);min-height:0}.lobby-surface{position:relative;display:grid;gap:clamp(12px,1.4vw,18px);align-self:start;isolation:isolate}.lobby-surface:before,.lobby-surface:after{content:"";position:absolute;border-radius:999px;z-index:-3}.lobby-surface:before{width:42vw;height:42vw;left:-14vw;top:-18vw;background:#62d6ff33}.lobby-surface:after{width:38vw;height:38vw;right:-12vw;bottom:-10vw;background:#ffc57642}.start-lobby__backdrop{position:absolute;top:0;bottom:0;border-radius:32px;opacity:.72;z-index:-2}.start-lobby__backdrop--left{left:0;right:calc(50% + clamp(6px,.7vw,9px));background:linear-gradient(180deg,#ffffffb8,#eafdff2e),linear-gradient(135deg,#4d8eff40,#6fe1c629)}.start-lobby__backdrop--right{left:calc(50% + clamp(6px,.7vw,9px));right:0;background:linear-gradient(180deg,#ffffffb8,#fff5e442),linear-gradient(135deg,#ff8f3f42,#ffd1762e)}.lobby-header{position:relative;min-height:92px;display:flex;align-items:center;justify-content:center}.lobby-header__title{display:inline-flex;align-items:center;padding:12px 22px;border-radius:999px;background:#fffdf5d1;border:3px solid rgba(255,255,255,.56);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.lobby-header h1{margin:0;font-size:clamp(28px,3.3vw,44px);letter-spacing:-.05em;line-height:1;color:var(--ink-dark)}.player-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.4vw,18px)}.player-panel{position:relative;min-height:0;padding:clamp(14px,1.6vw,18px);border-radius:24px;border:3px solid rgba(255,255,255,.48);box-shadow:var(--shadow-soft)}.player-panel--left{background:linear-gradient(180deg,#f2fdffeb,#e2f9fed6),linear-gradient(135deg,#4d8eff2e,#60ddba38)}.player-panel--right{background:linear-gradient(180deg,#fffcf5eb,#fff3e2d6),linear-gradient(135deg,#ff8f3f2e,#ffd37833)}.player-panel__row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px}.player-badge{min-width:58px;padding:8px 12px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-size:clamp(16px,1.6vw,18px);letter-spacing:-.03em;color:#fff;box-shadow:0 8px 14px #1d33411a}.player-badge--left{background:linear-gradient(135deg,#4d8eff,#35c8b8)}.player-badge--right{background:linear-gradient(135deg,#ff8f3f,#ffc65a)}.player-name-inline{min-width:0;width:100%;padding:8px;border-radius:20px;background:#ffffffa3;border:2px solid rgba(255,255,255,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.player-name-inline__input{width:100%;min-height:56px;padding:0 16px;border:2px solid rgba(22,48,70,.08);border-radius:14px;background:#ffffffdb;font-size:clamp(22px,2vw,28px);color:var(--ink-dark)}.player-name-inline__input::placeholder{color:#17304747}.player-name-inline__input:focus{border-color:#3a8eff7a;box-shadow:0 0 0 4px #4c8eff1f}.settings-dock{position:relative;padding:0}.settings-dock__grid{display:grid;grid-template-columns:minmax(200px,.95fr) minmax(320px,1.25fr) minmax(280px,1fr);gap:12px;align-items:start}.settings-dock__footer{display:flex;justify-content:center;align-self:end}.dock-card{min-height:0;padding:14px;border-radius:22px;background:#ffffffb8;border:2px solid var(--panel-border);box-shadow:0 12px 24px #1c34401a}.dock-card--wide{background:linear-gradient(180deg,#ffffffc7,#f9faffb8)}.dock-card__header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.dock-card__title,.dock-card__count{font-size:clamp(14px,1.3vw,18px);color:var(--ink-dark)}.dock-card__count{padding:4px 10px;border-radius:999px;background:#17304714}.time-picker{display:grid;gap:8px}.time-chip{min-height:48px;border:0;border-radius:14px;background:#17304714;color:#173047e0;font-size:clamp(16px,1.5vw,20px);transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.time-chip:hover{transform:translateY(-1px)}.time-chip--active{background:linear-gradient(135deg,#173047,#2d6c8b);color:#fff;box-shadow:0 12px 24px #1530472e}.category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.category-chip{position:relative;min-height:108px;padding:10px 10px 14px;border-radius:18px;border:2px solid transparent;background:linear-gradient(180deg,rgba(255,255,255,.94),var(--category-tint));color:var(--ink-dark);display:grid;justify-items:center;align-content:space-between;gap:8px;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.category-chip:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 14px 26px #1730471f}.category-chip--selected{border-color:var(--category-color);box-shadow:0 14px 26px var(--category-shadow)}.category-chip--disabled{background:#707e8c1f;color:#1730477a;cursor:not-allowed}.category-chip__thumb-wrap{width:min(100%,72px);height:54px;display:grid;place-items:center;border-radius:14px;background:#ffffffd1;border:1px solid rgba(23,48,71,.08);overflow:hidden}.category-chip__thumb-wrap--empty{background:linear-gradient(180deg,#ffffffb8,#eceff2e0);border-style:dashed}.category-chip__thumb{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 14px rgba(23,48,71,.14))}.category-chip__label{font-size:clamp(14px,1.2vw,17px);font-weight:700;text-align:center}.category-chip__badge{position:absolute;top:8px;right:8px;padding:3px 7px;border-radius:999px;background:#1730471a;font-size:11px}.leaderboard-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.leaderboard-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:8px 10px;border-radius:14px;background:#ffffffb8}.leaderboard-row--placeholder{color:#17304757}.leaderboard-row__rank{width:30px;height:30px;display:grid;place-items:center;border-radius:999px;background:#17304714;font-size:13px}.leaderboard-row__players{min-width:0;display:grid}.leaderboard-row__names{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.leaderboard-row__meta,.leaderboard-row__date{font-size:11px;color:#17304799}.leaderboard-row__score{font-size:20px;color:var(--ink-dark)}.start-button{min-width:min(320px,100%);min-height:64px;border:0;border-radius:999px;background:linear-gradient(135deg,#173047,#35a972);color:#fff;font-size:clamp(22px,2.1vw,28px);letter-spacing:-.04em;box-shadow:0 14px 26px #22445233;transition:transform .16s ease,opacity .16s ease,filter .16s ease}.start-button:hover:not(:disabled){transform:translateY(-2px) scale(1.01)}.start-button--disabled,.start-button:disabled{opacity:.42;filter:grayscale(.22);cursor:not-allowed}.round-screen{min-height:100vh;padding:clamp(14px,1.8vw,24px);display:grid;grid-template-rows:auto 1fr auto;gap:14px;background:radial-gradient(circle at top left,rgba(104,202,255,.22),transparent 30%),radial-gradient(circle at top right,rgba(255,183,112,.22),transparent 28%),linear-gradient(180deg,#eef9f4,#f8f1e4)}.round-header{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:12px 14px;border-radius:22px;background:#ffffffb8;border:2px solid rgba(23,48,71,.1);box-shadow:var(--shadow-soft)}.round-chip-list{min-width:0;display:flex;flex-wrap:wrap;gap:8px}.round-chip{padding:8px 12px;border-radius:999px;background:#17304714;font-size:14px;color:var(--ink-dark)}.round-timer{min-width:98px;padding:10px 14px;border-radius:16px;background:linear-gradient(135deg,#173047,#2d6c8b);color:#fff;font-size:clamp(22px,2.2vw,30px);text-align:center;letter-spacing:-.04em}.round-quit{min-height:52px;padding:0 16px;border:0;border-radius:16px;background:#1730471a;color:var(--ink-dark);font-size:16px}.round-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.round-panel{padding:18px;border-radius:26px;border:2px solid rgba(255,255,255,.78);box-shadow:var(--shadow-soft)}.round-panel--left{background:linear-gradient(180deg,#f2fdffeb,#e2f9fed1),linear-gradient(135deg,#4d8eff29,#60ddba2e)}.round-panel--right{background:linear-gradient(180deg,#fffcf5eb,#fff3e2d1),linear-gradient(135deg,#ff8f3f29,#ffd3782e)}.round-panel__top{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:12px}.round-panel__badge{padding:9px 14px;border-radius:999px;color:#fff;font-size:18px;white-space:nowrap}.round-panel__badge--left{background:linear-gradient(135deg,#4d8eff,#35c8b8)}.round-panel__badge--right{background:linear-gradient(135deg,#ff8f3f,#ffc65a)}.round-panel__score-wrap{position:relative;min-width:0;display:grid}.round-panel__score-label{font-size:14px;color:#173047a8}.round-panel__score{font-size:clamp(44px,5vw,72px);line-height:1;letter-spacing:-.06em;color:var(--ink-dark)}.round-panel__feedback{position:absolute;right:0;top:0;opacity:0;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease;padding:6px 10px;border-radius:999px;background:#ffffffd6;font-size:16px;color:var(--ink-dark)}.round-panel__feedback--visible{opacity:1;transform:translateY(0)}.round-panel__stats{margin-top:18px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.round-stat{padding:12px;border-radius:18px;background:#ffffffb3;display:grid;gap:4px}.round-stat span{font-size:13px;color:#1730479e}.round-stat strong{font-size:24px;color:var(--ink-dark)}.round-panel__controls{margin-top:16px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.round-event{min-height:64px;border:0;border-radius:18px;color:#fff;font-size:18px;box-shadow:0 12px 20px #17304724}.round-event--correct{background:linear-gradient(135deg,#29a56f,#45ce8f)}.round-event--wrong{background:linear-gradient(135deg,#f05656,#ff8c69)}.round-event--miss{background:linear-gradient(135deg,#69727d,#9aa5b1)}.round-help{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:0 0 8px;color:#173047b8;font-size:14px}.round-help span{padding:6px 10px;border-radius:999px;background:#ffffff9e}.round-result{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,calc(100vw - 28px));padding:20px;border-radius:24px;background:#fffbf3f5;border:2px solid rgba(23,48,71,.1);box-shadow:0 28px 60px #15304742}.round-result__title{font-size:clamp(28px,3vw,38px);text-align:center;color:var(--ink-dark);margin-bottom:16px}.result-row{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;padding:12px 0;border-top:1px solid rgba(23,48,71,.08);align-items:center}.result-row:first-of-type{border-top:0}.result-row span{font-size:18px;color:var(--ink-dark)}.result-row span:first-child{text-align:left}.result-row span:nth-child(2){color:#1730478f}.result-row span:last-child{text-align:right}.round-result__actions{margin-top:18px;display:flex;justify-content:center;gap:10px}.round-result__button{min-width:120px;min-height:54px;border:0;border-radius:16px;background:linear-gradient(135deg,#173047,#35a972);color:#fff;font-size:18px}.round-result__button--ghost{background:#17304714;color:var(--ink-dark)}@media (max-width: 1080px){.settings-dock__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dock-card--wide{grid-column:1 / -1}.round-board{grid-template-columns:1fr}}@media (max-width: 920px){.player-stage{grid-template-columns:1fr}.player-panel__row{grid-template-columns:72px minmax(0,1fr)}.start-lobby__backdrop--left{right:0;bottom:50%}.start-lobby__backdrop--right{left:0;top:50%}}@media (max-width: 760px){.settings-dock__grid{grid-template-columns:1fr}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lobby-header{min-height:120px}.lobby-header__title{padding-inline:18px}.round-header,.round-panel__top,.round-panel__controls,.round-panel__stats{grid-template-columns:1fr}.result-row{grid-template-columns:1fr;text-align:center}.result-row span:first-child,.result-row span:last-child{text-align:center}}