:root{color-scheme:dark;--c-bg: #0b0d13;--c-bg-raised: #151925;--c-bg-elevated: #1c2130;--c-line: #262d3f;--c-text: #e8edf7;--c-text-dim: #97a3ba;--c-text-faint: #66708a;--c-brand: #35d6ff;--c-brand-2: #6bff8f;--c-danger: #ff5c7a;--c-warn: #ffc94d;--c-ok: #6bff8f;--grad-brand: linear-gradient(135deg, #35d6ff 0%, #6bff8f 100%);--grad-surface: linear-gradient(180deg, rgba(53, 214, 255, .08), rgba(53, 214, 255, 0));--r-sm: 8px;--r-md: 14px;--r-lg: 22px;--r-pill: 999px;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-5: 24px;--s-6: 32px;--s-7: 48px;--touch: 44px;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--shadow-1: 0 2px 12px rgba(0, 0, 0, .4);--shadow-2: 0 18px 48px rgba(0, 0, 0, .55);--ease: cubic-bezier(.22, .61, .36, 1)}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:var(--c-bg);color:var(--c-text);font-family:var(--font);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;touch-action:manipulation}#app{position:relative;height:100%;width:100%}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--c-brand);outline-offset:2px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}#website-ui{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain;padding:calc(var(--safe-top) + var(--s-4)) calc(var(--safe-right) + var(--s-4)) calc(var(--safe-bottom) + var(--s-5)) calc(var(--safe-left) + var(--s-4));background:radial-gradient(circle at 20% 0%,rgba(53,214,255,.16),transparent 55%),radial-gradient(circle at 85% 15%,rgba(107,255,143,.1),transparent 50%),var(--c-bg)}.site{max-width:62rem;margin:0 auto;display:flex;flex-direction:column;gap:var(--s-5)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}.brand{display:flex;align-items:center;gap:var(--s-3)}.brand__mark{width:40px;height:40px;flex:0 0 auto}.brand__name{font-size:1.15rem;font-weight:800;letter-spacing:.02em;margin:0}.brand__tag{margin:0;font-size:.72rem;color:var(--c-text-faint);letter-spacing:.14em;text-transform:uppercase}.live-pill{display:inline-flex;align-items:center;gap:var(--s-2);padding:6px 12px;border-radius:var(--r-pill);background:var(--c-bg-raised);border:1px solid var(--c-line);font-size:.78rem;color:var(--c-text-dim);min-height:32px}.live-pill:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c-ok);box-shadow:0 0 #6bff8f99;animation:pulse 2.4s var(--ease) infinite}@keyframes pulse{70%{box-shadow:0 0 0 8px #6bff8f00}to{box-shadow:0 0 #6bff8f00}}.hero{display:grid;gap:var(--s-5);grid-template-columns:1fr;align-items:center}.hero__title{font-size:clamp(1.8rem,6vw,3rem);line-height:1.05;margin:0 0 var(--s-3);letter-spacing:-.02em}.hero__title em{font-style:normal;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.hero__lead{margin:0 0 var(--s-4);color:var(--c-text-dim);line-height:1.55;max-width:34rem}.play-card{background:var(--c-bg-raised);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--shadow-2);background-image:var(--grad-surface)}.field{display:flex;flex-direction:column;gap:var(--s-2);margin-bottom:var(--s-4)}.field label{font-size:.78rem;color:var(--c-text-dim);text-transform:uppercase;letter-spacing:.1em}.field input{min-height:var(--touch);padding:0 var(--s-4);border-radius:var(--r-md);border:1px solid var(--c-line);background:var(--c-bg);color:var(--c-text);font-size:1rem}.field input:focus{border-color:var(--c-brand);outline:none}.field__error{color:var(--c-danger);font-size:.8rem;min-height:1rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:var(--touch);min-width:var(--touch);padding:0 var(--s-5);border:1px solid transparent;border-radius:var(--r-pill);font-weight:700;transition:transform .12s var(--ease),filter .12s var(--ease),opacity .12s var(--ease);background:var(--c-bg-elevated);color:var(--c-text)}.btn:active{transform:scale(.97)}.btn[disabled]{opacity:.45;pointer-events:none}.btn--primary{background:var(--grad-brand);color:#06131a;width:100%;font-size:1.05rem;letter-spacing:.01em}.btn--ghost{background:transparent;border-color:var(--c-line);color:var(--c-text-dim)}.btn--busy{position:relative;color:transparent}.btn--busy:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid rgba(6,19,26,.35);border-top-color:#06131a;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.quick-row{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:var(--s-3)}.chips{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:var(--s-4)}.chip{font-size:.75rem;color:var(--c-text-dim);border:1px solid var(--c-line);border-radius:var(--r-pill);padding:6px 12px;background:#ffffff05}.panel-grid{display:grid;gap:var(--s-4);grid-template-columns:1fr}.panel{background:var(--c-bg-raised);border:1px solid var(--c-line);border-radius:var(--r-md);padding:var(--s-4)}.panel h2{margin:0 0 var(--s-3);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c-text-faint)}.stat-row{display:flex;justify-content:space-between;padding:var(--s-2) 0;border-bottom:1px solid var(--c-line);font-size:.9rem}.stat-row:last-child{border-bottom:0}.stat-row span:last-child{color:var(--c-text-dim);font-variant-numeric:tabular-nums}.lb-row{display:grid;grid-template-columns:1.6rem 1fr auto;gap:var(--s-3);align-items:center;padding:var(--s-2) 0;font-size:.9rem}.lb-row__rank{color:var(--c-text-faint);font-variant-numeric:tabular-nums}.lb-row__score{color:var(--c-brand);font-variant-numeric:tabular-nums}.lb-row--me .lb-row__name{color:var(--c-brand-2);font-weight:700}.howto{counter-reset:step;display:grid;gap:var(--s-3);padding:0;margin:0;list-style:none}.howto li{counter-increment:step;display:grid;grid-template-columns:26px 1fr;gap:var(--s-3);color:var(--c-text-dim);font-size:.9rem;line-height:1.45}.howto li:before{content:counter(step);display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--c-bg-elevated);color:var(--c-brand);font-size:.78rem;font-weight:700}.site-footer{border-top:1px solid var(--c-line);padding-top:var(--s-4);display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center;justify-content:space-between;color:var(--c-text-faint);font-size:.78rem}.site-footer nav{display:flex;flex-wrap:wrap;gap:var(--s-4)}.site-footer a{color:var(--c-text-faint);text-decoration:none;min-height:32px;display:inline-flex;align-items:center}.site-footer a:hover{color:var(--c-text-dim)}@media(min-width:760px){.hero{grid-template-columns:1.15fr .85fr}.panel-grid{grid-template-columns:repeat(3,1fr)}}@media(orientation:landscape)and (max-height:460px){.hero{grid-template-columns:1.1fr .9fr;gap:var(--s-4)}.hero__title{font-size:clamp(1.3rem,4.4vh,2rem)}.hero__lead{font-size:.85rem}.play-card{padding:var(--s-4)}.panel-grid{grid-template-columns:repeat(3,1fr)}}#orientation-warning{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:calc(var(--safe-top) + var(--s-5)) calc(var(--safe-right) + var(--s-5)) calc(var(--safe-bottom) + var(--s-5)) calc(var(--safe-left) + var(--s-5));background:radial-gradient(circle at 50% 35%,#1a2030,#08090e 72%);text-align:center}.orientation-card{max-width:22rem;display:grid;justify-items:center;gap:var(--s-4)}.orientation-card h1{margin:0;font-size:1.4rem;letter-spacing:-.01em}.orientation-card p{margin:0;color:var(--c-text-dim);line-height:1.5;font-size:.95rem}.orientation-hint{font-size:.8rem!important;color:var(--c-text-faint)!important}.phone-rotation-animation{position:relative;width:132px;height:132px;display:grid;place-items:center;color:var(--c-brand)}.phone-body{position:relative;width:58px;height:104px;border-radius:12px;border:3px solid var(--c-text);background:#0f1219;animation:rotate-left 2.8s var(--ease) infinite;transform-origin:50% 50%}.phone-notch{position:absolute;top:6px;left:50%;transform:translate(-50%);width:18px;height:4px;border-radius:4px;background:var(--c-text-faint)}.phone-screen{position:absolute;inset:12px 6px 8px;border-radius:6px;background:linear-gradient(160deg,#35d6ff59,#6bff8f24)}.rotate-arrow{position:absolute;width:132px;height:132px;opacity:.75;transform:scaleX(-1);animation:arrow-breathe 2.8s var(--ease) infinite}@keyframes rotate-left{0%,18%{transform:rotate(0)}55%,82%{transform:rotate(-90deg)}to{transform:rotate(0)}}@keyframes arrow-breathe{0%,to{opacity:.25}45%{opacity:.9}}@media(prefers-reduced-motion:reduce){.phone-body{transform:rotate(-90deg)}}#game-container{position:fixed;inset:0;z-index:20;background:#05070c;overflow:hidden}#game-canvas{display:block;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none}#game-container.is-loading:after{content:"Arena hazırlanıyor…";position:absolute;inset:0;display:grid;place-items:center;color:var(--c-text-dim);font-size:.9rem;background:#05070c}#modal-root,#toast-root{position:fixed;inset:0;z-index:80;pointer-events:none}#toast-root{z-index:90;display:flex;flex-direction:column;align-items:center;gap:var(--s-2);padding-top:calc(var(--safe-top) + var(--s-4))}.toast{pointer-events:auto;background:var(--c-bg-elevated);border:1px solid var(--c-line);border-radius:var(--r-pill);padding:10px 18px;font-size:.85rem;box-shadow:var(--shadow-1);animation:toast-in .22s var(--ease);max-width:min(90vw,30rem)}.toast--error{border-color:#ff5c7a99;color:#ffd4dc}.toast--ok{border-color:#6bff8f80;color:#d6ffe2}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}}.modal-backdrop{pointer-events:auto;position:absolute;inset:0;display:grid;place-items:center;background:#05070cb8;backdrop-filter:blur(6px);padding:calc(var(--safe-top) + var(--s-4)) calc(var(--safe-right) + var(--s-4)) calc(var(--safe-bottom) + var(--s-4)) calc(var(--safe-left) + var(--s-4));animation:fade-in .16s var(--ease)}@keyframes fade-in{0%{opacity:0}}.modal{width:min(30rem,100%);max-height:100%;overflow-y:auto;background:var(--c-bg-raised);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--shadow-2)}.modal__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-4)}.modal__head h2{margin:0;font-size:1.1rem}.modal__close{width:var(--touch);height:var(--touch);border-radius:50%;border:1px solid var(--c-line);background:transparent;font-size:1.2rem;line-height:1}.setting{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:var(--touch);padding:var(--s-2) 0;border-bottom:1px solid var(--c-line)}.setting:last-of-type{border-bottom:0}.setting__label{font-size:.92rem}.setting__hint{display:block;font-size:.74rem;color:var(--c-text-faint);margin-top:2px}.switch{position:relative;width:52px;height:30px;flex:0 0 auto;border-radius:var(--r-pill);border:1px solid var(--c-line);background:var(--c-bg);transition:background .15s var(--ease)}.switch:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--c-text-faint);transition:transform .15s var(--ease),background .15s var(--ease)}.switch[aria-checked=true]{background:#35d6ff38;border-color:var(--c-brand)}.switch[aria-checked=true]:after{transform:translate(22px);background:var(--c-brand)}.segmented{display:inline-flex;border:1px solid var(--c-line);border-radius:var(--r-pill);overflow:hidden}.segmented button{min-height:36px;padding:0 var(--s-3);border:0;background:transparent;color:var(--c-text-dim);font-size:.8rem}.segmented button[aria-pressed=true]{background:var(--c-bg-elevated);color:var(--c-brand)}.slider{width:140px;accent-color:var(--c-brand);height:var(--touch)}.result{width:min(38rem,100%);text-align:center}.result__badge{font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;color:var(--c-text-faint)}.result__title{margin:var(--s-2) 0 var(--s-1);font-size:clamp(1.6rem,6vw,2.4rem);letter-spacing:-.02em}.result__title--win{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.result__title--lose{color:var(--c-text)}.result__place{color:var(--c-text-dim);margin:0 0 var(--s-4)}.result__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-2);margin-bottom:var(--s-4)}.result__stat{background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--r-md);padding:var(--s-3) var(--s-2)}.result__stat b{display:block;font-size:1.1rem;font-variant-numeric:tabular-nums}.result__stat span{font-size:.68rem;color:var(--c-text-faint);text-transform:uppercase;letter-spacing:.08em}.result__table{text-align:left;margin-bottom:var(--s-4);max-height:34vh;overflow-y:auto}.result__actions{display:flex;gap:var(--s-3)}.result__actions .btn{flex:1}@media(orientation:landscape)and (max-height:460px){.result__stats{grid-template-columns:repeat(4,1fr)}.result__table{max-height:26vh}.modal{padding:var(--s-4)}}.tutorial{text-align:center}.tutorial__art-wrap{display:grid;place-items:center;background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--r-md);padding:var(--s-3);margin-bottom:var(--s-4)}.tutorial__art{width:100%;max-width:15rem;height:auto}.tutorial__title{margin:0 0 var(--s-2);font-size:1.15rem}.tutorial__body{margin:0 0 var(--s-4);color:var(--c-text-dim);line-height:1.55;font-size:.92rem}.tutorial__dots{display:flex;justify-content:center;gap:var(--s-2);margin-bottom:var(--s-4)}.tutorial__dot{width:7px;height:7px;border-radius:50%;background:var(--c-line);transition:background .15s var(--ease)}.tutorial__dot.is-active{background:var(--c-brand)}.tutorial__skip{margin-top:var(--s-3)}.tutorial__skip .btn{font-size:.8rem;min-height:36px}@media(orientation:landscape)and (max-height:460px){.tutorial__art-wrap{padding:var(--s-2);margin-bottom:var(--s-3)}.tutorial__art{max-width:9rem}.tutorial__body{font-size:.82rem;margin-bottom:var(--s-3)}}.diagnostics{margin-top:var(--s-4);border-top:1px solid var(--c-line);padding-top:var(--s-3)}.diagnostics summary{cursor:pointer;color:var(--c-text-faint);font-size:.8rem;min-height:32px;display:flex;align-items:center}.diagnostics__body{margin:var(--s-2) 0;padding:var(--s-3);background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--r-sm);color:var(--c-text-dim);font-size:.72rem;line-height:1.5;white-space:pre-wrap;word-break:break-word;max-height:9rem;overflow-y:auto;user-select:text}.shop__wallet{display:flex;align-items:center;justify-content:space-between;padding:var(--s-3) var(--s-4);background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--r-md);font-size:.9rem}.shop__wallet b{color:var(--c-warn);font-variant-numeric:tabular-nums}.shop__note{margin:var(--s-2) 0 var(--s-4);font-size:.74rem;color:var(--c-text-faint);line-height:1.45}.shop__section{margin:var(--s-4) 0 var(--s-2);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--c-text-faint)}.shop__grid{display:grid;gap:var(--s-2);grid-template-columns:1fr}.shop__card{border:1px solid var(--c-line);border-radius:var(--r-md);padding:var(--s-3);background:var(--c-bg)}.shop__card.is-equipped{background:#35d6ff0f}.shop__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-2)}.shop__name{font-weight:700;font-size:.92rem}.shop__rarity{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}.shop__desc{margin:var(--s-1) 0 var(--s-3);font-size:.78rem;color:var(--c-text-dim);line-height:1.4}.shop__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}.shop__price{font-size:.82rem;color:var(--c-text-dim);font-variant-numeric:tabular-nums}.shop__action{min-height:38px;padding:0 var(--s-4);font-size:.84rem}@media(min-width:560px){.shop__grid{grid-template-columns:1fr 1fr}}
