/* Who Am I? (Hacker Edition) — arena kabuğu (hr-arena-shell) için OYUN ADAPTÖRÜ stilleri (hr-arena-who-am-i.js).
 *
 * Sınıflar `ar-wa-` önekli, animasyonlar `hr-wa-` önekli. Görsel dil kullanıcının mevcut Who Am I tasarımıyla aynıdır:
 * "gölge-beliriyor" kehanet sahnesi — kesik köşeli çerçeveli kâhin kartı, sağ üstte dönen mühür halkası, altın kod parçaları,
 * karartılmış (kilitli) ipuçlarının yavaşça belirmesi, aether-yeşil doğrulama şeridi.
 * `.ar-theme-whoami` = YARIŞ SAHNESİ TEMA YUVASI: yalnız renk/kenar değişkenleri + kare köşe. Premium kâhin sahnesi
 * görseli F8'de `--ar-backdrop` ve `.ar-content` yuvasına BAĞLANDI (bkz. aşağıdaki 'yarış sahnesi arka planı' bloğu). */

/* ── tema yuvası ── */
.ar-theme-whoami{--ar-accent:#a06bff;--ar-accent-2:#f2c86b;--ar-ok:#37e6c4;--ar-danger:#ff7a5e;--ar-bg:#0c0b16;--ar-panel:#100e1d;--ar-surface:#16142a;--ar-border:#2c2850;--ar-muted:#938cc0;--ar-text:#ece8fb}
.ar-theme-whoami .ar-stage,.ar-theme-whoami .ar-arena,.ar-theme-whoami .ar-ranks,.ar-theme-whoami .ar-btn,.ar-theme-whoami .ar-box,
.ar-theme-whoami .ar-pcard,.ar-theme-whoami .ar-metrics,.ar-theme-whoami .ar-dlrow,.ar-theme-whoami .ar-input,.ar-theme-whoami .ar-pod,
.ar-theme-whoami .ar-lrow,.ar-theme-whoami .ar-codebox,.ar-theme-whoami .ar-slow,.ar-theme-whoami .ar-tab{border-radius:0}
.ar-theme-whoami .ar-title{display:none} /* sayfa kahramanı zaten "Who Am I?" başlığını taşır */
.ar-theme-whoami .ar-head{margin-bottom:10px}
.ar-theme-whoami .ar-stage{min-height:0}
.ar-theme-whoami .ar-pane{padding:clamp(16px,2.4vh,26px)}
/* ── yarış sahnesi arka planı (F8, onaylı Codex görseli assets/arena-scenes/race-who-am-i.webp) ──
 * Lobi/bekleme: kabuğun hafif maskeli --ar-backdrop katmanı (opacity .14). Yarış + bitiş: sahne tam kapsar; HUD/metin
 * okunabilirliği için üstte iki karartma (merkez radial + dikey gradient). Statik görsel — animasyon yok. */
.ar-theme-whoami{--ar-backdrop:url('/assets/arena-scenes/race-who-am-i.webp')}
.ar-theme-whoami[data-ar-phase="race"] .ar-stage::after,.ar-theme-whoami[data-ar-phase="end"] .ar-stage::after{background:radial-gradient(ellipse 62% 70% at 50% 52%,rgba(6,8,16,.46),rgba(6,8,16,.12) 72%,transparent),linear-gradient(180deg,rgba(6,8,16,.3),rgba(6,8,16,.58)),var(--ar-backdrop) 50% 38%/cover no-repeat;opacity:1;-webkit-mask-image:none;mask-image:none}
.ar-theme-whoami[data-ar-phase="race"] .ar-arena{background:rgba(7,9,18,.58)}
.ar-theme-whoami .ar-ranks{max-height:min(150px,17vh);overflow-y:auto;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--ar-accent) 42%,transparent) transparent}
.ar-theme-whoami .ar-content{padding:0;min-height:0}
.ar-theme-whoami .ar-arena{min-height:0}
.ar-theme-whoami[data-ar-phase="race"] .ar-head,.ar-theme-whoami[data-ar-phase="end"] .ar-head{display:none}
.ar-theme-whoami .ar-race{gap:8px;padding:12px 16px}
.ar-theme-whoami .ar-ranks{padding:6px 10px;gap:2px}.ar-theme-whoami .ar-rrow{padding:3px 8px}.ar-theme-whoami .ar-answerbar{min-height:26px}

