:root {
  color-scheme: dark;
  --ink: #f8f4e8;
  --muted: #aeb6d4;
  --night: #080b18;
  --panel: rgba(19, 25, 56, .78);
  --panel-strong: #151d43;
  --gold: #f6c75b;
  --gold-soft: #ffe29a;
  --ruby: #df3656;
  --ruby-dark: #8f1737;
  --teal: #34d3b3;
  --line: rgba(255,255,255,.12);
  --shadow: 0 24px 80px rgba(0,0,0,.45);
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px;
  --font-display:"Bahnschrift Condensed","Arial Narrow","Segoe UI Variable Display",sans-serif;
  --font-body:"Segoe UI Variable Text","Aptos",ui-sans-serif,system-ui,sans-serif;
  font-family:var(--font-body);
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 50% 0%, #1c2860 0, var(--night) 48%, #050610 100%); color: var(--ink); overflow-x: hidden; }
button, input { font: inherit; }
button { cursor: pointer; }
.ambient { position: fixed; width: 42vw; height: 100vh; top: 0; opacity: .22; filter: blur(40px); pointer-events:none; }
.ambient-a { left: -18vw; background: linear-gradient(180deg, #3c6fff, transparent); }
.ambient-b { right: -18vw; background: linear-gradient(180deg, #c51d58, transparent); }
#app { min-height: 100vh; position: relative; z-index: 1; }
.shell { width: min(100%, 520px); min-height: 100vh; margin: 0 auto; padding: max(20px, env(safe-area-inset-top)) 18px max(24px, env(safe-area-inset-bottom)); display:flex; flex-direction:column; }
.brand { display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; }
.brand-mark { display:flex; align-items:center; gap:12px; font-weight:900; letter-spacing:.08em; }
.brand-gem { width:36px; height:36px; background:linear-gradient(145deg,var(--gold-soft),var(--gold)); clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%); box-shadow:0 0 30px rgba(246,199,91,.5); }
.eyebrow { color:var(--gold); font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
h1 { font-size:clamp(2.3rem,9vw,4rem); line-height:.96; margin:18px 0 14px; letter-spacing:-.055em; }
.lead { color:var(--muted); font-size:1.04rem; line-height:1.6; margin:0 0 28px; }
.hero { padding:20px 4px 28px; }
.spotline { height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); margin:10px 0 0; }
.mode-grid { display:grid; gap:12px; }
.mode-card { border:1px solid var(--line); border-radius:22px; padding:18px; color:var(--ink); text-align:left; background:linear-gradient(145deg,rgba(30,40,88,.86),rgba(15,20,48,.86)); box-shadow:var(--shadow); display:grid; grid-template-columns:1fr auto; gap:8px; align-items:center; }
.mode-card:hover { border-color:rgba(246,199,91,.55); transform:translateY(-1px); }
.mode-card h2 { margin:0; font-size:1.08rem; }
.mode-card p { margin:4px 0 0; color:var(--muted); font-size:.88rem; line-height:1.4; }
.mode-icon { width:48px; height:48px; border-radius:16px; display:grid; place-items:center; background:rgba(255,255,255,.08); color:var(--gold); font-weight:900; }
.secondary { margin-top:12px; border:1px solid var(--line); background:transparent; color:var(--muted); padding:14px; border-radius:16px; }
.footer-note { color:#707a9e; font-size:.75rem; line-height:1.5; margin-top:auto; padding-top:24px; }

/* Dört kesitli yayın açılışı */
.opening-sequence { position:fixed; inset:0; z-index:100; overflow:hidden; color:#fff8e9; background:#03040b; isolation:isolate; }
.opening-sequence::before { content:""; position:absolute; inset:-20%; z-index:-2; background:conic-gradient(from 210deg at 50% 55%,#070918,#172c70,#080914,#731431,#0a1027,#070918); animation:openingSpin 9s linear infinite; filter:blur(10px); }
.opening-grain { position:absolute; inset:0; z-index:30; opacity:.12; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); mix-blend-mode:soft-light; }
.opening-skip { position:absolute; z-index:50; top:max(18px,env(safe-area-inset-top)); right:18px; min-width:54px; min-height:44px; border:1px solid rgba(255,255,255,.2); border-radius:999px; color:#d8dbea; background:rgba(5,7,18,.54); font-size:.6rem; font-weight:900; letter-spacing:.14em; backdrop-filter:blur(8px); }
.opening-gate { position:absolute; inset:0; z-index:45; display:flex; flex-direction:column; align-items:center; justify-content:center; background:radial-gradient(circle at 50% 42%,rgba(31,52,120,.55),transparent 32%),rgba(3,4,11,.86); backdrop-filter:blur(12px); transition:opacity .45s,transform .45s; }
.opening-gate>small { color:#d7ba70;font-size:.64rem;font-weight:950;letter-spacing:.5em;transform:translateX(.25em) }
.gate-eclipse { width:min(52vw,250px); margin-bottom:8px; }
.opening-gate .gate-mark { width:100%; height:auto; }
.opening-gate .gate-mark .eclipse-shadow { animation:gateShadowTravel 3.2s .2s cubic-bezier(.22,.78,.18,1) both; }
.opening-gate .gate-title { margin:8px 0 0; font-family:var(--font-display); font-size:clamp(3.4rem,13vw,7.6rem); font-weight:900; line-height:.82; letter-spacing:-.035em; text-align:center; color:#f5e8c1; text-shadow:0 9px 35px rgba(0,0,0,.7); }
.gate-tagline { margin:13px 0 24px; color:#d7ba70; font-size:clamp(.65rem,2.1vw,.84rem); font-weight:850; letter-spacing:.22em; text-align:center; }
.opening-gate>button { min-width:210px; min-height:58px; border:1px solid #e4c36c; border-radius:4px; color:#201500; background:linear-gradient(135deg,#fff0b4,#d3a343); font-size:.72rem; font-weight:950; letter-spacing:.16em; box-shadow:0 18px 52px rgba(172,113,24,.3); }
.opening-gate>button i { display:inline-block;width:8px;height:8px;margin-right:9px;border-radius:50%;background:#971a38;box-shadow:0 0 12px #971a38;animation:onAir 1s infinite alternate}.opening-gate>em{margin-top:12px;color:#7883a5;font-size:.62rem;font-style:normal;letter-spacing:.12em;text-transform:uppercase}
.opening-gate.gate-leaving { opacity:0; transform:scale(1.06); }
.opening-sequence:not(.playing) .opening-scene,.opening-sequence:not(.playing) .opening-progress { animation-play-state:paused!important; }
.opening-scene { position:absolute; inset:0; display:grid; place-items:center; opacity:0; }
.opening-two { animation:sceneTwo 8.2s ease-in-out both; perspective:900px; }
.opening-letter-rain { position:absolute; inset:0; }
.opening-letter-rain i { position:absolute; color:rgba(255,245,217,.22); font-family:var(--font-display); font-size:clamp(2rem,8vw,7rem); font-style:normal; animation:letterFloat 2.4s ease-in-out infinite alternate; }
.opening-letter-rain i:nth-child(1){left:8%;top:18%}.opening-letter-rain i:nth-child(2){left:21%;bottom:12%;animation-delay:.2s}.opening-letter-rain i:nth-child(3){right:12%;top:9%;animation-delay:.4s}.opening-letter-rain i:nth-child(4){right:23%;bottom:13%;animation-delay:.6s}.opening-letter-rain i:nth-child(5){left:44%;top:7%;animation-delay:.8s}.opening-letter-rain i:nth-child(6){left:6%;bottom:42%;animation-delay:1s}.opening-letter-rain i:nth-child(7){right:5%;top:52%;animation-delay:1.2s}
.opening-tiles { position:relative; display:flex; gap:clamp(7px,2vw,15px); transform:rotateX(7deg); }
.opening-tiles b { width:clamp(80px,23vw,170px); aspect-ratio:.88; display:grid; place-items:center; clip-path:polygon(14% 0,86% 0,100% 16%,100% 84%,86% 100%,14% 100%,0 84%,0 16%); color:#101426; background:linear-gradient(145deg,#fffdf5,#cfd5e6); font-family:"Bahnschrift Condensed",var(--font-body); font-size:clamp(3rem,12vw,7rem); box-shadow:0 26px 70px rgba(0,0,0,.55); animation:openingTile .55s cubic-bezier(.2,.8,.2,1) both; }
.opening-tiles b:nth-child(2){animation-delay:1.65s}.opening-tiles b:nth-child(3){animation-delay:1.78s}
.opening-three { background:linear-gradient(180deg,rgba(5,7,18,.05),rgba(5,7,18,.5)),url("assets/studio-background.png") center/cover no-repeat; animation:sceneThree 8.2s ease-in-out both; }
.opening-curtain { position:absolute; top:0; bottom:0; width:52%; background:linear-gradient(90deg,#060816,#192d70 48%,#701331); box-shadow:0 0 80px rgba(0,0,0,.8); }
.opening-curtain.left { left:0; animation:curtainLeft 8.2s ease-in-out both; }.opening-curtain.right{right:0;transform:scaleX(-1);animation:curtainRight 8.2s ease-in-out both}
.opening-stage-copy { position:relative; z-index:2; display:grid; text-align:center; text-shadow:0 8px 30px #000; }
.opening-stage-copy small { color:#e2c676; font-size:.67rem; font-weight:950; letter-spacing:.45em; }.opening-stage-copy b{font-family:var(--font-display);font-size:clamp(3.5rem,13vw,9rem);font-weight:500;letter-spacing:-.06em}
.opening-four { background:radial-gradient(circle at 50% 42%,rgba(72,102,202,.5),transparent 34%),linear-gradient(180deg,#090e2a,#050611); animation:sceneFour 8.2s ease-in-out both; }
.opening-four::before,.opening-four::after { content:""; position:absolute; inset:-25% 43%; background:linear-gradient(180deg,rgba(255,237,174,.35),transparent 72%); filter:blur(14px); transform:rotate(26deg); }.opening-four::after{transform:rotate(-26deg)}
.opening-emblem { position:relative; z-index:2; display:grid; justify-items:center; text-align:center; }
.opening-emblem .brand-gem { width:72px;height:72px;margin-bottom:18px;background:linear-gradient(145deg,#fff0b8,#d6aa52 48%,#714a12);animation:emblemPulse 1.5s infinite alternate}
.opening-emblem small,.opening-emblem strong { font-family:"Bahnschrift Condensed",var(--font-body); letter-spacing:.18em; }.opening-emblem small{font-size:clamp(1.1rem,4vw,2rem)}.opening-emblem strong{color:#e2bd63;font-size:clamp(2.3rem,9vw,5rem)}.opening-emblem em{margin-top:16px;color:#9ba5c4;font-size:.7rem;font-style:normal;letter-spacing:.16em;text-transform:uppercase}
.opening-progress { position:absolute; z-index:40; left:0; right:0; bottom:0; height:3px; background:#d6aa52; transform-origin:left; animation:openingProgress 8.2s linear both; }
.opening-exit { animation:openingExit .42s ease-in both; }
.stage-wipe { position:fixed; inset:0; z-index:90; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; pointer-events:none; }
.stage-wipe>i { height:100%; background:linear-gradient(90deg,#060816,#192b69 70%,#7b1231); animation:wipePanel 1.15s ease-in-out both; }.stage-wipe>i:last-child{transform:scaleX(-1)}
.stage-wipe>div { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; opacity:0; animation:wipeTitle 1.15s ease both; }.stage-wipe .brand-gem{width:50px;height:50px}.stage-wipe b{color:#efd47f;font-size:.7rem;letter-spacing:.2em}
@keyframes openingSpin{to{transform:rotate(12deg) scale(1.08)}}
@keyframes gateShadowTravel{from{transform:translateX(0)}to{transform:translateX(96px)}}
@keyframes sceneTwo{0%{opacity:0;transform:scale(.96)}5%,28%{opacity:1;transform:scale(1)}36%,100%{opacity:0;transform:scale(1.04)}}
@keyframes sceneThree{0%,29%{opacity:0;transform:scale(1.1)}37%,62%{opacity:1;transform:scale(1)}70%,100%{opacity:0;transform:scale(.98)}}
@keyframes sceneFour{0%,63%{opacity:0;transform:scale(1.08)}72%,100%{opacity:1;transform:scale(1)}}
@keyframes letterFloat{to{transform:translateY(-22px) rotate(8deg);opacity:.5}}
@keyframes openingTile{from{opacity:0;transform:translateY(55px) rotateX(30deg) scale(.82)}}
@keyframes curtainLeft{0%,45%{transform:translateX(0)}56%,100%{transform:translateX(-102%)}}@keyframes curtainRight{0%,45%{transform:translateX(0) scaleX(-1)}56%,100%{transform:translateX(102%) scaleX(-1)}}
@keyframes emblemPulse{to{filter:drop-shadow(0 0 24px rgba(214,170,82,.7));transform:scale(1.04)}}
@keyframes openingProgress{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes openingExit{to{opacity:0;filter:blur(8px);transform:scale(1.025)}}
@keyframes wipePanel{0%{transform:scaleX(0)}45%,66%{transform:scaleX(1)}100%{transform:scaleX(0)}}@keyframes wipeTitle{0%,25%,80%,100%{opacity:0}45%,68%{opacity:1}}

/* Ana sayfa · premium yayın lobisi */
.shell:has(.home-page) { width:100%; max-width:none; padding:0; }
.home-page { --home-gold:#d6aa52; --home-cream:#f7efd9; --home-burgundy:#8b1434; width:100%; max-width:1180px; margin:0 auto; padding:18px clamp(18px,4vw,54px) 28px; overflow:hidden; }
.home-page::before { content:""; position:fixed; inset:0; z-index:-2; background:radial-gradient(circle at 72% 12%,rgba(46,75,158,.24),transparent 30%),radial-gradient(circle at 8% 34%,rgba(139,20,52,.2),transparent 28%),linear-gradient(180deg,#090d20 0%,#060815 72%,#04050c 100%); }
.home-page::after { content:""; position:fixed; inset:0; z-index:-1; opacity:.24; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(to bottom,#000,transparent 70%); }
.home-header { height:66px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(214,170,82,.2); }
.home-controls { display:flex; align-items:center; gap:12px; }
.audio-toggle { min-height:36px; padding:0 12px; border:1px solid rgba(214,170,82,.36); border-radius:999px; color:#ead89f; background:rgba(8,12,30,.72); font-size:.58rem; font-weight:900; letter-spacing:.08em; }
.home-header .brand-mark { color:var(--home-cream); text-decoration:none; font-family:"Bahnschrift Condensed",var(--font-body); font-size:.77rem; line-height:.9; letter-spacing:.14em; }
.home-header .brand-mark b { color:var(--home-gold); font-size:1.12rem; }
.home-page .brand-gem { position:relative; width:42px; height:42px; background:linear-gradient(145deg,#fff0b8 0%,#d6aa52 45%,#795319 100%); box-shadow:0 0 34px rgba(214,170,82,.3); }
.home-page .brand-gem::after { content:""; position:absolute; inset:4px; border:1px solid rgba(30,17,0,.45); clip-path:inherit; }
.home-page .brand-gem i { position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.7) 48%,transparent 58%); transform:translateX(-120%); animation:gemShine 5.5s 1.4s infinite; }
.on-air { display:flex; align-items:center; gap:8px; color:#b8bfd8; font-size:.65rem; font-weight:850; letter-spacing:.14em; }
.on-air i,.live-dot { width:8px; height:8px; border-radius:50%; background:#ff3e62; box-shadow:0 0 14px rgba(255,62,98,.85); animation:onAir 1.1s infinite alternate; }
.home-hero { min-height:590px; display:grid; grid-template-columns:minmax(0,1.02fr) minmax(350px,.98fr); align-items:center; gap:clamp(26px,5vw,72px); padding:clamp(48px,7vw,92px) 0 64px; }
.hero-copy { position:relative; z-index:2; }
.hero-copy .eyebrow { display:flex; align-items:center; gap:12px; font-size:.66rem; color:#e5ca85; }
.hero-copy .eyebrow::before { content:""; width:34px; height:1px; background:var(--home-gold); }
.hero-copy h1 { margin:20px 0 22px; font-family:var(--font-display); font-size:clamp(3.8rem,7vw,6.8rem); font-weight:500; line-height:.82; letter-spacing:-.065em; }
.hero-copy h1 em { color:transparent; font-style:italic; -webkit-text-stroke:1px rgba(247,239,217,.8); text-shadow:0 0 40px rgba(214,170,82,.14); }
.hero-copy .lead { max-width:590px; margin-bottom:26px; color:#b9c0d6; font-size:clamp(.98rem,1.4vw,1.13rem); }
.hero-actions { display:flex; align-items:stretch; gap:12px; flex-wrap:wrap; }
.hero-primary { min-height:64px; flex:1 1 270px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; padding:10px 16px; border:1px solid #f0cc76; border-radius:4px; color:#241600; text-align:left; background:linear-gradient(135deg,#f7e5ad,#d6aa52 62%,#a87826); box-shadow:0 14px 40px rgba(158,105,24,.22),inset 0 1px rgba(255,255,255,.5); transition:transform .2s ease,box-shadow .2s ease; }
.hero-primary .live-dot { background:#991c38; box-shadow:0 0 0 5px rgba(130,13,43,.12); }
.hero-primary b,.hero-primary small { display:block; }
.hero-primary b { font-size:.85rem; letter-spacing:.07em; }
.hero-primary small { margin-top:2px; opacity:.7; }
.hero-primary strong { font-size:1.4rem; }
.hero-primary:hover { transform:translateY(-3px); box-shadow:0 20px 45px rgba(158,105,24,.32); }
.hero-secondary { min-height:64px; flex:1 1 190px; padding:0 20px; border:1px solid rgba(255,255,255,.15); border-radius:4px; color:#d2d6e4; background:rgba(15,20,45,.62); transition:border-color .2s,background .2s; }
.hero-secondary:hover { border-color:rgba(214,170,82,.55); background:rgba(28,34,68,.82); }
.format-strip { display:flex; align-items:center; gap:14px; margin-top:28px; color:#c3c8da; }
.format-strip span { display:flex; align-items:baseline; gap:5px; }
.format-strip b { color:var(--home-cream); font-family:var(--font-display); font-size:1.25rem; }
.format-strip small { font-size:.58rem; letter-spacing:.08em; }
.format-strip i { width:3px; height:3px; border-radius:50%; background:var(--home-gold); }
.hero-stage { position:relative; min-height:480px; overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:40px 28px 38px; border:1px solid rgba(214,170,82,.38); border-radius:50% 50% 12px 12px / 14% 14% 12px 12px; background:linear-gradient(180deg,rgba(4,8,23,.05),rgba(4,6,18,.3) 48%,rgba(4,5,14,.92)),url("assets/studio-background.png") center/cover no-repeat; box-shadow:0 36px 90px rgba(0,0,0,.48),inset 0 0 60px rgba(7,11,34,.34); isolation:isolate; animation:stageReveal .8s .1s ease-out both; }
.hero-stage::after { content:""; position:absolute; inset:auto 8% 9px; height:50px; z-index:-1; border-radius:50%; background:radial-gradient(ellipse,rgba(214,170,82,.3),transparent 68%); filter:blur(10px); }
.stage-kicker { position:absolute; top:26px; padding:7px 15px; border:1px solid rgba(214,170,82,.45); color:#e7ce8f; background:rgba(5,8,21,.68); font-size:.57rem; font-weight:900; letter-spacing:.17em; }
.stage-beam { position:absolute; top:-20%; width:110px; height:95%; background:linear-gradient(180deg,rgba(255,238,180,.24),transparent 72%); filter:blur(8px); clip-path:polygon(45% 0,55% 0,100% 100%,0 100%); opacity:.62; }
.beam-a { left:5%; transform:rotate(-12deg); }.beam-b { right:5%; transform:rotate(12deg); }
.hero-tiles { display:flex; gap:7px; margin-bottom:18px; }
.hero-tiles span { width:62px; aspect-ratio:.84; display:grid; place-items:center; clip-path:polygon(15% 0,85% 0,100% 17%,100% 83%,85% 100%,15% 100%,0 83%,0 17%); color:#19162a; background:linear-gradient(150deg,#fffdf5,#d9d8d1); font-family:"Bahnschrift Condensed",var(--font-body); font-size:2rem; font-weight:900; box-shadow:0 9px 24px rgba(0,0,0,.35); animation:tileRise .55s ease-out both; }
.hero-tiles span:nth-child(2){animation-delay:.08s}.hero-tiles span:nth-child(3){animation-delay:.16s}
.mini-clue { width:100%; padding:15px 18px; border:1px solid #e1bd66; clip-path:polygon(3% 0,97% 0,100% 22%,100% 78%,97% 100%,3% 100%,0 78%,0 22%); text-align:center; background:linear-gradient(180deg,#981b3b,#5f0a22); box-shadow:0 14px 30px rgba(0,0,0,.38); }
.mini-clue small,.mini-clue b { display:block; }.mini-clue small{margin-bottom:5px;color:#f5d98f;font-size:.65rem}.mini-clue b{font-size:.82rem;line-height:1.35}
.hero-buzzer { position:relative; width:126px; height:76px; display:flex; align-items:flex-end; justify-content:center; margin-top:16px; }
.hero-buzzer::after { content:""; position:absolute; bottom:0; width:120px; height:25px; z-index:-1; background:linear-gradient(#596073,#12151f); border:1px solid #d4a846; clip-path:polygon(12% 0,88% 0,100% 55%,90% 100%,10% 100%,0 55%); }
.hero-buzzer i { position:absolute; top:1px; width:80px; height:47px; border:3px solid #f5a6b5; border-radius:55% 55% 42% 42%; background:radial-gradient(circle at 36% 18%,#ff8ca0,#dc2148 30%,#740a26 76%); box-shadow:0 0 24px rgba(255,35,75,.55); }
.hero-buzzer span { z-index:1; padding-bottom:3px; font-size:.54rem; font-weight:900; letter-spacing:.1em; }
.mode-section { padding:70px 0 76px; border-top:1px solid rgba(214,170,82,.22); }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:28px; }
.section-heading>div { display:flex; align-items:flex-start; gap:18px; }
.section-heading p,.profile-copy>p:first-of-type { margin:0 0 6px; color:#c8ab66; font-size:.62rem; font-weight:900; letter-spacing:.16em; }
.section-heading h2,.profile-copy h2 { margin:0; font-family:var(--font-display); font-size:clamp(1.85rem,4vw,3rem); font-weight:500; letter-spacing:-.035em; }
.section-heading>small { color:#7f89a8; }
.section-number { color:#59627f; font-family:var(--font-display); font-style:italic; font-size:1.1rem; }
.premium-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.premium-grid .mode-card { position:relative; min-height:184px; overflow:hidden; grid-template-columns:1fr auto; grid-template-rows:auto 1fr; align-items:start; padding:22px; border-radius:6px; background:linear-gradient(145deg,rgba(21,27,58,.95),rgba(10,14,33,.94)); box-shadow:0 18px 48px rgba(0,0,0,.2); transition:transform .22s ease,border-color .22s ease,background .22s ease; }
.premium-grid .mode-card::before { content:""; position:absolute; width:160px; height:160px; right:-80px; bottom:-90px; border:1px solid rgba(214,170,82,.12); transform:rotate(45deg); }
.premium-grid .mode-card:hover { transform:translateY(-4px); border-color:rgba(214,170,82,.62); background:linear-gradient(145deg,rgba(30,38,78,.98),rgba(12,16,38,.96)); }
.premium-grid .live-card { border-color:rgba(214,170,82,.6); background:linear-gradient(135deg,rgba(121,18,51,.88),rgba(35,17,52,.97)); }
.premium-grid .category-card { border-color:rgba(92,156,255,.5); background:linear-gradient(145deg,rgba(17,43,78,.96),rgba(13,20,45,.96)); }
.premium-grid .live-card::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(105deg,transparent 30%,rgba(255,236,179,.08),transparent 70%); transform:translateX(-100%); animation:cardSweep 5s 2s infinite; }
.premium-grid .card-index { color:#d8ba72; font-size:.58rem; font-weight:950; letter-spacing:.16em; }
.premium-grid .mode-card>div { align-self:end; }
.premium-grid .mode-card h3 { margin:23px 0 8px; font-family:var(--font-display); font-size:1.55rem; font-weight:500; }
.premium-grid .mode-card p { max-width:390px; min-height:42px; margin:0; color:#aeb6cf; font-size:.85rem; line-height:1.5; }
.card-meta { display:block; margin-top:18px; color:#747f9f; font-size:.57rem; font-weight:900; letter-spacing:.1em; }
.mode-arrow { grid-column:2; grid-row:1 / 3; align-self:center; width:44px; height:44px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.14); border-radius:50%; color:#f1d68f; font-size:1.1rem; transition:transform .2s,background .2s; }
.mode-card:hover .mode-arrow { transform:rotate(8deg) scale(1.06); background:rgba(214,170,82,.12); }
.category-lobby { width:min(1180px,calc(100% - 28px)); margin:26px auto 70px; }
.category-lobby h1 { margin:12px 0; font-family:var(--font-display); font-size:clamp(2.3rem,7vw,5.7rem); font-weight:500; line-height:.9; }
.category-lobby>.lead { max-width:760px; }
.category-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:28px; }
.category-choice { min-height:116px; padding:17px; border:1px solid var(--line); border-radius:8px; color:var(--ink); text-align:left; background:linear-gradient(145deg,rgba(25,34,72,.94),rgba(9,14,34,.96)); display:grid; gap:8px; transition:.2s ease; }
.category-choice:not(:disabled):hover { transform:translateY(-3px); border-color:rgba(214,170,82,.65); }
.category-choice span { font-family:var(--font-display); font-size:1.22rem; }
.category-choice small { color:var(--muted); font-size:.63rem; letter-spacing:.1em; }
.category-choice b { color:var(--gold); font-size:.68rem; letter-spacing:.12em; }
.category-choice:disabled { opacity:.55; cursor:not-allowed; }
.profile-section { display:grid; grid-template-columns:1fr minmax(320px,.8fr); gap:60px; align-items:center; padding:74px clamp(0px,4vw,45px); border:1px solid rgba(214,170,82,.21); border-left:0;border-right:0; background:linear-gradient(90deg,rgba(15,21,50,.32),rgba(92,12,40,.11),rgba(15,21,50,.32)); }
.profile-copy>p:last-child { max-width:470px; margin:17px 0 0; color:#98a2bf; line-height:1.65; }
.contestant-ticket { position:relative; overflow:hidden; padding:12px; border:1px solid rgba(214,170,82,.38); border-radius:7px; background:linear-gradient(145deg,#161d42,#0b0f25); box-shadow:0 24px 60px rgba(0,0,0,.3); }
.ticket-glow { position:absolute; width:150px; height:150px; right:-55px; top:-65px; border-radius:50%; background:rgba(139,20,52,.35); filter:blur(35px); }
.contestant-ticket .photo-control { position:relative; z-index:1; margin:0; padding:12px; border:0; border-radius:4px; background:rgba(255,255,255,.025); }
.contestant-ticket .photo-preview { width:70px; height:70px; border-radius:5px; border:1px solid var(--home-gold); }
.contestant-ticket .photo-control small,.contestant-ticket .photo-control b,.contestant-ticket .photo-control em { display:block; }
.contestant-ticket .photo-control small { color:#858eaa; font-size:.55rem; letter-spacing:.14em; }
.contestant-ticket .photo-control b { margin-top:4px; font-family:var(--font-display); font-size:1.3rem; font-weight:500; }
.contestant-ticket .photo-control em { margin-top:4px; color:#c4a75f; font-size:.68rem; font-style:normal; }
.contestant-ticket .photo-control>strong { margin-left:auto; color:#d9bc72; font-size:1.5rem; font-weight:300; }
.ticket-stats { display:grid; grid-template-columns:1fr 1fr; gap:1px; margin-top:1px; background:rgba(255,255,255,.08); }
.ticket-stats span { padding:12px 14px; background:#0f142e; }.ticket-stats small,.ticket-stats b{display:block}.ticket-stats small{color:#717b9b;font-size:.52rem;letter-spacing:.12em}.ticket-stats b{margin-top:2px;font-size:1.05rem}
.ticket-name { width:100%; min-height:46px; display:flex; align-items:center; justify-content:space-between; padding:0 14px; border:0; color:#b9c1d8; background:transparent; font-size:.77rem; }
.ticket-name:hover { color:#f2d88f; background:rgba(255,255,255,.03); }
.home-footer { min-height:100px; display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:30px; color:#626b88; font-size:.65rem; }
.brand-mark.compact { gap:9px; color:#b9bfd1; font-size:.65rem; }.brand-mark.compact .brand-gem{width:24px;height:24px}.home-footer p{margin:0}.home-footer>span{letter-spacing:.1em}
.home-page button:focus-visible,.home-page a:focus-visible,.home-page label:focus-within { outline:3px solid rgba(255,226,154,.7); outline-offset:3px; }
@keyframes onAir { to { opacity:.38; } }
@keyframes gemShine { 0%,72%{transform:translateX(-120%)}88%,100%{transform:translateX(120%)} }
@keyframes stageReveal { from{opacity:0;transform:translateY(18px) scale(.98)} }
@keyframes tileRise { from{opacity:0;transform:translateY(16px)} }
@keyframes cardSweep { 0%,62%{transform:translateX(-100%)}82%,100%{transform:translateX(100%)} }

@media (max-width:800px) {
  .home-page { padding-inline:16px; }
  .home-hero { min-height:auto; grid-template-columns:1fr; padding:46px 0 54px; gap:34px; }
  .hero-copy h1 { font-size:clamp(3.5rem,16vw,5.5rem); }
  .hero-stage { min-height:390px; width:min(100%,500px); justify-self:center; }
  .premium-grid { grid-template-columns:1fr; }
  .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .premium-grid .mode-card { min-height:164px; }
  .profile-section { grid-template-columns:1fr; gap:28px; padding:54px 2px; }
  .home-footer { grid-template-columns:1fr auto; padding:22px 0; }.home-footer p{display:none}
}
@media (max-width:480px) {
  .home-header { height:58px; }
  .home-page .brand-gem { width:36px;height:36px; }
  .hero-copy h1 { font-size:3.55rem; line-height:.86; }
  .hero-copy .lead { font-size:.95rem; }
  .hero-primary,.hero-secondary { flex-basis:100%; }
  .format-strip { justify-content:space-between; gap:6px; }.format-strip i{display:none}
  .hero-stage { min-height:350px; padding-inline:18px; }.hero-tiles span{width:54px}
  .section-heading>small { display:none; }.section-heading>div{gap:11px}
  .premium-grid .mode-card { min-height:158px; padding:18px; }
  .premium-grid .mode-card h3 { font-size:1.38rem; margin-top:17px; }
  .category-grid { grid-template-columns:1fr; }
  .home-footer>span { font-size:.55rem; }
}
@media (prefers-reduced-motion:reduce) {
  .home-page * { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; }
}
.live-card { border-color:rgba(52,211,179,.42); background:linear-gradient(145deg,rgba(22,65,78,.92),rgba(15,20,48,.9)); }
.live-card .mode-icon { color:#65f0d3; box-shadow:inset 0 0 0 1px rgba(101,240,211,.2); }
.live-lobby { padding:30px 2px; }
.join-divider { display:flex; align-items:center; gap:12px; margin:24px 0 14px; color:#7781a5; font-size:.68rem; font-weight:850; letter-spacing:.12em; }
.join-divider::before,.join-divider::after { content:""; height:1px; flex:1; background:var(--line); }
.join-form { display:grid; grid-template-columns:1fr auto; gap:8px; }
.join-form input { min-width:0; padding:15px; border:1px solid var(--line); border-radius:16px; color:white; background:#0d122b; text-transform:uppercase; letter-spacing:.16em; font-weight:900; outline:none; }
.join-form input:focus { border-color:var(--gold); }
.join-form button { padding:0 20px; border:0; border-radius:16px; color:#15100a; background:var(--gold); font-weight:950; }
.lobby-message { min-height:24px; padding-top:12px; color:#ff8ba0; text-align:center; font-size:.82rem; }
.waiting-room { display:flex; flex:1; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.room-code { margin:18px 0 24px; padding:18px 26px; border:1px solid rgba(246,199,91,.5); border-radius:22px; color:#ffe29a; background:rgba(20,26,59,.86); font-size:clamp(2.6rem,13vw,4.5rem); line-height:1; font-weight:950; letter-spacing:.14em; box-shadow:var(--shadow); }
.waiting-pulse { display:flex; align-items:center; gap:9px; color:var(--muted); }
.waiting-pulse i { width:10px; height:10px; border-radius:50%; background:var(--teal); box-shadow:0 0 16px var(--teal); animation:pulse .8s infinite alternate; }
.result-name { font-size:clamp(2.5rem,12vw,4.5rem); }
.photo-control { margin-top:14px; border:1px solid rgba(246,199,91,.28); background:rgba(15,20,48,.78); border-radius:18px; padding:11px 14px; display:flex; align-items:center; gap:12px; cursor:pointer; }
.photo-control input { position:absolute; opacity:0; pointer-events:none; }
.photo-control b, .photo-control small { display:block; }
.photo-control small { color:var(--muted); margin-top:3px; }
.photo-preview { width:48px; height:48px; border-radius:50%; overflow:hidden; display:grid; place-items:center; background:linear-gradient(145deg,#384987,#172044); border:2px solid var(--gold); flex:0 0 auto; }
.photo-preview img { width:100%; height:100%; object-fit:cover; }
.portrait-initial { width:100%; height:100%; display:grid; place-items:center; font-weight:950; font-size:2rem; color:var(--gold-soft); background:linear-gradient(145deg,#344885,#141b3d); }
.portrait-initial.home { font-size:1.25rem; }
.salutation-setting { margin-top:12px; padding-top:12px; border-top:1px solid rgba(246,199,91,.18); }
.salutation-setting>span { display:block; margin-bottom:8px; color:var(--muted); font-size:.58rem; font-weight:900; letter-spacing:.12em; }
.salutation-setting>div { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.salutation-setting button { min-height:34px; padding:6px 8px; border:1px solid var(--line); border-radius:10px; color:#cbd2e8; background:rgba(7,11,29,.66); font-size:.7rem; font-weight:850; }
.salutation-setting button.active { border-color:rgba(246,199,91,.72); color:#241500; background:linear-gradient(180deg,#ffe8a5,#d9aa42); }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.icon-btn { border:1px solid var(--line); background:rgba(255,255,255,.05); color:var(--ink); border-radius:14px; width:44px; height:44px; }
.round-pill { border:1px solid var(--line); background:rgba(255,255,255,.06); padding:9px 13px; border-radius:999px; color:var(--muted); font-size:.82rem; }
.duel-board { display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:center; margin-bottom:14px; }
.player { border:1px solid var(--line); background:var(--panel); border-radius:18px; padding:12px; }
.player.right { text-align:right; }
.player-name { color:var(--muted); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; }
.player-score { font-size:1.65rem; font-weight:900; font-variant-numeric:tabular-nums; }
.timer { min-width:76px; text-align:center; color:var(--gold); font-size:1.35rem; font-weight:900; font-variant-numeric:tabular-nums; }
.timer.danger { color:#ff5978; animation:pulse .75s infinite alternate; }
@keyframes pulse { to { opacity:.55; transform:scale(.98); } }
.stage { position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.14); border-radius:28px; padding:22px 16px 20px; background:linear-gradient(180deg,rgba(30,43,96,.94),rgba(12,16,38,.97)); box-shadow:var(--shadow); }
.stage::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(100deg,transparent 0 38px,rgba(103,142,255,.07) 39px 42px); pointer-events:none; }
.question-meta { position:relative; display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:18px; }
.category { color:var(--gold); font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.12em; }
.value { font-weight:900; color:var(--gold-soft); }
.clue { position:relative; min-height:108px; display:grid; place-items:center; text-align:center; font-size:clamp(1.08rem,4.6vw,1.4rem); line-height:1.45; font-weight:700; padding:8px 8px 18px; }
.tiles { position:relative; display:flex; justify-content:center; gap:5px; flex-wrap:nowrap; margin:10px 0 20px; }
.tile { width:clamp(28px,8vw,41px); aspect-ratio:.86; display:grid; place-items:center; color:#11162c; background:linear-gradient(160deg,#fffdf4,#d9e0f2); font-size:clamp(1rem,5vw,1.45rem); font-weight:950; clip-path:polygon(16% 0,84% 0,100% 18%,100% 82%,84% 100%,16% 100%,0 82%,0 18%); filter:drop-shadow(0 8px 9px rgba(0,0,0,.3)); }
.tile.hidden { color:transparent; background:linear-gradient(160deg,#52608e,#27315c); }
.tile.revealed { color:#4e2b00; background:linear-gradient(160deg,#fff1b8,#e9b73e); }
.status { position:relative; min-height:44px; display:grid; place-items:center; text-align:center; color:var(--muted); font-size:.88rem; }
.actions { display:grid; grid-template-columns:1fr 1.55fr; gap:12px; margin-top:16px; }
.action { border:0; min-height:58px; border-radius:18px; font-weight:900; letter-spacing:.04em; }
.letter-btn { color:#211600; background:linear-gradient(150deg,#ffe59d,#e9b43b); }
.letter-btn:disabled, .buzz-btn:disabled { filter:saturate(.2); opacity:.45; cursor:not-allowed; }
.buzz-btn { color:white; background:linear-gradient(160deg,#ff476a,#9f1538); box-shadow:0 12px 32px rgba(223,54,86,.32), inset 0 1px 0 rgba(255,255,255,.35); font-size:1.05rem; }
.buzz-btn:active { transform:translateY(3px) scale(.985); box-shadow:0 4px 12px rgba(223,54,86,.3); }
.answer-panel { margin-top:14px; border:1px solid rgba(246,199,91,.28); background:rgba(4,6,16,.8); border-radius:20px; padding:14px; }
.answer-head { display:flex; justify-content:space-between; margin-bottom:10px; font-size:.82rem; color:var(--muted); }
.answer-time { color:var(--gold); font-weight:900; font-variant-numeric:tabular-nums; }
.answer-row { display:grid; grid-template-columns:1fr auto; gap:8px; }
.answer-row input { width:100%; min-width:0; border:1px solid var(--line); background:#0d122b; color:white; border-radius:14px; padding:14px; text-transform:uppercase; outline:none; }
.answer-row input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(246,199,91,.12); }
.submit { border:0; border-radius:14px; padding:0 18px; font-weight:900; color:#142219; background:var(--teal); }
.answer-feedback { min-height:20px; margin-top:9px; color:var(--muted); font-size:.78rem; text-align:center; }
.answer-feedback.retry { color:#ff8ba0; font-weight:750; }
.presenter-nudge { position:fixed; z-index:60; left:50%; bottom:max(18px,env(safe-area-inset-bottom)); width:min(calc(100% - 24px),480px); min-height:96px; display:grid; grid-template-columns:74px 1fr; align-items:end; gap:8px; padding:9px 14px 10px 3px; border:1px solid rgba(246,199,91,.58); border-radius:8px; color:white; background:linear-gradient(105deg,rgba(8,12,32,.98),rgba(104,12,43,.97)); box-shadow:0 22px 65px rgba(0,0,0,.72); transform:translateX(-50%); animation:nudgeIn .34s cubic-bezier(.2,.8,.2,1) both; }
.presenter-nudge img { width:74px; max-height:94px; object-fit:contain; object-position:bottom; animation:presenterTalk .8s ease-in-out infinite alternate; }
.presenter-nudge small { color:#f0cb72; font-size:.56rem; font-weight:950; letter-spacing:.12em; }.presenter-nudge p{margin:5px 0 3px;font-size:.82rem;line-height:1.35;font-weight:700}.presenter-nudge.leaving{animation:nudgeOut .42s ease-in both}
@keyframes nudgeIn{from{opacity:0;transform:translate(-50%,24px) scale(.97)}}@keyframes nudgeOut{to{opacity:0;transform:translate(-50%,18px) scale(.98)}}
.flash { position:fixed; inset:0; z-index:10; display:grid; place-items:center; background:rgba(5,7,18,.82); backdrop-filter:blur(10px); animation:fadeIn .15s ease-out; }
.flash-card { width:min(86vw,420px); text-align:center; border:1px solid var(--line); background:#111735; border-radius:28px; padding:30px 24px; box-shadow:var(--shadow); }
.flash-card strong { display:block; font-size:2rem; margin-bottom:8px; }
.correct strong { color:var(--teal); }
.wrong strong { color:#ff5b7a; }
.result { text-align:center; padding-top:28px; }
.result-score { font-size:4.5rem; line-height:1; font-weight:950; color:var(--gold); margin:22px 0 8px; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin:24px 0; }
.stat { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:14px 8px; }
.stat strong { display:block; font-size:1.3rem; }
.stat span { color:var(--muted); font-size:.72rem; }
.primary-wide { width:100%; border:0; border-radius:18px; padding:17px; font-weight:900; color:#171200; background:linear-gradient(145deg,var(--gold-soft),var(--gold)); margin-top:10px; }
.history { margin-top:20px; text-align:left; }
.history-row { display:grid; grid-template-columns:1fr auto; gap:10px; border-bottom:1px solid var(--line); padding:12px 2px; }
.history-row small { color:var(--muted); display:block; margin-top:3px; }
.good { color:var(--teal); }
.bad { color:#ff6c86; }

/* Televizyon stüdyosu ana oyun ekranı */
.shell:has(.studio-screen) { width:min(100%,580px); padding:0; background:#050713; }
.studio-screen { position:relative; min-height:100dvh; overflow:hidden; isolation:isolate; background:#080b18 url("assets/studio-background.png") center top / cover no-repeat; padding:max(12px,env(safe-area-inset-top)) 12px max(16px,env(safe-area-inset-bottom)); display:flex; flex-direction:column; animation:studioBreathe 16s ease-in-out infinite alternate; }
.studio-screen::before { content:""; position:absolute; z-index:-1; top:-25%; bottom:15%; left:36%; width:24%; background:linear-gradient(180deg,rgba(255,239,184,.18),transparent 76%); clip-path:polygon(46% 0,54% 0,100% 100%,0 100%); filter:blur(12px); animation:studioBeam 9s ease-in-out infinite alternate; pointer-events:none; }
.studio-screen::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(2,4,15,.04) 0%,rgba(2,4,15,.04) 34%,rgba(2,4,15,.42) 55%,rgba(2,4,15,.9) 100%); }
.studio-screen.question-reading { animation:cameraPush 4.8s cubic-bezier(.2,.72,.2,1) both; }
.studio-topbar { height:40px; display:grid; grid-template-columns:44px 1fr auto; align-items:center; gap:8px; position:relative; z-index:5; padding-right:38px; }
.studio-audio { position:absolute; right:0; width:34px; min-width:34px; min-height:34px; padding:0; display:grid; place-items:center; border-radius:50%; letter-spacing:0; }
.studio-mode,.studio-round { font-size:.7rem; letter-spacing:.12em; font-weight:900; color:#f8e2a4; text-shadow:0 2px 8px #000; }
.studio-mode { text-align:center; }
.studio-round { border:1px solid rgba(255,229,157,.45); padding:7px 9px; background:rgba(10,13,34,.72); clip-path:polygon(10% 0,90% 0,100% 25%,100% 75%,90% 100%,10% 100%,0 75%,0 25%); }
.studio-brand { align-self:center; margin:2px 0 0; border:1px solid rgba(246,199,91,.56); color:#ffe8a8; padding:7px 18px; font-size:.78rem; letter-spacing:.13em; font-weight:950; background:rgba(7,10,27,.72); clip-path:polygon(9% 0,91% 0,100% 50%,91% 100%,9% 100%,0 50%); position:relative; z-index:4; }
.studio-cast { position:relative; height:176px; margin-top:-4px; flex:0 0 auto; }
.compact-cast { display:flex; align-items:flex-end; justify-content:space-between; padding:0 13px 8px; }
.presenter { position:absolute; z-index:2; height:205px; width:auto; left:50%; bottom:0; transform:translateX(-50%); filter:drop-shadow(0 12px 18px rgba(0,0,0,.65)); transition:filter .25s,opacity .25s,transform .25s; }
.contestant { position:absolute; z-index:3; width:38%; bottom:2px; display:flex; flex-direction:column; align-items:center; transition:filter .22s,opacity .22s,transform .22s; }
.player-one { left:-1%; }
.player-two { right:-1%; }
.compact-cast .player-one { left:auto; bottom:0; width:auto; }
.opponent-chip { align-self:flex-end; min-width:128px; margin-bottom:16px; text-align:center; filter:drop-shadow(0 8px 10px rgba(0,0,0,.5)); }
.opponent-chip small,.opponent-chip strong { display:block; clip-path:polygon(8% 0,92% 0,100% 50%,92% 100%,8% 100%,0 50%); }
.opponent-chip small { padding:7px 14px 4px; color:#18101b; background:linear-gradient(180deg,#fff3c5,#d9ae50); font-size:.6rem; font-weight:950; }
.opponent-chip strong { padding:5px 14px 8px; color:white; background:linear-gradient(180deg,#263b7a,#111a41); font-size:1.35rem; }
.portrait-wrap { width:112px; height:144px; overflow:hidden; background:linear-gradient(180deg,transparent 0%,#151c43 100%); border-radius:48% 48% 14px 14px; border:1px solid rgba(255,226,154,.5); box-shadow:0 0 0 4px rgba(13,19,48,.42),0 12px 25px rgba(0,0,0,.48); mask-image:linear-gradient(to bottom,#000 82%,transparent 100%); }
.portrait-wrap img { width:100%; height:100%; object-fit:cover; object-position:center 28%; }
.portrait-wrap.rival .portrait-initial { font-size:3.4rem; background:linear-gradient(145deg,#65314f,#19234a); }
.score-plate { min-width:112px; margin-top:-12px; text-align:center; filter:drop-shadow(0 7px 7px rgba(0,0,0,.45)); }
.score-plate small,.score-plate strong { display:block; clip-path:polygon(9% 0,91% 0,100% 50%,91% 100%,9% 100%,0 50%); }
.score-plate small { color:#15101a; background:linear-gradient(180deg,#fff5cb,#e6bd5c); padding:5px 12px 3px; font-size:.58rem; font-weight:950; letter-spacing:.05em; white-space:nowrap; }
.score-plate strong { color:white; background:linear-gradient(180deg,#a7173a,#650b25); padding:3px 12px 6px; font-size:1.25rem; }
.broadcast-ui { position:relative; z-index:4; display:flex; flex-direction:column; align-items:stretch; margin-top:-8px; }
.studio-screen .question-meta { margin:0 10px 5px; }
.studio-screen .question-meta.score-only { justify-content:flex-end; }
.studio-screen .category { background:rgba(9,13,34,.86); padding:5px 11px; border:1px solid rgba(246,199,91,.35); }
.studio-screen .value { padding:6px 14px; color:#301405; background:linear-gradient(180deg,#fff3c7,#dfb24f); clip-path:polygon(8% 0,92% 0,100% 50%,92% 100%,8% 100%,0 50%); }
.studio-screen .tiles { margin:0 2px 12px; gap:3px; min-height:43px; }
.studio-screen .tile { width:clamp(25px,7.7vw,41px); font-size:clamp(.82rem,4vw,1.35rem); border:1px solid rgba(12,17,39,.65); }
.studio-screen .tile.hidden { color:#27304c; background:linear-gradient(160deg,#fffdf4,#d9e0f2); }
.question-band { position:relative; margin:8px 2px 0; min-height:82px; padding:20px 18px 13px; display:grid; place-items:center; text-align:center; background:linear-gradient(180deg,#a61235,#650820); border:2px solid #f7dda0; clip-path:polygon(3% 0,97% 0,100% 18%,100% 82%,97% 100%,3% 100%,0 82%,0 18%); box-shadow:0 10px 28px rgba(0,0,0,.5),inset 0 1px rgba(255,255,255,.28); }
.question-band::after { content:""; position:absolute; inset:4px; border:1px solid rgba(255,255,255,.13); clip-path:inherit; pointer-events:none; }
.question-band p { position:relative; z-index:1; margin:0; color:white; font-size:clamp(.92rem,4vw,1.15rem); font-weight:750; line-height:1.35; }
.question-hint { display:block; margin-bottom:5px; color:#ffe4a0; font-size:.72rem; font-weight:900; letter-spacing:.045em; }
.tdk-source { align-self:flex-end; margin:4px 8px 0; color:#aab5d7; font-size:.61rem; text-decoration:none; }
.tdk-source:hover { color:#ffe29a; }
.broadcast-clock { position:absolute; z-index:2; top:-16px; left:16px; min-width:82px; padding:5px 15px; color:#48091a; background:#fff8dc; border:2px solid #ddb969; font-weight:950; font-size:1.1rem; transform:skewX(-10deg); box-shadow:0 5px 12px rgba(0,0,0,.35); }
.broadcast-clock.danger { color:#b20b34; animation:pulse .75s infinite alternate; }
.broadcast-status { min-height:38px; margin-top:7px; padding:7px 11px; color:#ffe8a8; font-size:.75rem; font-weight:800; letter-spacing:.025em; background:linear-gradient(90deg,transparent,rgba(9,12,31,.92) 15%,rgba(9,12,31,.92) 85%,transparent); }
.studio-actions { display:grid; grid-template-columns:72px 86px 1fr; align-items:end; justify-items:center; gap:9px; margin:0 auto; width:min(100%,410px); }
.hint-control { align-self:center; width:70px; min-height:58px; padding:6px 3px; display:grid; place-items:center; gap:1px; border:1px solid rgba(255,227,143,.72); border-radius:9px; color:#fff0b4; background:linear-gradient(180deg,#3d2d67,#171530); box-shadow:0 8px 20px rgba(0,0,0,.3); }
.hint-control span { font-size:1rem; }.hint-control b{font-size:.62rem;letter-spacing:.06em}.hint-control small{font-size:.43rem;color:#b8a8da;letter-spacing:.1em}.hint-control:disabled{opacity:.38;filter:grayscale(.6)}
.tile.rewarded { box-shadow:0 0 0 2px #ffe58d,0 0 22px rgba(255,220,99,.65); }
.letter-control { align-self:center; width:88px; min-height:48px; border:2px solid #f3d78e; color:#3a1700; background:linear-gradient(180deg,#fff4bd,#dba43d); font-weight:950; clip-path:polygon(10% 0,90% 0,100% 50%,90% 100%,10% 100%,0 50%); }
.letter-control b { margin-left:4px; }
.letter-control:disabled { opacity:.42; filter:grayscale(.6); }
.physical-buzzer { position:relative; width:178px; height:100px; border:0; color:white; background:transparent; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:0 0 3px; filter:drop-shadow(0 15px 18px rgba(0,0,0,.65)); }
.physical-buzzer::after { content:""; position:absolute; z-index:-1; bottom:0; width:150px; height:35px; border:2px solid #f4c760; background:linear-gradient(180deg,#5e6578,#151823); clip-path:polygon(12% 0,88% 0,100% 55%,90% 100%,10% 100%,0 55%); }
.physical-buzzer span { position:absolute; top:4px; width:105px; height:62px; border-radius:55% 55% 42% 42%; background:radial-gradient(circle at 38% 20%,#ff9aab 0 5%,#ff2d55 18%,#ae0f32 62%,#520617 100%); border:4px solid #f5b0bc; box-shadow:0 0 28px rgba(255,36,76,.64),inset 0 -10px 18px rgba(55,0,10,.7); transition:transform .08s,filter .2s; }
.physical-buzzer b { position:relative; z-index:2; font-size:.69rem; letter-spacing:.1em; text-shadow:0 2px 4px #000; }
.physical-buzzer:active span { transform:translateY(8px) scaleY(.85); }
.physical-buzzer:disabled { opacity:.82; filter:saturate(.6) brightness(.82); }
.studio-screen.player-active .player-one { transform:scale(1.06); filter:drop-shadow(0 0 20px rgba(255,204,85,.85)); }
.studio-screen.player-active .opponent-chip { opacity:.48; filter:saturate(.45) brightness(.68); }
.studio-screen.rival-active .opponent-chip { transform:scale(1.06); filter:drop-shadow(0 0 20px rgba(80,156,255,.9)); }
.studio-screen.rival-active .player-one { opacity:.55; filter:saturate(.4) brightness(.67); }
.presenter-moment { position:absolute; z-index:20; left:12px; right:12px; top:58px; min-height:190px; display:grid; grid-template-columns:142px 1fr; align-items:end; gap:10px; padding:14px 18px 14px 4px; border:1px solid rgba(246,199,91,.55); border-radius:8px; background:linear-gradient(100deg,rgba(7,11,31,.97),rgba(86,12,40,.96)); box-shadow:0 22px 70px rgba(0,0,0,.68); animation:presenterIn .38s ease-out both; overflow:hidden; }
.presenter-moment::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(105deg,transparent 28%,rgba(255,232,166,.08) 46%,transparent 62%); animation:presenterSweep 2.8s linear infinite; }
.presenter-moment img { width:142px; max-height:190px; object-fit:contain; object-position:bottom; transform-origin:bottom center; }
.presenter-moment.speaking img { animation:presenterTalk 1.2s ease-in-out infinite alternate; }
.presenter-moment small { color:#f6c75b; font-weight:950; letter-spacing:.12em; }
.presenter-moment p { margin:7px 0 8px; color:white; font-family:var(--font-display); font-size:clamp(.95rem,3.7vw,1.18rem); line-height:1.38; font-weight:500; }
.voice-wave { height:17px; display:flex; align-items:center; gap:3px; }.voice-wave i{width:3px;height:5px;border-radius:4px;background:#f6c75b;animation:voiceBar .58s ease-in-out infinite alternate}.voice-wave i:nth-child(2){animation-delay:.1s}.voice-wave i:nth-child(3){animation-delay:.2s}.voice-wave i:nth-child(4){animation-delay:.3s}.voice-wave i:nth-child(5){animation-delay:.4s}
.presenter-moment.leaving { animation:presenterOut .45s ease-in both; }
.rewarded-ad { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:20px; background:rgba(2,4,13,.9); backdrop-filter:blur(10px); animation:presenterIn .25s ease-out both; }
.rewarded-ad.leaving { animation:nudgeOut .25s ease-in both; }
.rewarded-card { width:min(100%,390px); padding:32px 24px; border:1px solid rgba(246,199,91,.62); border-radius:12px; text-align:center; background:linear-gradient(145deg,#18204a,#650d2a); box-shadow:0 28px 90px rgba(0,0,0,.72); }
.rewarded-card small,.rewarded-card strong,.rewarded-card p{display:block}.rewarded-card small{color:#f2cb6d;font-weight:900;letter-spacing:.13em}.rewarded-card strong{margin:14px 0 8px;font-family:var(--font-display);font-size:1.7rem}.rewarded-card p{color:#bbc3da;line-height:1.5}.rewarded-card span{width:54px;height:54px;margin:18px auto 0;display:grid;place-items:center;border:1px solid #f2cb6d;border-radius:50%;font-size:1.5rem;font-weight:900}
@keyframes presenterIn { from { opacity:0; transform:translateY(-16px); } }
@keyframes presenterOut { to { opacity:0; transform:translateY(-12px); } }
@keyframes presenterTalk { to { transform:translateY(2px) scale(1.012); filter:brightness(1.06); } }
@keyframes presenterSweep { from{transform:translateX(-120%)}to{transform:translateX(120%)} }
@keyframes voiceBar { to { height:16px; } }
@keyframes studioBreathe { from{background-position:48% top}to{background-position:52% 2%} }
@keyframes studioBeam { to{transform:translateX(62%) rotate(5deg);opacity:.45} }
@keyframes cameraPush { from{background-size:auto 112%;background-position:center top}to{background-size:auto 126%;background-position:46% 4%} }
.studio-screen .answer-panel { margin:5px 3px 0; }
.studio-screen .answer-row input { padding:11px; }
.studio-screen .submit { padding:0 13px; }
@keyframes fadeIn { from { opacity:0; } }
@media (min-width: 760px) {
  .shell { width:min(100%,760px); }
  .mode-grid { grid-template-columns:1fr 1fr; }
  .mode-card:first-child { grid-column:1 / -1; }
}
@media (max-height:760px) {
  .studio-cast { height:156px; }
  .presenter { height:165px; }
  .portrait-wrap { width:94px; height:116px; }
  .score-plate { min-width:96px; }
  .question-band { min-height:70px; }
  .physical-buzzer { height:88px; }
}
@media (max-width:430px) {
  .presenter-moment { grid-template-columns:108px 1fr; min-height:162px; padding-right:12px; }
  .presenter-moment img { width:108px; max-height:158px; }
}

/* Akıl Tutulması yayın kimliği */
.eclipse-mark { width:52px; height:52px; overflow:visible; flex:0 0 auto; filter:drop-shadow(0 0 16px rgba(246,199,91,.28)); }
.eclipse-corona { fill:none; stroke:#eac66c; stroke-width:2; stroke-dasharray:2 5; transform-origin:50px 50px; animation:coronaTurn 18s linear infinite; }
.eclipse-orb { fill:#d4a94a; stroke:#fff0bd; stroke-width:1.5; }
.brain-grooves { fill:none; stroke:#35230d; stroke-width:3.2; stroke-linecap:round; stroke-linejoin:round; opacity:.86; }
.eclipse-shadow { fill:#080a12; transition:cx .8s cubic-bezier(.2,.8,.2,1); }
.opening-mark { width:94px; height:94px; margin-bottom:18px; }
.opening-gate>strong { text-align:center; line-height:.76; }
.opening-gate>strong b { color:#e3bd62; font-weight:500; }
.opening-emblem .opening-mark { width:108px; height:108px; animation:emblemPulse 1.5s infinite alternate; }
.stage-wipe .wipe-mark { width:66px; height:66px; }
.eclipse-brand .eclipse-mark { width:44px; height:44px; }
.brand-mark.compact .eclipse-mark { width:28px; height:28px; }
.hero-eclipse { position:absolute; top:52px; display:grid; place-items:center; }
.hero-moon { width:148px; height:148px; opacity:.78; filter:drop-shadow(0 0 45px rgba(235,199,102,.34)); }
.hero-tiles { position:relative; z-index:2; }
.hero-stage { background:linear-gradient(180deg,rgba(4,8,23,.08),rgba(4,6,18,.38) 48%,rgba(4,5,14,.94)),url("assets/studio-background.png") center/cover no-repeat; }
.home-page::after { opacity:.13; background-image:radial-gradient(circle at 72% 16%,rgba(245,219,147,.16),transparent 28%),linear-gradient(115deg,transparent 34%,rgba(255,255,255,.025) 50%,transparent 66%); background-size:auto; }
.studio-brand { min-height:38px; display:flex; align-items:center; gap:8px; padding:3px 17px 3px 8px; clip-path:polygon(7% 0,93% 0,100% 50%,93% 100%,7% 100%,0 50%); }
.studio-brand .studio-eclipse { width:30px; height:30px; }
.studio-brand span { white-space:nowrap; }
.studio-cast { height:220px; margin-top:-3px; }
.compact-cast { gap:10px; }
.portrait-wrap { width:154px; height:196px; border-radius:46% 46% 16px 16px; }
.portrait-wrap img { object-fit:contain; object-position:center bottom; }
.score-plate { min-width:142px; }
.brain-progress { align-self:flex-end; margin:0 auto 18px; display:flex; align-items:center; gap:8px; color:#f7dda0; text-shadow:0 2px 7px #000; }
.brain-progress .progress-eclipse { width:58px; height:58px; }
.brain-progress span,.brain-progress small,.brain-progress b { display:block; }
.brain-progress small { color:#adb6d0; font-size:.49rem; letter-spacing:.13em; }
.brain-progress b { margin-top:3px; font-size:.62rem; letter-spacing:.06em; }
.broadcast-ui { margin-top:-14px; }
.question-band { min-height:74px; padding:18px 16px 11px; }
.question-band p { font-size:clamp(.87rem,3.7vw,1.08rem); line-height:1.28; }
.broadcast-status { min-height:34px; margin-top:4px; }
.presenter-nudge { position:fixed; z-index:30; left:50%; bottom:max(18px,env(safe-area-inset-bottom)); width:min(calc(100% - 24px),520px); min-height:112px; display:grid; grid-template-columns:84px 1fr; align-items:end; gap:12px; padding:10px 16px 10px 4px; border:1px solid rgba(246,199,91,.68); border-radius:8px; color:white; background:linear-gradient(105deg,rgba(7,11,31,.98),rgba(94,13,42,.98)); box-shadow:0 22px 70px rgba(0,0,0,.7); transform:translateX(-50%); animation:presenterIn .3s ease-out both; }
.presenter-nudge img { width:84px; max-height:108px; object-fit:contain; object-position:bottom; }
.presenter-nudge small { color:#f6c75b; font-size:.58rem; font-weight:950; letter-spacing:.12em; }
.presenter-nudge p { margin:6px 0; font-family:var(--font-display); line-height:1.3; }
.presenter-nudge.leaving { animation:nudgeOut .42s ease-in both; }
@keyframes coronaTurn { to { transform:rotate(360deg); } }
@keyframes nudgeOut { to { opacity:0; transform:translate(-50%,12px); } }

@media (max-width:430px) {
  .opening-tiles b { width:clamp(62px,21vw,88px); }
  .hero-moon { width:120px; height:120px; }
  .studio-cast { height:202px; }
  .portrait-wrap { width:138px; height:180px; }
  .score-plate { min-width:132px; }
  .brain-progress { margin-bottom:14px; }
  .brain-progress .progress-eclipse { width:48px; height:48px; }
  .opponent-chip { min-width:108px; }
}

@media (max-height:760px) {
  .studio-cast { height:174px; }
  .portrait-wrap { width:116px; height:148px; }
  .score-plate { min-width:112px; }
  .brain-progress .progress-eclipse { width:42px; height:42px; }
  .question-band { min-height:66px; }
}

@media (prefers-reduced-motion:reduce) {
  .eclipse-corona,.studio-screen,.presenter-moment.speaking img { animation:none!important; }
}

/* Program referansı: yarışmacı merkezde, puan solda, harfler göğüs hizasında */
.reference-cast { height:302px; padding:0; display:block; }
.reference-cast .player-one { left:50%; bottom:-12px; width:266px; transform:translateX(-50%); }
.reference-cast .portrait-wrap { width:256px; height:288px; border:0; border-radius:42% 42% 8px 8px; background:transparent; box-shadow:none; mask-image:linear-gradient(to bottom,#000 84%,transparent 100%); }
.reference-cast .portrait-wrap img { object-fit:contain; object-position:center bottom; filter:drop-shadow(0 16px 20px rgba(0,0,0,.62)); }
.reference-cast .portrait-initial { border-radius:48% 48% 10px 10px; }
.score-stack { position:absolute; z-index:6; left:5px; bottom:52px; width:116px; text-align:center; filter:drop-shadow(0 8px 9px rgba(0,0,0,.55)); }
.score-stack small,.score-stack strong,.score-stack span { display:block; clip-path:polygon(9% 0,91% 0,100% 50%,91% 100%,9% 100%,0 50%); }
.score-stack small { padding:5px 10px 2px; color:#251300; background:#e5b94f; font-size:.56rem; font-weight:950; letter-spacing:.06em; }
.score-stack strong { padding:3px 8px 4px; color:#1b0d00; background:linear-gradient(180deg,#ffe79b,#d9a62d); font-size:1.35rem; }
.score-stack span { padding:4px 8px 6px; color:#6f0c25; background:#fff9e4; font-size:.72rem; font-weight:950; }
.reference-cast .brain-progress { position:absolute; z-index:5; right:8px; top:12px; margin:0; }
.reference-cast .brain-progress span { display:none; }
.reference-cast .opponent-chip { position:absolute; z-index:6; right:5px; bottom:52px; margin:0; }
.reference-cast + .broadcast-ui { margin-top:-42px; }
.reference-cast + .broadcast-ui .tiles { position:relative; z-index:8; margin:0 auto 10px; width:100%; justify-content:center; filter:drop-shadow(0 8px 8px rgba(0,0,0,.52)); }
.reference-cast + .broadcast-ui .tile { width:clamp(27px,8vw,43px); min-height:48px; }
.studio-screen.player-active .reference-cast .player-one { transform:translateX(-50%) scale(1.035); }
.studio-screen.rival-active .reference-cast .player-one { transform:translateX(-50%); }

@media (max-width:430px) {
  .reference-cast { height:282px; }
  .reference-cast .player-one { width:236px; bottom:-10px; }
  .reference-cast .portrait-wrap { width:228px; height:268px; }
  .score-stack { left:0; bottom:47px; width:104px; }
  .reference-cast .opponent-chip { right:0; bottom:47px; min-width:104px; }
  .reference-cast + .broadcast-ui { margin-top:-40px; }
  .reference-cast + .broadcast-ui .tiles { margin-bottom:16px; }
  .question-band { margin-top:12px; }
}

@media (max-height:760px) {
  .reference-cast { height:234px; }
  .reference-cast .player-one { width:196px; bottom:-8px; }
  .reference-cast .portrait-wrap { width:190px; height:224px; }
  .score-stack { bottom:42px; }
  .reference-cast .opponent-chip { bottom:42px; }
  .reference-cast + .broadcast-ui { margin-top:-38px; }
}

/* Oyun yayını bilinçli olarak 9:16 dikey kadrajda tutulur. */
.shell:has(.studio-screen) { width:min(100%,430px); min-height:100dvh; margin-inline:auto; }
.studio-screen { width:100%; min-height:100dvh; }
@media (min-width:431px) {
  body:has(.studio-screen) { background:#02030a; }
  .shell:has(.studio-screen) { box-shadow:0 0 0 1px rgba(236,199,105,.16),0 0 90px rgba(23,46,112,.34); }
}

/* Reklam alanları yalnızca akış dışı ekranlarda görünür. */
.ad-slot { position:relative; min-height:88px; margin:22px 0; padding:17px 72px 17px 19px; display:flex; flex-direction:column; justify-content:center; overflow:hidden; border:1px solid rgba(230,190,92,.24); border-radius:8px; color:#d8def0; background:linear-gradient(105deg,rgba(10,15,34,.92),rgba(27,32,58,.78)); box-shadow:inset 0 1px rgba(255,255,255,.035); }
.ad-slot::before { content:""; position:absolute; right:34px; width:74px; height:74px; border:1px solid rgba(233,196,103,.16); border-radius:50%; box-shadow:0 0 30px rgba(233,196,103,.08); }
.ad-slot span { color:#e5be62; font-size:.56rem; font-weight:950; letter-spacing:.16em; }
.ad-slot p { position:relative; margin:6px 0 0; font-size:.78rem; line-height:1.35; }
.ad-slot i { position:absolute; top:7px; right:8px; color:#737d9e; font-size:.47rem; font-style:normal; letter-spacing:.12em; }
.ad-slot.compact { width:min(100%,430px); min-height:66px; margin:20px auto; padding-block:12px; text-align:left; }
.waiting-room .ad-slot { margin-top:34px; }
.result .ad-slot { margin:22px auto; }
.studio-screen .ad-slot { display:none!important; }

/* Özgün yayın formatı: program hissi korunur, dekor ve oyun dili ayrışır. */
.studio-screen.format-independent { background-image:linear-gradient(180deg,rgba(3,10,28,.04),rgba(2,8,24,.28) 48%,rgba(2,6,18,.9)),url("assets/studio-background-independent-v1.png"); background-position:center top; background-size:cover; }
.format-independent::after { background:radial-gradient(circle at 50% 31%,transparent 0 26%,rgba(0,109,255,.08) 27% 28%,transparent 29%),linear-gradient(180deg,transparent 55%,rgba(0,8,26,.46)); }
.format-independent .studio-brand { color:#eaf7ff; background:linear-gradient(90deg,rgba(3,23,54,.92),rgba(9,84,145,.88),rgba(3,23,54,.92)); border-color:rgba(91,207,255,.52); }
.format-independent .tile { clip-path:none; border:1px solid rgba(110,211,255,.88); border-radius:9px; color:#061a33; background:linear-gradient(155deg,#f7fcff,#bfe9fb); box-shadow:inset 0 0 0 2px rgba(255,255,255,.62),0 7px 14px rgba(0,31,77,.55); }
.format-independent .tile.hidden { color:#1a5f91; background:linear-gradient(155deg,#eaf9ff,#8bd1ef); }
.format-independent .question-band { clip-path:none; border-color:#72d7ff; border-radius:10px; background:linear-gradient(145deg,#08376a,#061b3f 58%,#0a518a); box-shadow:0 10px 30px rgba(0,23,62,.62),inset 0 1px rgba(255,255,255,.2); }
.format-independent .question-band::after { border-radius:7px; clip-path:none; }
.format-independent .question-hint { color:#8fe6ff; }
.format-independent .broadcast-clock { color:#04264a; border-color:#79dfff; background:#eafbff; }
.format-independent .letter-control { clip-path:none; border-color:#76d7ff; border-radius:9px; color:#03223f; background:linear-gradient(180deg,#dff8ff,#66c7ee); }
.format-independent .physical-buzzer span { border-color:#a9eaff; background:radial-gradient(circle at 38% 20%,#d9f8ff 0 5%,#3dc5ff 18%,#0877cc 60%,#02366f 100%); box-shadow:0 0 30px rgba(27,171,255,.78),inset 0 -10px 18px rgba(0,31,79,.72); }
.format-independent .physical-buzzer::after { border-color:#72d7ff; background:linear-gradient(180deg,#315676,#071625); }
.format-independent .score-stack small { color:#dff7ff; background:#087ab7; }
.format-independent .score-stack strong { color:#03182f; background:linear-gradient(180deg,#dff8ff,#68ccec); }
.format-independent .score-stack span { color:#064577; background:#eefbff; }
.round-progress { position:absolute; z-index:7; right:7px; top:13px; width:68px; height:68px; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto 1fr; place-content:center; align-items:end; padding:9px; border:1px solid rgba(104,216,255,.7); border-radius:50%; color:#e7f8ff; text-align:center; background:radial-gradient(circle,#0b4f82,#03162f 72%); box-shadow:0 0 24px rgba(23,159,226,.35); }
.round-progress small { grid-column:1/-1; color:#8ddfff; font-size:.45rem; font-weight:900; letter-spacing:.13em; }
.round-progress b { font-size:1.35rem; line-height:1; }
.round-progress span { padding:0 0 2px 2px; color:#9ec9df; font-size:.55rem; }
.history-source { display:inline-block; margin-top:4px; color:#e2c676; font-size:.68rem; text-decoration:none; } .history-source:hover { text-decoration:underline; }