:root{--bg:#f6f8fb;--card:#fff;--text:#111827;--muted:#64748b;--line:#e5eaf1;--primary:#1457ff;--accent:#ff6b00;--hero:#f59e0b;--risk:#7c3aed;--shadow:0 12px 30px rgba(15,23,42,.08);--radius:24px}
[data-theme=blue]{--primary:#0047ff;--accent:#ff4d00}[data-theme=mint]{--primary:#00a884;--accent:#ff8a00}[data-theme=purple]{--primary:#7c3aed;--accent:#f59e0b}[data-theme=dark]{--bg:#0b1220;--card:#111827;--text:#f8fafc;--muted:#9ca3af;--line:#243044;--shadow:0 18px 40px rgba(0,0,0,.28)}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,'Pretendard','Apple SD Gothic Neo',Segoe UI,sans-serif;background:var(--bg);color:var(--text)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}.landing,.auth{min-height:100svh;display:grid;place-items:center;padding:24px}.landing-wrap,.auth-card{width:min(720px,100%);background:var(--card);border:1px solid var(--line);border-radius:32px;padding:28px;box-shadow:var(--shadow)}.brand{font-weight:900;color:var(--primary);letter-spacing:-.02em}.landing h1,.auth h1{font-size:clamp(34px,7vw,64px);line-height:1.05;margin:24px 0 14px;letter-spacing:-.06em}.landing p,.auth p{font-size:18px;color:var(--muted);line-height:1.6}.landing h2{font-size:15px;margin:28px 0 12px}.concept-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.concept,.theme{background:var(--bg);border:1px solid var(--line);border-radius:20px;padding:16px;text-align:left;color:var(--text)}.concept span{display:block;color:var(--muted);font-size:13px;margin-top:6px}.concept.active,.theme.active{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 16%,transparent)}.theme-grid{display:flex;gap:10px;flex-wrap:wrap}.theme{display:flex;align-items:center;gap:8px;padding:12px 14px}.theme i{width:18px;height:18px;border-radius:50%}.primary,.kakao{display:flex;justify-content:center;align-items:center;text-decoration:none;border:0;border-radius:18px;background:var(--primary);color:white;font-weight:900;padding:17px 20px;margin-top:22px}.kakao{background:#fee500;color:#111}.full{width:100%}.auth small{display:block;margin-top:18px;color:var(--muted);text-align:center}
.app{min-height:100svh;padding-bottom:calc(86px + env(safe-area-inset-bottom));}.app-top{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.app-top div{text-align:center}.app-top span{display:block;font-size:11px;color:var(--muted);margin-top:2px}.icon-btn{border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:999px;padding:9px 12px;font-size:13px;font-weight:800}.screen-wrap{max-width:1180px;margin:0 auto;padding:14px 14px 110px}.screen{display:none}.screen.active{display:block}.match-hero{background:radial-gradient(circle at 20% 10%,color-mix(in srgb,var(--primary) 17%,transparent),transparent 34%),linear-gradient(160deg,var(--card),color-mix(in srgb,var(--primary) 5%,var(--card)));border:1px solid var(--line);border-radius:32px;padding:24px;box-shadow:var(--shadow);overflow:hidden}.status-pill{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900;color:var(--primary);background:var(--card)}.teams{display:flex;align-items:center;justify-content:space-between;margin:30px 0 8px}.teams span{font-size:42px;font-weight:1000;letter-spacing:-.08em}.teams b{width:56px;height:56px;border-radius:50%;background:var(--text);color:var(--card);display:grid;place-items:center;font-size:14px}.match-hero p{color:var(--muted);margin:0}.micro-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:24px}.micro-row div{background:color-mix(in srgb,var(--card) 84%,transparent);border:1px solid var(--line);border-radius:18px;padding:12px;text-align:center}.micro-row b{display:block;font-size:20px}.micro-row span{font-size:11px;color:var(--muted)}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-top:14px;box-shadow:var(--shadow)}.card h3{margin:0 0 14px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.steps button{border:1px solid var(--line);border-radius:18px;background:var(--bg);padding:14px;color:var(--text)}.steps b{display:block;font-size:20px;color:var(--primary)}.steps span{font-size:12px;color:var(--muted)}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.quick-actions button,.board-tools button{border:0;border-radius:18px;padding:16px;background:var(--text);color:var(--card);font-weight:900}.quick-actions button:nth-child(2){background:var(--primary);color:#fff}.section-title{display:flex;justify-content:space-between;align-items:center}.section-title h3{margin:0}.section-title button{border:0;background:transparent;color:var(--primary);font-weight:900}.hint-stack{display:grid;gap:10px}.hint-stack div{display:grid;grid-template-columns:92px 1fr auto;align-items:center;gap:12px;padding:12px;border-radius:16px;background:var(--bg)}.hint-stack span{color:var(--muted);font-size:13px}.spark{font-family:monospace;letter-spacing:1px;color:var(--primary);font-weight:900}.spark.down{color:var(--risk)}.bar{height:10px;background:var(--line);border-radius:99px;overflow:hidden}.bar em{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:99px}.dots{color:var(--accent)}.page-head{display:flex;align-items:flex-start;gap:12px;margin:8px 0 14px}.page-head button{border:1px solid var(--line);border-radius:16px;background:var(--card);width:44px;height:44px;color:var(--text);font-weight:900}.page-head h1{margin:0;font-size:30px;letter-spacing:-.05em}.page-head p{margin:5px 0 0;color:var(--muted);line-height:1.4}.mobile-board-sticky{position:sticky;top:64px;z-index:30}.board-head{display:flex;justify-content:space-between;margin-bottom:12px}.board-head span{color:var(--primary);font-weight:900}.bingo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.slot{aspect-ratio:1;border:1.5px dashed color-mix(in srgb,var(--primary) 28%,var(--line));border-radius:18px;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8px;position:relative;min-height:96px}.slot.empty{color:var(--muted);font-size:12px}.slot.filled{background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 8%,var(--card)),var(--card));border-style:solid}.slot.selected{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent);border-color:var(--accent)}.slot img{width:32px;height:32px;margin-bottom:4px}.slot b{font-size:13px;line-height:1.15}.slot small{font-size:10px;color:var(--muted);margin-top:4px}.slot .remove{position:absolute;right:5px;top:5px;width:22px;height:22px;border-radius:50%;border:0;background:var(--text);color:var(--card);font-size:12px}.board-tools{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.board-tools button{padding:12px;background:var(--bg);color:var(--text);border:1px solid var(--line)}.selected-help{position:sticky;top:calc(64px + 292px);z-index:20;margin:12px 0;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--primary) 8%,var(--card));border:1px solid color-mix(in srgb,var(--primary) 20%,var(--line));color:var(--primary);font-weight:900}.mission-list{display:grid;gap:10px}.mission-card{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:14px;box-shadow:var(--shadow)}.mission-card.disabled{opacity:.45}.mission-card.active{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 14%,transparent)}.mission-icon{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;background:color-mix(in srgb,var(--primary) 8%,var(--bg))}.mission-icon img{width:34px}.mission-card h4{margin:0 0 5px}.mission-card p{margin:0;color:var(--muted);font-size:13px}.mini-viz{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.mini-viz b{font-size:18px;color:var(--primary)}.choice-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice-summary div{background:var(--bg);border-radius:18px;padding:14px}.choice-summary span{display:block;color:var(--muted);font-size:12px}.choice-summary b{font-size:18px}.small-title{margin:18px 4px 10px}.player-carousel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 14px}.player-card{min-width:82%;scroll-snap-align:center;background:var(--card);border:1px solid var(--line);border-radius:28px;padding:18px;box-shadow:var(--shadow)}.player-card.selected{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 18%,transparent)}.player-visual{height:120px;border-radius:24px;background:radial-gradient(circle at 30% 20%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 35%),linear-gradient(135deg,color-mix(in srgb,var(--primary) 10%,var(--bg)),var(--card));display:flex;align-items:center;justify-content:center;font-size:56px;margin-bottom:14px}.player-card h4{font-size:24px;margin:0}.player-card p{color:var(--muted);line-height:1.5}.stat-strip{display:grid;gap:8px}.stat-strip div{display:grid;grid-template-columns:80px 1fr auto;gap:8px;align-items:center}.stat-strip span{color:var(--muted);font-size:12px}.player-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.player-actions button{border:0;border-radius:16px;padding:13px;font-weight:900}.player-actions button:first-child{background:var(--bg);color:var(--text)}.player-actions button:last-child{background:var(--primary);color:white}.live-score{display:flex;align-items:center;justify-content:space-between}.live-score b{font-size:24px}.live-score em{font-style:normal;color:#ef4444;font-weight:1000}.live .slot:nth-child(1),.live .slot:nth-child(2),.live .slot:nth-child(3){background:color-mix(in srgb,var(--accent) 15%,var(--card));border-color:var(--accent)}.live-line{display:flex;justify-content:space-between;margin-top:12px;color:var(--muted)}.live-line b{color:var(--accent)}.player-state{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:12px;border-radius:16px;background:var(--bg);margin-top:8px}.ranking{display:grid;gap:10px}.rank-card{display:flex;justify-content:space-between;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:16px;box-shadow:var(--shadow)}.rank-card b:first-child{width:32px;height:32px;border-radius:50%;background:var(--bg);display:grid;place-items:center}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:60;height:calc(64px + env(safe-area-inset-bottom));padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--card) 94%,transparent);backdrop-filter:blur(18px);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.bottom-nav button{border:0;background:transparent;border-radius:15px;color:var(--muted);font-weight:900;font-size:12px}.bottom-nav button.active{background:color-mix(in srgb,var(--primary) 10%,transparent);color:var(--primary)}.action-bar{position:fixed;left:12px;right:12px;bottom:calc(72px + env(safe-area-inset-bottom));z-index:55;display:none}.action-bar button{width:100%;border:0;border-radius:18px;background:var(--primary);color:white;font-weight:1000;padding:16px;box-shadow:var(--shadow)}.sheet{display:none}.sheet.open{display:block}.sheet-dim{position:fixed;inset:0;background:rgba(15,23,42,.4);z-index:80}.sheet-panel{position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--card);border-radius:28px 28px 0 0;padding:12px 18px calc(18px + env(safe-area-inset-bottom));max-height:82svh;overflow:auto}.grab{width:42px;height:5px;border-radius:99px;background:var(--line);margin:0 auto 18px}.sheet-panel h2{margin:0 0 12px}.sheet-panel p{color:var(--muted);line-height:1.55}.sheet-viz{display:grid;gap:10px}.sheet-viz div{display:flex;justify-content:space-between;padding:12px;border-radius:16px;background:var(--bg)}
[data-concept=apple] .match-hero{padding:32px}
[data-concept=fantasy] .match-hero,[data-concept=fantasy] .card{border-width:2px}[data-concept=fantasy] .status-pill:before{content:'🏆 ';}[data-concept=fantasy] .slot.filled{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 18%,var(--card)),var(--card))}[data-concept=data] .hint-stack{grid-template-columns:1fr}[data-concept=live] .match-hero{background:linear-gradient(160deg,#111827,#1f2937);color:white}[data-concept=live] .match-hero p,[data-concept=live] .micro-row span{color:#cbd5e1}[data-concept=live] .status-pill{background:#ef4444;color:white;border:0}[data-concept=toss] .card,[data-concept=toss] .mission-card,[data-concept=toss] .player-card{box-shadow:none}
@media (min-width:760px){.screen-wrap{padding:28px 22px 90px}.screen.active#home{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}.match-hero{grid-row:span 2}.mobile-board-sticky{top:76px}.mission-list{grid-template-columns:repeat(2,1fr)}.player-card{min-width:360px}.bottom-nav{left:50%;transform:translateX(-50%);max-width:560px;border:1px solid var(--line);border-radius:24px 24px 0 0}.action-bar{left:50%;right:auto;transform:translateX(-50%);width:520px}.sheet-panel{left:50%;right:auto;transform:translateX(-50%);width:min(560px,100%);border-radius:28px 28px 0 0}.screen.active#bingo{display:grid;grid-template-columns:400px 1fr;gap:16px;align-items:start}.screen.active#hero{max-width:980px;margin:0 auto}.selected-help{top:initial;grid-column:1/-1}}
@media (max-width:420px){.teams span{font-size:34px}.slot{min-height:88px;border-radius:16px}.mission-card{grid-template-columns:50px 1fr auto;padding:12px}.mission-icon{width:50px;height:50px}.player-card{min-width:88%}.page-head h1{font-size:26px}.hint-stack div{grid-template-columns:80px 1fr auto}.micro-row{gap:6px}.micro-row div{padding:10px 6px}}