:root{--bg:#fdf6ff;--bg-grad:linear-gradient(160deg, #fdf1f6 0%, #f2f0ff 50%, #eafbff 100%);--surface:#fff;--surface-soft:#faf7ff;--text:#4a4458;--text-h:#2b2536;--muted:#9a93a8;--border:#efe7f5;--primary:#b79cff;--primary-strong:#9a7bff;--pink:#ffb3d1;--mint:#a7e9c9;--sky:#a9d5ff;--lemon:#ffe08a;--danger:#ff8fa3;--success:#8fd9b6;--radius:18px;--radius-sm:12px;--shadow-sm:0 2px 8px #9678c81f;--shadow:0 10px 30px #9678c82e;--shadow-lg:0 20px 50px #785ab440;--sans:"Pretendard", system-ui, "Segoe UI", "Apple SD Gothic Neo", sans-serif;font:16px/1.5 var(--sans);color:var(--text);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{background:var(--bg-grad);background-attachment:fixed;min-height:100svh;margin:0}#root{min-height:100svh}h1,h2,h3{color:var(--text-h);letter-spacing:-.02em;margin:0 0 .5em;font-weight:800}p{margin:0 0 .6em}a{color:var(--primary-strong)}.btn{appearance:none;cursor:pointer;font:inherit;background:var(--primary);color:#fff;box-shadow:var(--shadow-sm);border:none;border-radius:999px;padding:12px 22px;font-weight:700;transition:transform .12s,box-shadow .12s,background .12s}.btn:hover{box-shadow:var(--shadow);background:var(--primary-strong);transform:translateY(-2px)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn--ghost{background:var(--surface);color:var(--primary-strong);border:2px solid var(--border);box-shadow:none}.btn--ghost:hover{background:var(--surface-soft)}.btn--lg{padding:16px 32px;font-size:1.1rem}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}.input{width:100%;font:inherit;border-radius:var(--radius-sm);border:2px solid var(--border);background:var(--surface-soft);color:var(--text-h);outline:none;padding:12px 16px;transition:border-color .12s}.input:focus{border-color:var(--primary)}.label{color:var(--text-h);margin-bottom:6px;font-size:.9rem;font-weight:700;display:block}.field{margin-bottom:16px}.muted{color:var(--muted)}.page{max-width:1100px;margin:0 auto;padding:32px 20px 64px}.center-page{place-items:center;min-height:100svh;padding:24px;display:grid}.stack{flex-direction:column;gap:12px;display:flex}.row{align-items:center;gap:12px;display:flex}.row--wrap{flex-wrap:wrap}.brand{letter-spacing:-.04em;background:linear-gradient(90deg, var(--primary-strong), var(--pink));color:#0000;-webkit-background-clip:text;background-clip:text;font-weight:900}.game-layout{box-sizing:border-box;gap:14px;height:100svh;padding:12px;display:flex}.game-board{flex:auto;min-width:0;min-height:0;display:flex}.game-side{flex-direction:column;flex:0 0 340px;gap:12px;width:340px;display:flex;overflow-y:auto}.game-side .card{padding:14px}.side-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}@media (width<=860px){.game-layout{flex-direction:column;height:auto}.game-board{height:min(94vw,72svh)}.game-side{flex:none;width:auto}}.ended-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50;background:#3c285a59;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.gkey-card{width:min(78vw,300px);height:min(104vw,400px);transform-style:preserve-3d;margin:0 auto;transition:transform .5s cubic-bezier(.2,.8,.2,1);position:relative}.gkey-card.flipped{transform:rotateY(180deg)}.gkey-face{backface-visibility:hidden;text-align:center;border-radius:22px;flex-direction:column;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0;overflow:hidden;box-shadow:0 20px 50px #0006}.gkey-back{background:linear-gradient(150deg,#ffd86b,#f0a93c 55%,#d98a1f);border:3px solid #fff2c8}.gkey-back .gkey-mark{filter:drop-shadow(0 8px 18px #b4780099);font-size:96px;animation:2s ease-in-out infinite keyPulse}.gkey-back .gkey-label{letter-spacing:.14em;color:#fff;text-shadow:0 2px 6px #965a0080;margin-top:14px;font-size:26px;font-weight:900}.gkey-back:after{content:"";background:linear-gradient(100deg,#0000,#ffffff8c,#0000);width:40%;animation:2.8s ease-in-out infinite gkeyShine;position:absolute;top:0;bottom:0;transform:translate(-150%)}.gkey-front{border:3px solid var(--primary);background:linear-gradient(150deg,#fff,#f2ecff);transform:rotateY(180deg)}.gkey-front .gkey-icon{font-size:84px;animation:.45s cubic-bezier(.2,1.4,.4,1) pop}.gkey-front .gkey-text{color:var(--text-h);margin-top:16px;font-size:20px;font-weight:800;line-height:1.35}.gkey-front .gkey-amount{margin-top:12px;font-size:30px;font-weight:900}@keyframes keyPulse{0%,to{transform:scale(1)rotate(-5deg)}50%{transform:scale(1.09)rotate(5deg)}}@keyframes gkeyShine{0%,55%{transform:translate(-150%)}to{transform:translate(260%)}}@keyframes pop{0%{opacity:0;transform:scale(.2)}to{opacity:1;transform:scale(1)}}.role-tabs{grid-template-columns:1fr 1fr;gap:10px;display:grid}.role-tab{border-radius:var(--radius-sm);border:3px solid var(--border);background:var(--surface-soft);color:var(--text);font:inherit;cursor:pointer;flex-direction:column;align-items:center;gap:2px;padding:14px 10px;transition:border-color .12s,transform .12s;display:flex}.role-tab:hover{transform:translateY(-2px)}.role-tab--on{border-color:var(--primary);box-shadow:var(--shadow-sm);background:#fff}.role-tab__emoji{font-size:30px}.role-tab .muted{font-size:.74rem}.avatar-grid{grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px;display:grid}.avatar-pick{aspect-ratio:1;background:var(--surface-soft);cursor:pointer;border:3px solid #0000;border-radius:14px;place-items:center;font-size:28px;transition:transform .12s,border-color .12s;display:grid}.avatar-pick:hover{transform:translateY(-2px)scale(1.05)}.avatar-pick--on{border-color:var(--primary-strong);box-shadow:var(--shadow-sm);background:#fff}.room-row{background:var(--surface-soft);border:2px solid var(--border);border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.room-row--btn{width:100%;font:inherit;color:inherit;cursor:pointer;transition:transform .12s,border-color .12s}.room-row--btn:hover{border-color:var(--primary);transform:translateY(-2px)}.room-row--btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.player-row{background:color-mix(in srgb, var(--pc,var(--surface-soft)) 22%, #fff);border-left:8px solid var(--pc,var(--border));border-radius:12px;gap:10px;padding:10px 14px}.player-row__avatar{font-size:26px}.asset-card{border-top:6px solid var(--pc,var(--primary))}.asset-head{background:color-mix(in srgb, var(--pc) 35%, #fff);border-radius:12px;align-items:center;gap:10px;margin:-4px -6px 10px;padding:8px 10px;display:flex}.asset-head__avatar{box-shadow:var(--shadow-sm);background:#fff;border-radius:10px;padding:2px 6px;font-size:26px}.asset-stats{gap:8px;display:flex}.asset-stats>div{background:var(--surface-soft);text-align:center;border-radius:10px;flex:1;padding:6px 8px}.asset-stats span{font-size:.7rem;display:block}.asset-stats b{font-size:.95rem}.asset-row{background:color-mix(in srgb, var(--pc) 18%, #fff);border:1px solid color-mix(in srgb, var(--pc) 45%, #fff);border-radius:10px;align-items:center;gap:8px;padding:7px 10px;display:flex}.asset-row__strip{border-radius:3px;flex:none;width:6px;height:26px}.asset-row__toll{white-space:nowrap;font-size:.82rem;font-weight:800}.jump-overlay{z-index:60;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:none;background:#1e14328c;flex-direction:column;justify-content:center;align-items:center;gap:6px;animation:.25s fadeIn;display:flex;position:fixed;inset:0}.jump-overlay--island{background:#3c0f1999}.jump-stage{width:min(80vw,560px);height:130px;position:relative}.jump-flyer{filter:drop-shadow(0 8px 16px #00000080);align-items:center;gap:4px;display:flex;position:absolute;top:20px;left:0}.jump-flyer__avatar{background:color-mix(in srgb, var(--pc) 60%, #fff);outline:4px solid var(--pc);border-radius:50%;padding:6px 10px;font-size:60px}.jump-flyer__chain{font-size:34px}.jump-dest{font-size:68px;animation:.9s ease-in-out infinite destPulse;position:absolute;top:26px;right:0}.jump-overlay--island .jump-flyer{animation:2.8s linear forwards dragAway,.32s ease-in-out infinite struggle}.jump-overlay--unicef .jump-flyer,.jump-overlay--start .jump-flyer{animation:1.5s cubic-bezier(.4,0,.2,1) forwards flyAway}@keyframes dragAway{0%{opacity:1;left:0}75%{opacity:1;left:calc(100% - 90px)}to{opacity:0;left:calc(100% - 80px);transform:scale(.5)}}@keyframes struggle{0%,to{rotate:-9deg}50%{rotate:9deg}}@keyframes flyAway{0%{opacity:1;left:0;transform:scale(1)}60%{transform:translateY(-40px)scale(1.15)}to{opacity:0;left:calc(100% - 80px);transform:scale(.55)}}@keyframes destPulse{0%,to{transform:scale(1)}50%{transform:scale(1.18)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.jump-title{color:#fff;text-shadow:0 4px 14px #0009;margin:0;font-size:clamp(1.4rem,4vw,2.4rem);animation:.4s cubic-bezier(.2,1.4,.4,1) pop}.jump-sub{color:#ffffffd9;font-weight:700}.game-board--shake{animation:.42s ease-in-out infinite boardShake}@keyframes boardShake{0%,to{transform:translate(0)rotate(0)}25%{transform:translate(-5px,3px)rotate(-.5deg)}50%{transform:translate(4px,-3px)rotate(.4deg)}75%{transform:translate(-3px,-2px)rotate(-.3deg)}}.item-chip{color:#7a5a1f;box-shadow:var(--shadow-sm);background:linear-gradient(140deg,#ffe9ac,#ffd06b);border:1px solid #e8b64d;border-radius:999px;align-items:center;gap:3px;padding:4px 9px;font-size:.76rem;font-weight:800;display:inline-flex}.rank-row{background:var(--surface-soft);border-left:6px solid var(--pc);border-radius:12px;align-items:center;gap:6px;padding:7px 10px;display:flex}.rank-row--on{outline:2px solid var(--primary);background:#f1ecff}.rank-row__dot{background:var(--pc);border-radius:50%;flex:none;width:12px;height:12px}.badge{background:var(--accent-bg,var(--surface-soft));color:var(--primary-strong);border:1px solid var(--border);border-radius:999px;align-items:center;gap:4px;padding:3px 10px;font-size:.78rem;font-weight:700;display:inline-flex}.editor-grid{aspect-ratio:1;background:linear-gradient(135deg,#f3ecff,#eafaff);border-radius:18px;gap:3px;width:min(58vmin,520px);padding:6px;display:grid}.editor-tile{cursor:pointer;background:var(--surface);color:var(--text-h);text-align:center;border:none;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;min-width:0;padding:2px;font-size:.55rem;line-height:1.1;display:flex;position:relative;overflow:hidden}.editor-tile.sel{outline:3px solid var(--primary-strong);z-index:1}.editor-tile.locked{background:var(--surface-soft);cursor:default}.editor-tile .t-emoji{font-size:1.1rem}.editor-tile .t-tag{background:var(--accent-bg,#eee);color:var(--primary-strong);border-radius:5px;padding:0 3px;font-size:.5rem;font-weight:700;position:absolute;top:2px;right:2px}.editor-tile .t-strip{height:5px;position:absolute;top:0;left:0;right:0}.chance-card-box{background:var(--surface-soft);border:2px solid var(--border);border-radius:12px;margin-bottom:10px;padding:8px}.chance-card{align-items:center;gap:8px;display:flex}.chance-card .amt{width:84px}.board{--gap:clamp(2px, .5cqmin, 5px);grid-template-columns:repeat(var(--n), 1fr);grid-template-rows:repeat(var(--n), 1fr);gap:var(--gap);width:100%;height:100%;padding:var(--gap);box-shadow:var(--shadow-lg);box-sizing:border-box;background:linear-gradient(135deg,#f3ecff,#eafaff);border-radius:20px;margin:0 auto;display:grid;container-type:size}.tile{background:var(--surface);text-align:center;box-shadow:var(--shadow-sm);border:2px solid #0000;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;min-width:0;padding:3px;font-size:clamp(.5rem,2cqmin,1rem);line-height:1.15;display:flex;position:relative;overflow:hidden}.tile--city:before{content:"";background:var(--group,transparent);height:14%;position:absolute;top:0;left:0;right:0}.tile--city{padding-top:16%}.tile__name{color:var(--text-h);word-break:keep-all;font-weight:700}.tile__price{color:var(--muted);margin-top:2px;font-size:.82em}.tile__emoji{font-size:clamp(1rem,4cqmin,2.2rem)}.tile__building{margin-top:2px;font-size:clamp(1rem,4.5cqmin,2.4rem);line-height:1}.tile--start,.tile--island,.tile--unicef,.tile--worldtour{background:linear-gradient(135deg, #fff, var(--surface-soft))}.tile--owned{background:color-mix(in srgb, var(--owner) 70%, var(--surface));border:4px solid color-mix(in srgb, var(--owner) 75%, #5b4a7a)}.tile--owned .tile__name{color:#3a3348}.board__center{background:#ffffff80;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex}.board__logo{font-size:clamp(1.2rem,6cqmin,3rem);font-weight:900}.tile--pick{cursor:pointer;animation:1.1s ease-in-out infinite pickPulse}.tile--pick:hover{outline:3px solid var(--primary-strong)}@keyframes pickPulse{0%,to{box-shadow:0 0 #9a7bff80}50%{box-shadow:0 0 0 4px #9a7bff40}}.tokens{flex-wrap:wrap;justify-content:center;gap:1px;display:flex;position:absolute;bottom:1px;left:1px;right:1px}.token{filter:drop-shadow(0 1px 1px #00000040);outline:2px solid var(--pc,transparent);background:color-mix(in srgb, var(--pc,#fff) 55%, #fff);border-radius:50%;font-size:clamp(.85rem,3.4cqmin,1.8rem);transition:transform .15s}.token--moving{z-index:2;animation:.19s ease-in-out hop}@keyframes hop{0%{transform:translateY(0)scale(1)}45%{transform:translateY(-45%)scale(1.25)}to{transform:translateY(0)scale(1)}}.dice-wrap{justify-content:center;align-items:center;gap:clamp(8px,3cqmin,22px);display:flex}.die-scene{--sz:clamp(46px, 13cqmin, 104px);width:var(--sz);height:var(--sz);perspective:600px}.die{width:100%;height:100%;transform-style:preserve-3d;transition:transform .95s cubic-bezier(.2,.9,.25,1);position:relative}.die-face{width:var(--sz);height:var(--sz);box-sizing:border-box;backface-visibility:hidden;background:linear-gradient(145deg,#fff,#eee6ff);border:2px solid #d9cffb;border-radius:16%;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);padding:10%;display:grid;position:absolute;inset:0;box-shadow:inset 0 0 8px #9678c840}.pip-cell{place-items:center;display:grid}.pip{background:radial-gradient(circle at 35% 30%,#9a7bff,#6b4ea0);border-radius:50%;width:62%;height:62%;box-shadow:0 1px 2px #0000004d}.f-front{transform:rotateY(0deg) translateZ(calc(var(--sz) / 2))}.f-back{transform:rotateY(180deg) translateZ(calc(var(--sz) / 2))}.f-right{transform:rotateY(90deg) translateZ(calc(var(--sz) / 2))}.f-left{transform:rotateY(-90deg) translateZ(calc(var(--sz) / 2))}.f-top{transform:rotateX(90deg) translateZ(calc(var(--sz) / 2))}.f-bottom{transform:rotateX(-90deg) translateZ(calc(var(--sz) / 2))}
