:root{--bg-0: #07090f;--bg-1: #0c1018;--bg-2: #11151f;--surface: rgba(255, 255, 255, .04);--surface-strong: rgba(255, 255, 255, .07);--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .16);--text: #eef2fb;--text-dim: #aab3c5;--text-mute: #7a8294;--accent: #7c5cff;--accent-2: #22e0c6;--accent-3: #ff5e9f;--gradient-accent: linear-gradient(135deg, #7c5cff 0%, #22e0c6 100%);--shadow-sm: 0 4px 14px rgba(0, 0, 0, .25);--shadow-md: 0 12px 32px rgba(0, 0, 0, .35);--shadow-lg: 0 24px 60px rgba(0, 0, 0, .45);--radius-sm: 10px;--radius-md: 14px;--radius-lg: 20px;--radius-pill: 999px;--container: min(1280px, 100% - 1.5rem);--header-h: 56px;--footer-h: 36px;color:var(--text);background:var(--bg-0);font-family:Inter,Pretendard Variable,Pretendard,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{height:100dvh;width:100vw;min-width:320px;overflow:hidden;background:radial-gradient(60vw 50vw at 12% -8%,rgba(124,92,255,.22),transparent 60%),radial-gradient(50vw 45vw at 92% 4%,rgba(34,224,198,.16),transparent 65%),radial-gradient(70vw 60vw at 50% 110%,rgba(255,94,159,.12),transparent 60%),linear-gradient(180deg,var(--bg-1) 0%,var(--bg-0) 60%,var(--bg-1) 100%)}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}img{display:block;max-width:100%}::selection{background:#7c5cff73;color:#fff}#root{height:100dvh}.app-shell{height:100dvh;display:grid;grid-template-rows:var(--header-h) 1fr var(--footer-h);overflow:hidden}.site-header{width:100%;display:flex;align-items:center;border-bottom:1px solid var(--border);background:#07090fa6;backdrop-filter:saturate(160%) blur(18px);-webkit-backdrop-filter:saturate(160%) blur(18px)}.site-header__inner{width:var(--container);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:inline-flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.01em;font-size:1rem}.brand__mark{width:24px;height:24px;border-radius:7px;background:var(--gradient-accent);box-shadow:0 6px 18px #7c5cff73;flex-shrink:0}.site-nav{display:flex;gap:4px;font-size:.88rem;color:var(--text-dim)}.site-nav a{padding:6px 12px;border-radius:var(--radius-pill);transition:background .16s ease,color .16s ease}.site-nav a:hover{background:var(--surface);color:var(--text)}main{min-height:0;overflow:hidden}.site-footer{display:flex;align-items:center;justify-content:center;color:var(--text-mute);font-size:.78rem;border-top:1px solid var(--border)}.page{width:var(--container);height:100%;margin:0 auto;padding:14px 0;display:grid;gap:14px;min-height:0}.home-page,.detail-page{grid-template-rows:auto 1fr}.hero{position:relative;overflow:hidden;padding:14px 20px;border:1px solid var(--border);border-radius:var(--radius-lg);background:radial-gradient(60% 100% at 100% 0%,rgba(34,224,198,.18),transparent 60%),radial-gradient(60% 100% at 0% 100%,rgba(124,92,255,.22),transparent 60%),linear-gradient(180deg,#ffffff0a,#ffffff03);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:0}.hero__content{min-width:0;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.hero__title{margin:0;font-size:clamp(1.05rem,2.2vw,1.5rem);line-height:1.15;letter-spacing:-.02em;font-weight:800}.hero__sub{margin:0;color:var(--text-dim);font-size:.85rem;line-height:1.4}.eyebrow{display:inline-flex;align-items:center;gap:6px;margin:0;padding:3px 10px;border:1px solid var(--border-strong);border-radius:var(--radius-pill);background:var(--surface);color:var(--text);font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.eyebrow:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 10px var(--accent-2)}.primary-link,.ghost-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:var(--radius-pill);font-weight:700;font-size:.9rem;letter-spacing:-.01em;white-space:nowrap;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease,color .16s ease;cursor:pointer;border:1px solid transparent;flex-shrink:0}.primary-link{color:#0a0d14;background:var(--gradient-accent);box-shadow:0 10px 30px #7c5cff59}.primary-link:hover{transform:translateY(-1px);box-shadow:0 14px 38px #7c5cff80;filter:brightness(1.05)}.ghost-link{color:var(--text);background:var(--surface);border-color:var(--border-strong)}.ghost-link:hover{background:var(--surface-strong);border-color:#ffffff47}.game-grid{display:grid;gap:12px;min-height:0;height:100%;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.game-card{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-2);box-shadow:var(--shadow-sm);padding:14px;min-height:0;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.game-card:hover{transform:translateY(-3px);border-color:var(--border-strong);box-shadow:var(--shadow-md)}.game-card--featured{grid-column:span 2;grid-row:span 2}.game-card__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s ease}.game-card:hover .game-card__image{transform:scale(1.05)}.game-card:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#07090f00 30%,#07090fe6),linear-gradient(135deg,rgba(124,92,255,.18),transparent 55%)}.game-card__badges{position:absolute;top:10px;left:10px;right:10px;display:flex;align-items:center;justify-content:space-between;gap:8px;pointer-events:none}.game-card__title{margin:8px 0 4px;font-size:1rem;font-weight:700;letter-spacing:-.01em;line-height:1.2;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.game-card--featured .game-card__title{font-size:clamp(1.4rem,2.4vw,1.9rem);-webkit-line-clamp:2}.game-card__desc{margin:0;color:var(--text-dim);font-size:.82rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.game-card--featured .game-card__desc{-webkit-line-clamp:2;font-size:.9rem}.game-card__meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;color:var(--text-mute);font-size:.74rem}.badge{display:inline-flex;align-items:center;height:22px;padding:0 10px;border-radius:var(--radius-pill);background:var(--gradient-accent);color:#0a0d14;font-size:.68rem;font-weight:800;letter-spacing:.04em;box-shadow:0 4px 14px #7c5cff59}.chip{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:var(--radius-pill);border:1px solid var(--border-strong);background:#07090f99;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--text);font-size:.7rem;font-weight:600}.detail-hero{display:grid;gap:16px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:stretch;padding:18px;border:1px solid var(--border);border-radius:var(--radius-lg);background:linear-gradient(180deg,#ffffff0a,#ffffff03);box-shadow:var(--shadow-md);min-height:0}.detail-hero__media{position:relative;overflow:hidden;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-2);min-height:0}.detail-hero__media img{width:100%;height:100%;object-fit:cover}.detail-hero__content{display:flex;flex-direction:column;gap:10px;min-width:0;overflow:hidden}.detail-hero__content h1{margin:4px 0 0;font-size:clamp(1.4rem,3vw,2.2rem);line-height:1.1;letter-spacing:-.02em;font-weight:800}.detail-hero__content p{margin:0;color:var(--text-dim);line-height:1.55;font-size:.92rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.detail-hero__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}.tag-list{display:flex;flex-wrap:wrap;gap:6px}.tag-list span{padding:3px 10px;border-radius:var(--radius-pill);border:1px solid var(--border);background:var(--surface);color:var(--text-dim);font-size:.74rem}.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-height:0}.info-card{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);overflow:hidden;min-height:0}.info-card h2{margin:0;font-size:.92rem;font-weight:700;letter-spacing:-.01em}.info-card ul{margin:0;padding-left:18px;color:var(--text-dim);line-height:1.55;font-size:.86rem;overflow:auto}.info-card .kv{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px dashed var(--border);color:var(--text-dim);font-size:.85rem}.info-card .kv:last-child{border-bottom:0}.info-card .kv strong{color:var(--text);font-weight:600}.play-page{width:var(--container);min-height:100%;margin:0 auto;padding:18px 0 24px;display:grid;grid-template-rows:auto auto auto;gap:14px}.play-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 14px;border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.play-toolbar__title{flex:1;min-width:0;text-align:center;font-weight:700;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.play-toolbar a{color:var(--text-dim);font-size:.88rem;padding:4px 12px;border-radius:var(--radius-pill);transition:background .16s ease,color .16s ease}.play-toolbar a:hover{background:var(--surface-strong);color:var(--text)}.play-toolbar__actions{display:flex;align-items:center;justify-content:flex-end;gap:6px}.play-toolbar button{height:30px;padding:0 10px;border:1px solid var(--border);border-radius:var(--radius-pill);color:var(--text-dim);background:transparent;cursor:pointer}.play-toolbar button:hover{color:var(--text);background:var(--surface-strong)}.play-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,320px);gap:16px;padding:18px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface)}.play-intro h1{margin:4px 0 8px;font-size:clamp(1.6rem,3vw,2.4rem)}.play-intro p{margin:0;max-width:68ch;color:var(--text-dim);line-height:1.6}.play-intro ul{margin:0;padding-left:18px;color:var(--text-dim);line-height:1.7}.play-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:12px;align-items:start}.game-frame-wrap{position:relative;width:100%;aspect-ratio:16 / 9;min-height:420px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-2);box-shadow:var(--shadow-lg);overflow:hidden}.game-overlay{position:absolute;inset:0;z-index:2;display:grid;place-content:center;gap:8px;text-align:center;background:radial-gradient(circle at center,rgba(124,92,255,.22),transparent 36%),#07090fb8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.game-overlay strong{font-size:1.1rem}.game-overlay span{color:var(--text-dim);font-size:.9rem}.game-start-panel{padding:20px}.game-start-panel span{max-width:360px}.game-start-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.game-start-actions button{border:0;cursor:pointer;font:inherit}.game-start-actions .ghost-link{border:1px solid var(--border);background:var(--surface)}.game-frame{width:100%;height:100%;border:0;display:block}.play-side{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:10px;min-height:0}.panel-card{min-height:0;padding:14px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-sm);overflow:hidden}.panel-card__header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.panel-card__header h2{margin:0;font-size:.95rem}.panel-card__header span{color:var(--accent-2);font-size:.78rem;font-weight:800}.empty-text{margin:0;color:var(--text-mute);font-size:.86rem;line-height:1.5}.score-list{height:100%;margin:0;padding:0;list-style:none;overflow:auto}.score-list li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--border)}.score-list li:last-child{border-bottom:0}.score-list span{color:var(--text-mute);font-size:.78rem}.score-list strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.86rem}.score-list em{color:var(--accent-2);font-size:.84rem;font-style:normal;font-weight:800}.score-submit,.feedback-form{display:grid;gap:7px}.score-submit label,.feedback-form label{display:grid;gap:6px;color:var(--text-dim);font-size:.82rem}.feedback-message-label{margin-top:2px}.feedback-submit-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.rating-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;color:var(--text-dim);font-size:.82rem}.star-rating{display:flex;align-items:center;justify-content:flex-end;gap:2px;flex-shrink:0}.star-button{width:25px;height:25px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:transparent;color:#ffd166;font-size:1.18rem;line-height:1;cursor:pointer;transition:transform .12s ease,background .12s ease}.star-button:hover{transform:translateY(-1px);background:#ffd1661a}.score-submit input,.feedback-form input{width:100%;border:1px solid var(--border);border-radius:var(--radius-sm);background:#07090f85;color:var(--text);outline:none}.score-submit input,.feedback-form input{height:38px;padding:0 10px}.score-submit input:focus,.feedback-form input:focus{border-color:var(--accent-2)}.score-submit .primary-link,.feedback-form .primary-link{height:38px;min-height:38px;padding:0 14px;border-radius:var(--radius-sm)}.score-submit .primary-link{width:100%}.debug-page{grid-template-rows:auto 1fr}.debug-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface)}.debug-header h1{margin:6px 0 0;font-size:1.25rem}.debug-table-wrap{min-height:0;overflow:auto;border:1px solid var(--border);border-radius:var(--radius-md);background:#07090f6b}.debug-table{width:100%;border-collapse:collapse;font-size:.78rem}.debug-table th,.debug-table td{padding:10px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}.debug-table th{position:sticky;top:0;background:var(--bg-2);color:var(--text)}.debug-table code{color:var(--text-dim);white-space:pre-wrap;word-break:break-word}.narrow-page{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center}@media(max-width:1000px){.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.game-card--featured{grid-column:span 3;grid-row:span 1}}@media(max-width:1080px){.play-layout{grid-template-columns:1fr}.play-side{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto}}@media(max-width:760px){:root{--header-h: 52px;--footer-h: 32px}.hero{padding:10px 14px}.hero__sub{display:none}.detail-hero{grid-template-columns:1fr;grid-template-rows:minmax(0,.9fr) minmax(0,1.2fr);padding:12px}.detail-hero__content p{-webkit-line-clamp:2}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr))}.game-card--featured{grid-column:span 2;grid-row:span 1}.info-grid,.play-intro,.play-side{grid-template-columns:1fr}.game-frame-wrap{min-height:320px}.feedback-submit-row{grid-template-columns:1fr}.feedback-form .primary-link{width:100%}}@media(max-width:480px){.site-nav a:nth-child(n+3){display:none}.game-grid{grid-template-columns:1fr;grid-template-rows:repeat(4,minmax(0,1fr))}.game-card--featured{grid-column:span 1}.game-card--featured .game-card__title{font-size:1.2rem}.hero__title{font-size:1rem}.info-grid{display:none}.play-toolbar{align-items:stretch;flex-wrap:wrap;border-radius:var(--radius-md)}.play-toolbar__title{order:-1;flex-basis:100%}.play-toolbar__actions{flex:1}.play-toolbar__actions button,.play-toolbar__actions a,.play-toolbar>a{flex:1;text-align:center}.game-frame-wrap{min-height:240px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}