/* Bilgi Avcısı — SırtlanTech Games görsel katmanı */
:root{--bg:#09090b;--card:#171719;--rise:#111113;--hi:#212124;--line:#ffffff18;--orange:#ff6a00;--deep:#d65b08;--cyan:#00c8d7;--white:#f5f4f2;--muted:#aaa5ad}
body{background:radial-gradient(ellipse 75% 420px at 50% -120px,#ff6a001b,transparent),linear-gradient(90deg,transparent 49.94%,#ffffff05 50%,transparent 50.06%),#09090b;background-size:auto,64px 64px,auto;padding:22px 16px 70px}
.stage{max-width:790px}
.bar{padding:11px 18px;border-radius:14px;background:#141416e8;border-color:#ffffff1a;margin-bottom:38px;min-height:64px;gap:14px}
.brand{display:inline-flex;align-items:center;gap:11px;color:var(--white);text-decoration:none;font:700 13px Poppins,sans-serif;letter-spacing:-.02em}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;border:1px solid #ff6a0040;background:#ff6a000d;border-radius:11px;flex-shrink:0}
.brand-mark img{display:block;width:29px;height:29px;object-fit:contain;transition:transform .2s}
.brand:hover img{transform:scale(1.08)}
.brand-name strong{color:var(--orange)}
.pill{font-weight:700;letter-spacing:.15em;text-align:right}
.hero{padding:18px 0 30px;position:relative}
.hero::before{content:'GAMES / 001';display:block;font:700 10px Inter,sans-serif;letter-spacing:.24em;color:var(--orange);margin-bottom:16px}
.hero h1{font-size:clamp(46px,8vw,78px);letter-spacing:-.075em;line-height:.98;margin:12px 0 16px}
.hero h1::after{content:'.';color:var(--orange)}
.hero .sub{font-size:14px;line-height:1.7}
.mascot{font-size:67px;display:inline-block}
.grid{gap:14px}
.card,.panel{border-radius:17px;border-color:#ffffff18;background:linear-gradient(145deg,#1a1a1d,#111113)}
.card{min-height:164px;position:relative;overflow:hidden;padding:23px 24px;transition:transform .2s,border-color .2s,box-shadow .2s}
.card::before{content:'';position:absolute;top:0;left:0;width:45px;height:2px;background:var(--orange);opacity:.7}
.card:hover{transform:translateY(-4px);border-color:#ff6a0070;box-shadow:0 16px 35px #0005;background:linear-gradient(145deg,#222124,#131315)}
.card .icon{display:grid;place-items:center;width:48px;height:48px;background:#ff6a0010;border:1px solid #ff6a002a;border-radius:12px;font-size:25px}
.card .name{margin-top:15px;font-size:17px;letter-spacing:-.025em}
.card .desc{font-size:12px;line-height:1.6;margin-top:6px}
.btn{border-radius:11px;background:var(--orange);color:#170b04;box-shadow:none;font-size:13px;padding:15px 18px}
.btn:hover{filter:brightness(1.1)}
.btn.ghost{background:#171719;color:var(--white);border:1px solid #ffffff24}
.btn.ghost:hover{border-color:#ff6a0070}
.panel{padding:clamp(18px,4vw,30px)}
.top{gap:16px}.stat b{font-size:29px}.stat span{letter-spacing:.12em;font-weight:700}
.track{height:7px;margin:22px 0}.fill{background:linear-gradient(90deg,#c75300,var(--orange))}
.qcard{border-radius:14px;padding:clamp(18px,4vw,27px);margin-bottom:15px;background:#101012}
.q{font-size:clamp(17px,3vw,21px);line-height:1.45}
.answers{gap:11px}.answer{background:#1a1a1d;border:1px solid #ffffff20;border-radius:11px;padding:17px 16px;font:600 13px Inter,sans-serif;line-height:1.45;min-height:55px}
.answer:hover{background:#242327;border-color:#ff6a0090}
.answer.correct{background:#ff6a00;color:#170b04;border-color:#ff6a00}.answer.wrong{background:#873d36}
.result .seal{border-color:var(--orange);width:160px;height:160px;margin:8px auto 18px}
.score{letter-spacing:-.06em}.break{gap:10px}.mini{border-radius:11px;padding:16px}
.section-title{margin-top:28px;font-size:11px;letter-spacing:.13em}
.keyitem{border-radius:10px;padding:14px}.feedback-box{border-radius:13px}
.feedback-box input,.feedback-box textarea{background:#0e0e10;border-color:#ffffff25;border-radius:10px}
.feedback-box input:focus,.feedback-box textarea:focus{outline:1px solid var(--orange)}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
@media(max-width:460px){body{padding:12px 12px 50px}.bar{margin-bottom:22px;padding:10px 12px}.brand-name{display:none}.pill{font-size:9px}.hero h1{font-size:clamp(40px,11vw,56px)}.grid{grid-template-columns:1fr}.card{min-height:135px}.answers{grid-template-columns:1fr}.break{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){.mascot,.screen.active{animation:none!important}}