/* ── lobi seçenekleri ── */
.ar-wa-opts{width:100%;text-align:left}
.ar-wa-label{font:600 10px 'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--ar-muted);margin:0 0 7px}
.ar-wa-label.gap{margin-top:12px}
.ar-wa-seg{display:flex;gap:6px;flex-wrap:wrap}
.ar-wa-segbtn{border:1px solid var(--ar-border);border-radius:0;background:rgba(7,9,18,.5);color:var(--ar-muted);padding:8px 14px;cursor:pointer;font-size:.88rem}
.ar-wa-segbtn:hover{color:var(--ar-text)}
.ar-wa-segbtn[aria-pressed="true"]{color:var(--ar-text);border-color:#7656ab;background:#261a3d;box-shadow:inset 0 -2px var(--ar-accent)}

/* ── yarış içeriği ── */
.ar-wa{display:flex;flex-direction:column;min-width:0}
.ar-wa-hud{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--ar-border)}
.ar-wa-stat{padding:9px 16px;border-right:1px solid var(--ar-border);white-space:nowrap;min-width:0}
.ar-wa-stat:last-child{border-right:0}
.ar-wa-stat strong{display:block;font:700 22px 'JetBrains Mono',monospace;line-height:1.1;color:var(--ar-text);font-variant-numeric:tabular-nums}
.ar-wa-stat.combo strong{color:var(--ar-accent-2)}
.ar-wa-stat.score strong{color:var(--ar-ok)}
.ar-wa-stat:last-child strong{color:var(--ar-accent-2)}
.ar-wa-stat>span{display:block;margin-top:3px;font:700 8px 'JetBrains Mono',monospace;color:#625d83;text-transform:uppercase;letter-spacing:.14em}
.ar-wa-micro{font:700 9px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--ar-ok)}
.ar-wa-body{padding:clamp(8px,1.6vh,16px);min-width:0}

/* kâhin kartı */
.ar-wa-oracle{position:relative;border:1px solid #403968;background:radial-gradient(circle at 50% 43%,rgba(160,107,255,.07),transparent 45%),linear-gradient(145deg,#18152d,#0c0b16);padding:clamp(14px,2.6vh,28px) clamp(14px,3vw,30px);overflow:hidden;min-width:0;max-height:clamp(250px,calc(100dvh - 310px),620px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--ar-accent) 42%,transparent) transparent}
.ar-wa-oracle::before{content:"";position:absolute;inset:9px;border:1px solid rgba(81,71,137,.4);clip-path:polygon(0 0,39% 0,42% 5%,58% 5%,61% 0,100% 0,100% 100%,61% 100%,58% 95%,42% 95%,39% 100%,0 100%);pointer-events:none}
.ar-wa-sigil{position:absolute;right:-70px;top:-70px;width:200px;height:200px;border:1px solid rgba(160,107,255,.18);border-radius:50%;opacity:.7;pointer-events:none;animation:hr-wa-spin 60s linear infinite}
.ar-wa-sigil::before,.ar-wa-sigil::after{content:"";position:absolute;border:1px solid rgba(201,189,255,.15);border-radius:50%}
.ar-wa-sigil::before{inset:22px}.ar-wa-sigil::after{inset:46px;background:conic-gradient(from 45deg,transparent 0 12%,rgba(160,107,255,.1) 12% 13%,transparent 13% 25%)}
.ar-wa-ohead{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.ar-wa-cat{display:inline-flex;align-items:center;gap:7px;min-height:24px;padding:0 9px;border:1px solid #6a5290;background:#211632;color:#c9bdff;font:700 9px 'JetBrains Mono',monospace;letter-spacing:.12em;text-transform:uppercase}
.ar-wa-cat::before{content:"◆";font-size:7px;color:var(--ar-accent-2)}
.ar-wa-pot{text-align:right}
.ar-wa-pot span{display:block;color:#625d83;font:700 8px 'JetBrains Mono',monospace;letter-spacing:.12em}
.ar-wa-pot strong{display:block;color:var(--ar-accent-2);font:700 18px 'JetBrains Mono',monospace;margin-top:2px}
.ar-wa-q{position:relative;margin:12px 0 14px;font:700 clamp(24px,3.4vw,36px)/1.06 'Cinzel',Georgia,serif}
.ar-wa-q::after{content:"";display:block;width:64px;height:1px;margin-top:11px;background:linear-gradient(90deg,var(--ar-accent-2),transparent)}
.ar-wa-clues{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ar-wa-clue{min-height:50px;border:1px solid var(--ar-border);background:rgba(12,11,22,.67);display:grid;grid-template-columns:34px 1fr;align-items:center;gap:12px;padding:8px 13px;transition:opacity .25s}
.ar-wa-no{width:27px;height:27px;border:1px solid #5b4b7d;display:grid;place-items:center;transform:rotate(45deg);color:#c9bdff;font:700 10px 'JetBrains Mono',monospace}
.ar-wa-no>span{transform:rotate(-45deg)}
.ar-wa-copy{font-size:14px;line-height:1.55;overflow-wrap:anywhere;user-select:text}
.ar-wa-copy code{color:var(--ar-accent-2);font:600 12px 'JetBrains Mono',monospace;background:rgba(242,200,107,.09);padding:2px 5px}
.ar-wa-clue.locked{opacity:.46;border-style:dashed}
.ar-wa-clue.locked .ar-wa-copy{color:var(--ar-muted);font:600 11px 'JetBrains Mono',monospace;letter-spacing:.03em}
.ar-wa-clue.revealing{animation:hr-wa-unseal .55s ease}

/* cevap bölgesi */
.ar-wa-zone{position:relative;margin-top:16px}
.ar-wa-row{display:grid;grid-template-columns:1fr auto;gap:8px}
.ar-wa-input{width:100%;height:46px;border:1px solid #514789;border-radius:0;background:#090811;color:var(--ar-text);padding:0 14px;font:600 14px 'JetBrains Mono',monospace}
.ar-wa-input::placeholder{color:#67617e}
.ar-wa-input:focus{border-color:var(--ar-accent);box-shadow:0 0 0 3px rgba(160,107,255,.1);outline:0}
.ar-wa-input:disabled{opacity:.55}
.ar-wa-input.wrong{border-color:var(--ar-danger);animation:hr-wa-shake .36s ease}
.ar-wa-acts{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:9px;flex-wrap:wrap}
.ar-wa-acts .left{display:flex;gap:8px;flex-wrap:wrap}
.ar-wa-help{color:#625d83;font:500 9px 'JetBrains Mono',monospace}
.ar-wa-btn{min-height:42px;border:1px solid #514789;border-radius:0;background:transparent;color:var(--ar-text);padding:0 16px;font-weight:800;font-size:13px;cursor:pointer}
.ar-wa-btn:hover:not(:disabled){border-color:var(--ar-accent);background:rgba(160,107,255,.06)}
.ar-wa-btn.primary{background:var(--ar-accent);border-color:var(--ar-accent);color:#10091c}
.ar-wa-btn.primary:hover:not(:disabled){background:var(--ar-accent);filter:brightness(1.08)}
.ar-wa-btn.gold{border-color:#9b7d3e;color:var(--ar-accent-2);background:rgba(242,200,107,.04)}
.ar-wa-btn.gold em{font-style:normal;opacity:.85}
.ar-wa-btn.ghost{border-color:transparent;color:var(--ar-muted)}
.ar-wa-btn:disabled{opacity:.42;cursor:not-allowed}
.ar-wa-fb{margin-top:9px;min-height:34px;display:flex;align-items:center;padding:0 12px;border-left:2px solid var(--ar-ok);background:rgba(55,230,196,.07);font-size:12px;color:#bfffe7;overflow-wrap:anywhere}
.ar-wa-fb.error{border-color:var(--ar-danger);background:rgba(255,122,94,.08);color:#ffc7bd}
.ar-wa-fb.hint{border-color:var(--ar-accent-2);background:rgba(242,200,107,.08);color:#ffe3a1}
.ar-wa-fb[hidden]{display:none}
.ar-wa-done{padding:30px 20px;text-align:center;color:var(--ar-muted)}

/* açıklama (solo) */
.ar-wa-reveal{position:relative;margin-top:16px;border:1px solid #277c70;background:linear-gradient(100deg,#0b2a25,#101b25);padding:15px 17px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;box-shadow:0 0 32px rgba(55,230,196,.07);animation:hr-wa-in .4s ease}
.ar-wa-reveal.pass{border-color:#5a546d;background:#15131f;box-shadow:none}
.ar-wa-reveal.pass .ar-wa-micro{color:var(--ar-muted)}
.ar-wa-rvname{font:700 22px 'Cinzel',Georgia,serif;margin:3px 0 5px;color:var(--ar-ok);overflow-wrap:anywhere}
.ar-wa-reveal.pass .ar-wa-rvname{color:var(--ar-text)}
.ar-wa-reveal p{font-size:12px;color:#b8c9cb;margin:0;max-width:640px;line-height:1.5}
.ar-wa-gain{text-align:right}
.ar-wa-gain strong{display:block;font:700 22px 'JetBrains Mono',monospace;color:var(--ar-accent-2)}
.ar-wa-gain span{color:var(--ar-muted);font-size:9px}
.ar-wa-gain .ar-wa-btn{margin-top:9px}

/* önceki bilmece şeridi (mp) */
.ar-wa-strip{display:flex;align-items:center;gap:10px;padding:7px 14px;border-bottom:1px solid var(--ar-border);background:rgba(55,230,196,.05)}
.ar-wa-strip.pass{background:rgba(147,140,192,.07)}
.ar-wa-strip[hidden]{display:none}
.ar-wa-mark{flex:none;width:26px;height:26px;display:grid;place-items:center;border:1px solid var(--ar-ok);color:var(--ar-ok);font:700 13px 'JetBrains Mono',monospace;transform:rotate(45deg)}
.ar-wa-strip.pass .ar-wa-mark{border-color:var(--ar-muted);color:var(--ar-muted)}
.ar-wa-mark>span{transform:rotate(-45deg)}
.ar-wa-striptext{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.25;padding-left:2px}
.ar-wa-striptext b{font-size:13px;color:var(--ar-ok);overflow-wrap:anywhere}
.ar-wa-strip.pass .ar-wa-striptext b{color:var(--ar-text)}
.ar-wa-striptext small{color:var(--ar-muted);font-size:11px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ar-wa-delta{flex:none;font:700 18px 'JetBrains Mono',monospace;color:var(--ar-accent-2)}

/* solo sonuç */
.ar-wa-rstats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--ar-border);margin:16px 0 10px;width:min(560px,100%)}
.ar-wa-rstats>div{padding:14px;border-right:1px solid var(--ar-border);background:rgba(6,8,16,.45)}
.ar-wa-rstats>div:last-child{border-right:0}
.ar-wa-rstats strong{display:block;font:700 24px 'JetBrains Mono',monospace}
.ar-wa-rstats span{font:700 8px 'JetBrains Mono',monospace;letter-spacing:.13em;text-transform:uppercase;color:#625d83}
.ar-wa-tier{display:flex;align-items:center;gap:16px;border:1px solid #76562f;background:radial-gradient(circle at 12% 50%,rgba(230,151,70,.2),transparent 40%),linear-gradient(160deg,#20150f,#0d0b12 64%);padding:12px 20px;margin:6px 0;text-align:left}
.ar-wa-rune{width:54px;height:54px;border:1px solid #dc9555;border-radius:50%;display:grid;place-items:center;color:#ffd696;font:700 20px 'Cinzel',Georgia,serif;text-shadow:0 0 14px #e4843c;box-shadow:0 0 24px rgba(226,139,50,.2)}
.ar-wa-tier b{display:block;font:700 18px 'Cinzel',Georgia,serif;color:#f1c18c}
.ar-wa-tier small{display:block;color:#ac8263;font:600 9px 'JetBrains Mono',monospace;letter-spacing:.1em;margin-top:3px}
.ar-wa-elig{margin:8px 0 14px;font-size:12px;color:var(--ar-accent-2)}
.ar-wa-elig.ok{color:var(--ar-ok)}
.ar-wa-metrics{display:flex;flex-direction:column;gap:10px}
.ar-wa-titlebox{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;border:1px solid #76562f;background:rgba(230,151,70,.07)}
.ar-wa-titlebox span{font:700 9px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#ac8263}
.ar-wa-titlebox b{font:700 15px 'Cinzel',Georgia,serif;color:#f1c18c}

@keyframes hr-wa-spin{to{transform:rotate(360deg)}}
@keyframes hr-wa-unseal{0%{opacity:.15;filter:blur(7px);transform:translateY(5px)}100%{opacity:1;filter:none;transform:none}}
@keyframes hr-wa-in{from{opacity:0;transform:translateY(7px)}}
@keyframes hr-wa-shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}

@media(max-width:700px){
  .ar-wa-hud{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ar-wa-stat{padding:7px 8px}
  .ar-wa-stat strong{font-size:15px}
  .ar-wa-stat>span{font-size:7px;letter-spacing:.06em}
  .ar-wa-body{padding:8px}
  .ar-wa-oracle{padding:14px 12px}
  .ar-wa-oracle::before{inset:6px}
  .ar-wa-q{font-size:24px;margin:8px 0 10px}
  .ar-wa-clue{grid-template-columns:30px 1fr;padding:7px 9px;gap:10px;min-height:44px}
  .ar-wa-copy{font-size:12.5px}
  .ar-wa-row{grid-template-columns:1fr}
  .ar-wa-row .ar-wa-btn{width:100%}
  .ar-wa-help{display:none}
  .ar-wa-reveal{grid-template-columns:1fr}
  .ar-wa-gain{text-align:left;display:flex;align-items:center;gap:10px}
  .ar-wa-gain .ar-wa-btn{margin-top:0}
  .ar-wa-rstats{grid-template-columns:1fr}
  .ar-wa-rstats>div{border-right:0;border-bottom:1px solid var(--ar-border)}
  .ar-theme-whoami .ar-ranks{max-height:min(128px,16vh)}
}
@media(max-height:820px){
  .ar-wa-q{margin:8px 0 10px;font-size:26px}
  .ar-wa-clue{min-height:42px;padding-block:6px}
  .ar-wa-input{height:40px}.ar-wa-btn{min-height:38px}
  .ar-wa-stat{padding:6px 16px}
  .ar-wa-zone{margin-top:12px}
}
@media(prefers-reduced-motion:reduce){
  .ar-wa-sigil,.ar-wa-clue.revealing,.ar-wa-input.wrong,.ar-wa-reveal{animation:none}
}

/* viewport-fit (2026-10-22): çok kısa ekranda ipucu kartları biraz sıkışır → cevap alanı kaydırmasız görünür */
@media(max-height:730px){
  .ar-wa-q{margin:8px 0 9px}
  .ar-wa-clue{min-height:44px}
  .ar-wa-zone{margin-top:10px}
  .ar-wa-stat{padding:6px 16px}
  .ar-wa-body{padding:6px 10px}
  .ar-wa-input{height:40px}
  .ar-wa-btn{min-height:38px}
}