: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{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__start{position:absolute;right:0;top:50%;transform:translateY(-50%)}.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(10px,1.15vw,13px);border-radius:20px;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:10px}.player-badge{min-width:52px;padding:7px 10px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-size:clamp(14px,1.35vw,16px);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:6px;border-radius:16px;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:48px;padding:0 14px;border:2px solid rgba(22,48,70,.08);border-radius:12px;background:#ffffffdb;font-size:clamp(18px,1.7vw,24px);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:stretch}.dock-card{min-height:0;padding:14px;border-radius:22px;background:#ffffffb8;border:2px solid var(--panel-border);box-shadow:0 12px 24px #1c34401a;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);gap:10px}.dock-card--wide{background:linear-gradient(180deg,#ffffffc7,#f9faffb8)}.dock-card__header{display:flex;align-items:center;justify-content:space-between;gap:12px}.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}.dock-card__action{min-height:30px;padding:0 10px;border:1px solid rgba(23,48,71,.12);border-radius:999px;background:#ffffffd6;color:#173047c7;font-size:12px;transition:transform .16s ease,background .16s ease,opacity .16s ease}.dock-card__action:hover:not(:disabled){transform:translateY(-1px);background:#fffffff5}.dock-card__action:disabled{opacity:.38;cursor:not-allowed}.time-picker{display:grid;gap:8px;height:100%;grid-auto-rows:minmax(0,1fr)}.time-chip{min-height:0;height:100%;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));grid-auto-rows:minmax(0,1fr);gap:10px;height:100%;align-content:stretch}.category-chip-shell{position:relative;min-height:0}.category-chip-shell--wide{grid-column:1 / -1}.category-chip{position:relative;width:100%;min-height:0;height:100%;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--wide{min-height:0;padding:14px 22px;grid-template-columns:auto auto;align-items:center;justify-content:center;justify-items:center;align-content:center;gap:14px}.category-chip:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 14px 26px #1730471f}.category-chip--selected,.category-chip-shell--selected .category-chip{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-shell--disabled .category-chip{background:#707e8c1f;color:#1730477a}.category-chip__thumb-wrap{width:min(100%,72px);height:54px;display:grid;place-items:center;border-radius:14px;background:transparent;border:0;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--wide .category-chip__thumb-wrap{width:74px;height:54px}.category-chip--wide .category-chip__label{font-size:clamp(16px,1.35vw,19px);text-align:center}.category-chip__input{display:none}.category-chip__add,.category-chip__count,.category-chip__badge{position:absolute;top:8px;min-width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-size:11px;font-weight:700}.category-chip__add{right:8px;padding:0;border:0;background:#ffffffeb;color:var(--ink-dark);box-shadow:0 8px 16px #17304729;z-index:2}.category-chip__add:hover:not(:disabled){transform:translateY(-1px)}.category-chip__add:disabled{cursor:wait}.category-chip__count,.category-chip__badge{left:8px;padding:0 8px;background:#1730471a}.category-chip__count{background:#173047d1;color:#fff}.leaderboard-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;height:100%;grid-template-rows:repeat(5,minmax(0,1fr))}.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;min-height:0}.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;align-content:center}.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)}.dock-card--time .dock-card__header,.dock-card--leaderboard .dock-card__header,.dock-card--category .dock-card__header{min-height:28px}.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}.lobby-header__start .start-button{min-width:168px;min-height:54px;padding-inline:20px;font-size:clamp(18px,1.6vw,22px)}.round-screen{position:relative;min-height:100vh;padding:clamp(10px,1.2vw,16px);display:grid;grid-template-rows:minmax(0,1fr);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:10px 12px;border-radius:18px;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:92px;padding:8px 12px;border-radius:14px;background:linear-gradient(135deg,#173047,#2d6c8b);color:#fff;font-size:clamp(20px,2vw,28px);text-align:center;letter-spacing:-.04em}.round-quit{position:absolute;top:clamp(10px,1.2vw,16px);right:clamp(10px,1.2vw,16px);z-index:4;min-height:36px;padding:0 12px;border:1px solid rgba(23,48,71,.1);border-radius:999px;background:#ffffffd1;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 18px #1730471a;color:var(--ink-dark);font-size:13px}.round-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;min-height:0;height:100%}.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}.play-lane{min-height:0;padding:10px;border-radius:22px;border:2px solid rgba(255,255,255,.8);box-shadow:var(--shadow-soft);display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px}.play-lane--left{background:linear-gradient(180deg,#f2fdfff0,#e2f9fed6),linear-gradient(135deg,#4d8eff29,#60ddba2e)}.play-lane--right{background:linear-gradient(180deg,#fffcf5f0,#fff3e2d6),linear-gradient(135deg,#ff8f3f29,#ffd3782e)}.lane-hud{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:8px}.lane-hud__badge{padding:7px 11px;border-radius:999px;color:#fff;font-size:clamp(14px,1.05vw,16px);white-space:nowrap;box-shadow:0 8px 14px #1d33411a}.lane-hud__badge--left{background:linear-gradient(135deg,#4d8eff,#35c8b8)}.lane-hud__badge--right{background:linear-gradient(135deg,#ff8f3f,#ffc65a)}.lane-hud__scoreline{min-width:0;padding:7px 10px;border-radius:16px;background:#ffffffb8;border:1px solid rgba(23,48,71,.08);display:flex;align-items:center;gap:8px;flex-wrap:wrap}.lane-hud__scoregroup{display:inline-flex;align-items:baseline;gap:7px;flex-shrink:0}.lane-hud__score-label{display:inline-flex;font-size:11px;color:#1730478f}.lane-hud__score{display:inline-flex;font-size:clamp(26px,2.6vw,36px);line-height:1;letter-spacing:-.06em;color:var(--ink-dark)}.lane-hud__meta{min-width:0;flex:1 1 240px;display:flex;flex-wrap:wrap;align-items:center;gap:6px}.lane-hud__pill{padding:5px 9px;border-radius:999px;background:#17304712;font-size:12px;color:#173047b8;line-height:1}.lane-hud__pill--time{background:#173047e6;color:#fff}.lane-hud__feedback{margin-left:auto;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease,max-width .18s ease,padding .18s ease;padding:0;border-radius:999px;background:#ffffffe0;font-size:14px;color:var(--ink-dark)}.lane-hud__feedback--visible{max-width:88px;opacity:1;transform:translateY(0);padding:4px 8px}.lane-playfield{position:relative;min-height:440px;border-radius:20px;overflow:hidden;border:2px dashed rgba(23,48,71,.12);background:linear-gradient(180deg,#ffffffeb,#f3f8fab3),linear-gradient(180deg,#addcff29,#ffd59924);touch-action:none}.lane-playfield:after{content:"";position:absolute;inset:auto 0 0;height:32%;background:linear-gradient(180deg,#346b8500,#346b850f);pointer-events:none}.lane-playfield__hint{position:absolute;left:10px;top:10px;z-index:2;padding:5px 10px;border-radius:999px;background:#ffffffd6;color:#173047a8;font-size:12px}.falling-item{position:absolute;left:0;top:0;padding:0;border:0;background:transparent;touch-action:none;transition:filter .12s ease}.falling-item:disabled{cursor:default}.falling-item--dragging{filter:drop-shadow(0 14px 24px rgba(20,52,75,.22))}.falling-item--selected .falling-item__surface{border-color:#4d8effb8;box-shadow:0 0 0 4px #4d8eff29,0 10px 18px #1630461f}.falling-item__surface{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:20px;background:transparent;border:2px solid transparent;box-shadow:none;-webkit-user-select:none;user-select:none}.falling-item__image{width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.falling-item__fallback{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;padding:10px;border-radius:18px;background:#17304714;color:var(--ink-dark);font-size:clamp(18px,1.8vw,24px);letter-spacing:-.04em}.lane-bins{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.recycle-bin{--bin-color: #5f8599;position:relative;min-height:102px;padding-top:14px;padding-inline:0;border:0;border-radius:18px 18px 16px 16px;background:transparent;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.recycle-bin__rim{position:absolute;inset:0 8px auto;height:16px;border-radius:999px;background:linear-gradient(135deg,color-mix(in srgb,var(--bin-color) 88%,white),var(--bin-color));box-shadow:0 8px 16px color-mix(in srgb,var(--bin-color) 34%,transparent)}.recycle-bin__body{height:100%;padding:16px 10px 10px;border-radius:16px;background:linear-gradient(180deg,color-mix(in srgb,var(--bin-color) 22%,white),color-mix(in srgb,var(--bin-color) 12%,white));border:2px solid color-mix(in srgb,var(--bin-color) 48%,white);display:grid;justify-items:center;align-content:center;gap:6px;box-shadow:inset 0 1px #ffffffc7}.recycle-bin__thumb-wrap{width:48px;height:38px;padding:4px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;background:transparent}.recycle-bin__thumb-wrap--empty{background:#ffffff7a}.recycle-bin__thumb{width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none}.recycle-bin__label{font-size:clamp(15px,1.12vw,18px);letter-spacing:-.04em;color:var(--ink-dark)}.recycle-bin--active{transform:translateY(-3px) scale(1.015)}.recycle-bin--active .recycle-bin__body{box-shadow:inset 0 1px #ffffffd6,0 18px 26px color-mix(in srgb,var(--bin-color) 28%,transparent)}.recycle-bin--correct .recycle-bin__body{background:linear-gradient(180deg,#5fdd8e47,#ddffebe6);border-color:#2ba8658a}.recycle-bin--wrong .recycle-bin__body{background:linear-gradient(180deg,#ff7f6c42,#fff1ebeb);border-color:#e9656594}.round-result-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#11223142;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:11}.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;z-index:12}.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}.play-lane{grid-template-rows:auto minmax(320px,1fr) auto}}@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;flex-direction:column;justify-content:center}.lobby-header__title{padding-inline:18px}.lobby-header__start{position:static;transform:none;margin-top:10px}.lane-hud{grid-template-columns:1fr}.lane-hud__scoreline{gap:6px}.lane-hud__meta{flex-basis:100%}.lane-bins{grid-template-columns:repeat(2,minmax(0,1fr))}.recycle-bin{min-height:120px}.result-row{grid-template-columns:1fr;text-align:center}.result-row span:first-child,.result-row span:last-child{text-align:center}}