/* Plus Jakarta Sans from this server (OFL, fonts/OFL.txt): the CSP allows only same-origin styles and fonts, which blocked Google Fonts */
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/plus-jakarta-sans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/plus-jakarta-sans-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --bg:#060a13;--bg2:#0b1222;--panel:rgba(17,25,42,.72);--panel2:rgba(24,34,56,.85);--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);
  --txt:#e9eef7;--mut:#8b9ab3;--teal:#19d3c5;--violet:#7c5cff;--coral:#ff6b6b;--amber:#ffc542;--green:#3ddc97;--blue:#3aa0ff;--pink:#ff8fd1;
  --r:18px;--shadow:0 18px 50px rgba(0,0,0,.45);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--txt);font-family:"Segoe UI Variable","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",sans-serif;font-size:15px}
body{overflow-x:hidden}
button,input,select{font:inherit;color:inherit}
a{color:var(--teal)}
.hidden{display:none!important}
/* arka plan */
#bg{position:fixed;inset:0;z-index:-1;overflow:hidden;background:
  radial-gradient(900px 500px at 12% -10%,rgba(124,92,255,.22),transparent 60%),
  radial-gradient(800px 500px at 110% 10%,rgba(25,211,197,.16),transparent 60%),
  radial-gradient(700px 600px at 50% 120%,rgba(255,107,107,.12),transparent 60%),var(--bg)}
#bg:before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 75%);opacity:.5}
#bg svg{position:absolute;left:0;right:0;top:62%;width:100%;height:120px;opacity:.18}
#bg path{stroke:var(--teal);stroke-width:2;fill:none;stroke-dasharray:1400;animation:ecg 6s linear infinite}
@keyframes ecg{from{stroke-dashoffset:1400}to{stroke-dashoffset:0}}
/* yerleşim */
#app{max-width:1180px;margin:0 auto;padding:18px 16px 60px}
.top{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.04em;cursor:pointer;user-select:none}
.logo small{display:block;font-size:10.5px;letter-spacing:.32em;color:var(--teal);font-weight:700}
.logo b{font-size:18px}
.sp{flex:1}
.chip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--panel);border:1px solid var(--line);font-weight:700;font-size:13.5px;white-space:nowrap}
.chip.fire{color:#ffb86b}.chip.lvl{color:var(--teal)}
.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:21px;border:2px solid var(--c,var(--teal));background:rgba(255,255,255,.04);cursor:pointer;flex:0 0 auto}
.avatar.lg{width:72px;height:72px;font-size:38px;border-width:3px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:18px;backdrop-filter:blur(10px);box-shadow:var(--shadow)}
.grid{display:grid;gap:16px}
.home{grid-template-columns:1fr 340px}
@media(max-width:900px){.home{grid-template-columns:1fr}}
h1,h2,h3{margin:0 0 8px;line-height:1.2}
h1{font-size:clamp(28px,5vw,46px);letter-spacing:-.02em}
h2{font-size:20px}h3{font-size:15px;color:var(--mut);font-weight:600;text-transform:uppercase;letter-spacing:.12em}
.mut{color:var(--mut)}.small{font-size:12.5px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:14px;border:1px solid var(--line2);background:var(--panel2);font-weight:700;cursor:pointer;transition:transform .12s,filter .15s,background .15s}
.btn:hover{filter:brightness(1.15)}.btn:active{transform:scale(.97)}
.btn.pri{background:linear-gradient(135deg,var(--teal),#12a7e0);color:#021016;border:0;box-shadow:0 10px 30px rgba(25,211,197,.28)}
.btn.vio{background:linear-gradient(135deg,var(--violet),#b36bff);color:#fff;border:0;box-shadow:0 10px 30px rgba(124,92,255,.3)}
.btn.ghost{background:transparent}
.btn.block{width:100%}
.btn.lg{padding:16px 22px;font-size:17px;border-radius:16px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
/* karşılama */
.hero{min-height:calc(100vh - 120px);display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
@media(max-width:860px){.hero{grid-template-columns:1fr}}
.hero p.lead{font-size:18px;color:#c6d1e4;max-width:560px}
.grad{background:linear-gradient(120deg,var(--teal),var(--violet) 50%,var(--coral));-webkit-background-clip:text;background-clip:text;color:transparent}
.feat{display:grid;gap:10px;margin:22px 0}
.feat div{display:flex;gap:12px;align-items:flex-start}
.feat i{font-style:normal;font-size:22px;width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:var(--panel);border:1px solid var(--line);flex:0 0 auto}
.showcase{position:relative;aspect-ratio:1;width:100%;max-width:460px;margin:auto;overflow:hidden;border-radius:50%}
.showcase .ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(25,211,197,.25);animation:spin 18s linear infinite}
.showcase .ring:nth-child(2){inset:12%;border-color:rgba(124,92,255,.3);animation-duration:12s;animation-direction:reverse}
.showcase .sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(25,211,197,.35),transparent 20%);animation:spin 4s linear infinite;mask:radial-gradient(circle,transparent 20%,#000 21%)}
.showcase img{position:absolute;inset:22%;width:56%;height:56%;object-fit:cover;border-radius:50%;filter:contrast(1.1);box-shadow:0 0 60px rgba(25,211,197,.25)}
.showcase .blip{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 0 rgba(255,107,107,.6);animation:blip 2s infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes blip{0%{box-shadow:0 0 0 0 rgba(255,107,107,.6)}100%{box-shadow:0 0 0 22px rgba(255,107,107,0)}}
/* ana üs */
.daily{position:relative;overflow:hidden;padding:24px;background:linear-gradient(135deg,rgba(25,211,197,.16),rgba(124,92,255,.14));border-color:rgba(25,211,197,.28)}
.daily:after{content:"🩺";position:absolute;right:-10px;bottom:-24px;font-size:140px;opacity:.08;transform:rotate(-14deg)}
.dailyrow{display:flex;gap:20px;align-items:center}
.ring-wrap{position:relative;width:96px;height:96px;flex:0 0 auto}
.ring-wrap b{position:absolute;inset:0;display:grid;place-items:center;font-size:20px}
.modes{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.mode{position:relative;overflow:hidden;cursor:pointer;min-height:132px;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .18s,border-color .18s}
.mode:hover{transform:translateY(-3px);border-color:var(--line2)}
.mode .ic{position:absolute;right:12px;top:10px;font-size:40px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.4))}
.mode b{font-size:17px}.mode span{color:var(--mut);font-size:13px}
.mode:before{content:"";position:absolute;inset:0;background:radial-gradient(260px 120px at 100% 0%,var(--g,rgba(25,211,197,.18)),transparent 70%)}
.mode .tag{position:absolute;left:12px;top:12px;font-size:11px;font-weight:800;letter-spacing:.08em;padding:3px 8px;border-radius:999px;background:rgba(0,0,0,.35);color:var(--amber)}
.lb{display:grid;gap:6px}
.lbr{display:grid;grid-template-columns:30px 32px 1fr auto;gap:10px;align-items:center;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.025)}
.lbr.me{background:rgba(25,211,197,.14);border:1px solid rgba(25,211,197,.35)}
.lbr .rk{font-weight:800;color:var(--mut);text-align:center}
.lbr .av{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--c);font-size:16px}
.lbr .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.lbr .nm small{display:block;color:var(--mut);font-weight:400;font-size:11.5px;overflow:hidden;text-overflow:ellipsis}
.lbr .v{font-weight:800;font-variant-numeric:tabular-nums}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}
.bdg{aspect-ratio:1;border-radius:14px;display:grid;place-items:center;font-size:28px;background:rgba(255,255,255,.04);border:1px solid var(--line);position:relative}
.bdg.off{filter:grayscale(1);opacity:.28}
.bdg[title]:hover{border-color:var(--amber)}
.bar{height:8px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--teal),var(--violet))}
.pilot{font-size:12px;color:var(--mut);text-align:center;margin-top:26px;line-height:1.6}
/* soru ekranı */
.play{max-width:860px;margin:0 auto}
.phead{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.x{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--panel);border:1px solid var(--line);cursor:pointer;font-size:18px}
.dots{display:flex;gap:4px;flex:1}
.dots i{flex:1;height:7px;border-radius:9px;background:rgba(255,255,255,.08)}
.dots i.ok{background:var(--green)}.dots i.no{background:var(--coral)}.dots i.cur{background:var(--teal);box-shadow:0 0 12px var(--teal)}.dots i.sk{background:#556}
.combo{font-weight:900;color:var(--amber);min-width:62px;text-align:right}
.qcard{padding:24px}
.qmeta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.pill{font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.06);color:#b8c4d8}
.pill.t{background:rgba(124,92,255,.18);color:#cbbdff}.pill.r{background:rgba(58,160,255,.18);color:#a9d3ff}
.stem{font-size:clamp(17px,2.4vw,20px);line-height:1.5;margin:4px 0 18px;font-weight:600}
.opts{display:grid;gap:10px}
.opt{display:flex;gap:12px;align-items:center;text-align:left;padding:14px 16px;border-radius:14px;border:1px solid var(--line2);background:rgba(255,255,255,.03);cursor:pointer;transition:all .15s;font-size:15.5px;line-height:1.35}
.opt:hover:not(:disabled){background:rgba(255,255,255,.07);border-color:rgba(25,211,197,.45);transform:translateX(3px)}
.opt .k{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-weight:900;background:rgba(255,255,255,.07);flex:0 0 auto;font-size:13px}
.opt.sel{border-color:var(--teal);background:rgba(25,211,197,.12)}
.opt.ok{border-color:var(--green);background:rgba(61,220,151,.16)}.opt.ok .k{background:var(--green);color:#03170e}
.opt.no{border-color:var(--coral);background:rgba(255,107,107,.14)}.opt.no .k{background:var(--coral);color:#260606}
.opt:disabled{cursor:default}
.conf{display:flex;gap:8px;align-items:center;margin-top:14px;flex-wrap:wrap}
.tog{padding:8px 12px;border-radius:12px;border:1px solid var(--line2);background:transparent;cursor:pointer;font-weight:700;font-size:13px}
.tog.on{background:rgba(255,197,66,.16);border-color:var(--amber);color:var(--amber)}
.fb{margin-top:16px;padding:18px;border-radius:16px;border:1px solid var(--line2);animation:up .28s ease}
.fb.ok{background:linear-gradient(135deg,rgba(61,220,151,.14),rgba(25,211,197,.06));border-color:rgba(61,220,151,.4)}
.fb.no{background:linear-gradient(135deg,rgba(255,107,107,.14),rgba(124,92,255,.06));border-color:rgba(255,107,107,.4)}
.fb h2{display:flex;gap:10px;align-items:center}
.fb p{line-height:1.6;margin:8px 0}
.trap{display:inline-block;font-size:12px;font-weight:800;padding:4px 10px;border-radius:999px;background:rgba(255,197,66,.15);color:var(--amber);margin-top:4px}
@keyframes up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.xpf{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%);font-size:34px;font-weight:900;color:var(--amber);pointer-events:none;animation:xpf 1s ease forwards;text-shadow:0 6px 30px rgba(255,197,66,.6);z-index:50}
@keyframes xpf{0%{opacity:0;transform:translate(-50%,-30%) scale(.7)}25%{opacity:1;transform:translate(-50%,-60%) scale(1.1)}100%{opacity:0;transform:translate(-50%,-120%) scale(1)}}
/* radyoloji */
.rad{position:relative;width:100%;max-width:560px;margin:0 auto 14px;aspect-ratio:1;border-radius:16px;overflow:hidden;background:#000;border:1px solid var(--line2);cursor:crosshair;touch-action:manipulation}
.rad img{position:absolute;inset:0;width:100%;height:100%;image-rendering:auto;user-select:none;-webkit-user-drag:none}
.rad .ov{opacity:0;transition:opacity .4s}.rad .ov.show{opacity:1}
.pin{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:3px solid var(--amber);box-shadow:0 0 0 3px rgba(0,0,0,.5),0 0 18px var(--amber);pointer-events:none}
.pin:after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:var(--amber)}
.pin.ok{border-color:var(--green);box-shadow:0 0 0 3px rgba(0,0,0,.5),0 0 18px var(--green)}.pin.ok:after{background:var(--green)}
.pin.no{border-color:var(--coral);box-shadow:0 0 0 3px rgba(0,0,0,.5),0 0 18px var(--coral)}.pin.no:after{background:var(--coral)}
.marker{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:3px solid #ffd84d;box-shadow:0 0 0 3px rgba(0,0,0,.55);animation:mk 1.4s infinite;pointer-events:none}
.marker:before{content:"";position:absolute;left:50%;top:-26px;width:3px;height:20px;margin-left:-1.5px;background:#ffd84d;box-shadow:0 0 0 2px rgba(0,0,0,.5)}
@keyframes mk{50%{transform:scale(1.12)}}
.radcap{position:absolute;left:10px;bottom:8px;font-size:11px;color:#cfd8e6;background:rgba(0,0,0,.55);padding:3px 8px;border-radius:8px;pointer-events:none}
.orient{position:absolute;top:8px;font-size:12px;font-weight:900;color:#ffd84d;background:rgba(0,0,0,.55);padding:2px 7px;border-radius:6px;pointer-events:none}
/* zamanlayıcı */
.timer{position:relative;width:46px;height:46px;flex:0 0 auto}
.timer b{position:absolute;inset:0;display:grid;place-items:center;font-weight:900;font-size:14px}
/* düello */
.vs{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin-bottom:14px}
.side{display:flex;gap:10px;align-items:center;padding:12px;border-radius:16px;background:var(--panel);border:1px solid var(--line)}
.side.r{flex-direction:row-reverse;text-align:right}
.side .sc{font-size:26px;font-weight:900;font-variant-numeric:tabular-nums;margin-left:auto}
.side.r .sc{margin-left:0;margin-right:auto}
.side small{display:block;color:var(--mut);font-size:12px}
.vsx{font-weight:900;font-size:20px;color:var(--coral)}
.st{font-size:12px;font-weight:800;color:var(--mut)}.st.done{color:var(--green)}
.radar{width:240px;height:240px;margin:30px auto;position:relative;border-radius:50%;border:1px solid rgba(25,211,197,.3);background:radial-gradient(circle,rgba(25,211,197,.08),transparent 70%)}
.radar:before,.radar:after{content:"";position:absolute;inset:25%;border-radius:50%;border:1px solid rgba(25,211,197,.2)}
.radar:after{inset:45%}
.radar .sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(25,211,197,.45),transparent 25%);animation:spin 2s linear infinite}
.radar .me{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:40px}
.big{font-size:clamp(40px,8vw,72px);font-weight:900;letter-spacing:-.03em}
.count{font-size:120px;font-weight:900;text-align:center;animation:pop .9s ease infinite}
@keyframes pop{0%{transform:scale(.6);opacity:0}30%{transform:scale(1.1);opacity:1}100%{transform:scale(1);opacity:.9}}
/* canlı oda */
.code{font-size:clamp(46px,10vw,96px);font-weight:900;letter-spacing:.14em;text-align:center;background:linear-gradient(120deg,var(--amber),var(--coral));-webkit-background-clip:text;background-clip:text;color:transparent}
.plist{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.plist span{padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--line);font-weight:600;animation:up .3s}
.dist{display:grid;gap:8px}
.dist div{display:grid;grid-template-columns:28px 1fr 50px;gap:10px;align-items:center}
.dist .fill{height:26px;border-radius:8px;background:rgba(255,255,255,.08);position:relative;overflow:hidden}
.dist .fill i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,var(--violet),var(--blue));border-radius:8px;transition:width .6s}
.dist .fill.ok i{background:linear-gradient(90deg,var(--green),var(--teal))}
.podium{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;align-items:end;max-width:560px;margin:20px auto}
.podium div{text-align:center;padding:14px 8px;border-radius:16px 16px 6px 6px;background:var(--panel2);border:1px solid var(--line)}
.podium .p1{min-height:190px;background:linear-gradient(180deg,rgba(255,197,66,.25),var(--panel2))}
.podium .p2{min-height:150px}.podium .p3{min-height:120px}
.podium b{display:block;font-size:34px}
input.in,select.in{width:100%;padding:13px 14px;border-radius:14px;border:1px solid var(--line2);background:rgba(255,255,255,.04);outline:none}
input.in:focus,select.in:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(25,211,197,.18)}
select.in option{background:#101828}
.pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px}
.pick button{aspect-ratio:1;border-radius:14px;border:2px solid transparent;background:rgba(255,255,255,.05);font-size:26px;cursor:pointer}
.pick button.on{border-color:var(--teal);background:rgba(25,211,197,.14)}
.colors{display:flex;gap:10px;flex-wrap:wrap}
.colors button{width:34px;height:34px;border-radius:50%;border:3px solid transparent;cursor:pointer}
.colors button.on{border-color:#fff}
.tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.tabs button{padding:9px 14px;border-radius:12px;border:1px solid var(--line);background:transparent;cursor:pointer;font-weight:700}
.tabs button.on{background:var(--panel2);border-color:var(--line2);color:var(--teal)}
.subjects{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
.subj{cursor:pointer;display:flex;gap:10px;align-items:center;padding:14px}
.subj i{font-style:normal;font-size:26px}
.subj small{display:block;color:var(--mut);font-size:12px}
#toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--line2);padding:12px 18px;border-radius:14px;font-weight:700;box-shadow:var(--shadow);z-index:60;transition:opacity .3s;max-width:calc(100vw - 32px)}
.modal{position:fixed;inset:0;background:rgba(3,6,12,.72);display:grid;place-items:center;z-index:40;padding:16px;backdrop-filter:blur(4px)}
.modal .card{width:100%;max-width:460px}
.badgepop{position:fixed;inset:0;display:grid;place-items:center;z-index:45;background:rgba(3,6,12,.6);animation:up .3s}
.badgepop .card{text-align:center;padding:30px;max-width:340px}
.badgepop .ic{font-size:80px;animation:pop .8s}
canvas#confetti{position:fixed;inset:0;pointer-events:none;z-index:55}
.kbd{font-size:11px;color:var(--mut)}
.stat3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:center}
.stat3 div{padding:12px;border-radius:14px;background:rgba(255,255,255,.04)}
.stat3 b{display:block;font-size:24px}
@media(max-width:560px){#app{padding:12px 12px 50px}.qcard{padding:16px}.top .chip.hide-s{display:none}.dailyrow{flex-direction:column;align-items:flex-start}}
/* ---- v2: dil, lobi, görevler, rapor, paylaşım ---- */
.langsw{cursor:pointer;gap:2px;padding:5px 6px}.langsw b{padding:3px 7px;border-radius:999px;font-size:12px;color:var(--mut)}.langsw b.on{background:var(--teal);color:#061018}
.chip.warn{color:var(--amber);border-color:rgba(255,197,66,.3)}
.pulse{animation:pulse 2.2s ease-in-out infinite}@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(25,211,197,.45)}50%{box-shadow:0 0 0 12px rgba(25,211,197,0)}}
.clickable{cursor:pointer;transition:transform .15s,border-color .15s}.clickable:hover{transform:translateY(-2px);border-color:var(--line2)}
.quests{display:grid;gap:10px;margin-top:8px}
.quest{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.035);border:1px solid var(--line)}
.quest.done{border-color:rgba(61,220,151,.45);background:rgba(61,220,151,.08)}.quest.done .bar i{background:var(--green)}
.qi{font-size:24px;width:34px;text-align:center;flex:0 0 auto}
.qv{text-align:right;font-weight:800;min-width:62px}.qv small{display:block;color:var(--amber);font-weight:700;font-size:11.5px}
.progmini{display:flex;align-items:center;gap:16px;margin-top:8px}
.ob3{grid-template-columns:1fr 1.6fr 1fr}@media(max-width:760px){.ob3{grid-template-columns:1fr}}
input.in:disabled{opacity:.5}
.lobby{max-width:640px}.lobbypos{display:flex;flex-direction:column;align-items:center;gap:2px}.lobbypos b{font-size:64px;line-height:1.05;background:linear-gradient(135deg,var(--teal),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.disagree{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;padding:10px 12px;border-radius:12px;border:1px dashed rgba(255,197,66,.45);background:rgba(255,197,66,.06);font-size:13.5px}
.disagree span{flex:1;min-width:200px}
.linkbtn{background:none;border:0;color:var(--teal);cursor:pointer;font-weight:700;padding:2px 4px}.linkbtn:hover{text-decoration:underline}
.play.wide{max-width:1180px}
.rep2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.tiles{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:10px}
.tile{padding:14px;border-radius:16px;background:rgba(255,255,255,.035);border:1px solid var(--line);border-left:4px solid var(--tc,var(--line2))}
.tile i{font-style:normal;font-size:22px}
.bar.thin{height:5px}
.trow{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}.trow:last-child{border:0}
.heat{display:grid;grid-template-columns:repeat(14,1fr);gap:5px;margin-top:8px}
.heat i{aspect-ratio:1;border-radius:5px;background:rgba(25,211,197,calc(.08 + var(--a) * .85));border:1px solid var(--line)}
.rec{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.rec:last-child{border:0}
.st{padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700;background:rgba(255,255,255,.06)}
.st-open{color:var(--amber)}.st-fixed{color:var(--green)}.st-reviewed{color:var(--blue)}.st-rejected{color:var(--mut)}
.modal.wide .card{max-width:640px}
.sharepv{width:100%;border-radius:14px;border:1px solid var(--line2);margin:8px 0}
.sharebtns{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}.sharebtns .btn{flex:1 1 140px;justify-content:center;text-align:center;text-decoration:none}
.btn.sx{background:#000;color:#fff}.btn.sli{background:#0a66c2;color:#fff}.btn.sfb{background:#1877f2;color:#fff}.btn.swa{background:#25d366;color:#062}.btn.stg{background:#29a9eb;color:#fff}
.chal h1{font-size:30px;margin:8px 0}
.mode{transition:transform .18s,box-shadow .18s}.mode:hover{box-shadow:0 14px 36px rgba(0,0,0,.35)}
.card.daily{background:linear-gradient(135deg,rgba(25,211,197,.14),rgba(124,92,255,.12) 60%,rgba(17,25,42,.72))}
.langgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin-top:8px}
.langgrid button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);cursor:pointer;text-align:start}
.langgrid button.on{border-color:var(--teal);background:rgba(25,211,197,.12)}.langgrid small{color:var(--mut);font-size:11px}
.pill.mt{color:var(--amber)}
[dir=rtl] .phead,[dir=rtl] .row{direction:rtl}[dir=rtl] .opt{text-align:right}[dir=rtl] .lbr .v{text-align:left}
/* uzman inceleme masası */
.rvtabs,.rvfilter{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 12px}.tog.on{background:var(--teal);color:#04121a;border-color:var(--teal)}
.rvchip{display:inline-block;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:800;background:rgba(255,197,66,.16);color:var(--amber);vertical-align:middle}.rvchip.approved{background:rgba(61,220,151,.16);color:var(--green)}.rvchip.changes{background:rgba(255,107,107,.16);color:var(--coral)}
.rvitems{display:grid;gap:6px}.rvitem{display:flex;justify-content:space-between;gap:10px;align-items:center;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:10px 12px;cursor:pointer;color:inherit}
.rvitem:hover{border-color:var(--line2)}.rvitem>span:first-child{display:flex;flex-direction:column;min-width:0}.rvitem small{display:block}.rvst{text-align:right;flex-shrink:0}
.rvgrid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:12px;align-items:start}.rvgrid aside .card+.card{margin-top:10px}.rvbody{overflow-x:auto;font-size:14px}.rvpair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rvdl{display:grid;grid-template-columns:minmax(90px,max-content) minmax(0,1fr);gap:4px 12px;margin:0}.rvdl dt{font-weight:800;color:var(--teal);word-break:break-word}.rvdl dd{margin:0;word-break:break-word}.rvdl.d1,.rvdl.d2,.rvdl.d3{padding-left:8px;border-left:2px solid var(--line2)}
.rvlist{margin:0;padding-left:20px}.rvlist li{margin:3px 0}.rvact{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;align-items:center}.rvact input{flex:1;min-width:180px}.rvrow{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.rvgrid textarea,.rvact input{width:100%;background:var(--bg2);color:var(--txt);border:1px solid var(--line2);border-radius:10px;padding:8px 10px;font:inherit}
@media (max-width:900px){.rvgrid,.rvpair{grid-template-columns:1fr}}
/* 2026-09-28 · tam genişlik: geniş ekranlarda ortadaki küçük kutu yerine ekranı kullanan düzen (radyoloji görüntüsü solda büyük,
   soru ve seçenekler sağda; metin sorularında seçenekler iki sütun). Dar ekranlarda eski tek sütun düzeni aynen kalır. */
#app{max-width:none;padding:18px clamp(16px,3vw,48px) 60px}
.play{max-width:min(1100px,100%)}
.play.wide{max-width:none}
@media (min-width:1100px){
  .qcard{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:28px;align-items:start}
  .qcard>*{grid-column:1/-1}
  .qcard>.opts{grid-template-columns:1fr 1fr}
  .play:has(.qcard .rad){max-width:min(1560px,100%)}
  .qcard:has(>.rad)>.stem{grid-column:2;grid-row:2}
  .qcard:has(>.rad)>.rad{grid-column:1;grid-row:2/span 3;width:min(100%,calc(100vh - 210px));max-width:none;margin:0 auto 0 0}
  .qcard:has(>.rad)>.opts,.qcard:has(>.rad)>#confirm{grid-column:2;grid-row:3;grid-template-columns:1fr}
  .qcard:has(>.rad)>.conf{grid-column:2;grid-row:4}
}
@media (min-width:1600px){.stem{font-size:22px}.opt{font-size:17px;padding:16px 18px}.qcard{padding:30px}}
/* 2026-09-28 · Portal ile tek görünüm: açık tema (İçerik Merkezi paleti, Plus Jakarta Sans) ve portal üst çubuğuna benzeyen
   beyaz, yapışkan üst çubuk + "Panele dön". Oyun renkleri (turkuaz/mor/mercan) vurgu olarak kalır; radyoloji görüntüsü koyu kalır. */
:root{
  --bg:#F4F7FB;--bg2:#FFFFFF;--panel:#FFFFFF;--panel2:#F1F5F9;--line:#E6EBF2;--line2:#D5DEEA;
  --txt:#0F172A;--mut:#64748B;--teal:#0D9488;--violet:#6D5DFC;--coral:#E5484D;--amber:#B45309;--green:#16A34A;--blue:#2563EB;--pink:#DB2777;
  --shadow:0 6px 24px rgba(15,23,42,.06);
}
html,body{font-family:'Plus Jakarta Sans','Inter',system-ui,-apple-system,'Segoe UI',sans-serif}
#bg{background:radial-gradient(900px 500px at 12% -10%,rgba(109,93,252,.08),transparent 60%),radial-gradient(800px 500px at 110% 10%,rgba(13,148,136,.07),transparent 60%),var(--bg)}
#bg:before{background-image:radial-gradient(#E3E9F2 1px,transparent 1px);background-size:22px 22px;mask-image:none;opacity:1}
#bg svg{opacity:.10}
.card{backdrop-filter:none}
.top{position:sticky;top:0;z-index:30;margin:-18px calc(-1 * clamp(16px,3vw,48px)) 18px;padding:10px clamp(16px,3vw,48px);background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);box-shadow:0 6px 24px rgba(15,23,42,.05);backdrop-filter:blur(10px)}
.top .back{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:10px;color:var(--mut);font-weight:700;text-decoration:none;font-size:14px}
.top .back:hover{background:#EEF2F7;color:var(--txt)}
.chip.fire{color:#C2410C}
.avatar,.bdg,.stat3 div,.quest,.tile,.langgrid button,.opt,.pick button{background:#F8FAFC}
.hero p.lead{color:#475569}
.lbr,.opt .k,.pill,.plist span,.st{background:#F1F5F9}
.pill{color:#475569}.pill.t{background:#EEEBFF;color:#5B4BD8}.pill.r{background:#E8F1FF;color:#1D4ED8}
.bar,.dots i,.dist .fill{background:#E2E8F0}
.dots i.sk{background:#94A3B8}
.opt:hover:not(:disabled){background:#F0FDFA}
.opt.ok .k{color:#fff}.opt.no .k{color:#fff}
.btn:hover{filter:brightness(1.03)}
.btn.pri{color:#fff;background:linear-gradient(135deg,#0D9488,#0EA5E9);box-shadow:0 10px 24px rgba(13,148,136,.22)}
.mode .tag{background:#FFF7ED;color:#B45309}
.mode .ic{filter:none}
.mode:hover{box-shadow:0 14px 30px rgba(15,23,42,.10)}
.card.daily{background:linear-gradient(135deg,#E6FFFA,#EEF2FF 60%,#FFFFFF);border-color:#B2F0E6}
input.in,select.in{background:#fff}
select.in option{background:#fff}
.colors button.on{border-color:#0F172A}
.modal,.badgepop{background:rgba(15,23,42,.45)}
.langsw b.on,.tog.on{color:#fff}
.rvgrid textarea,.rvact input{background:#fff}
.xpf{text-shadow:0 6px 20px rgba(180,83,9,.25)}

/* 2026-10-02 · oyunlaştırma: durum çipleri, sıradaki adım, ligler, rekorlar, kutlama */
.daily .status{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;position:relative;z-index:1}
.daily .status .chip{background:#fff;border-color:#E2E8F0}.daily .status .chip small{font-weight:600;color:var(--mut);margin-left:2px}
.chip.shield{color:#1D4ED8;cursor:pointer}.chip.lgchip{color:#7C3AED;cursor:pointer}.chip.pct{color:#0F766E;background:#F0FDFA!important;border-color:#CCFBF1!important}
#pctChips{display:contents}
.nextwrap{padding:0;overflow:hidden;border-color:#C7D2FE;background:linear-gradient(135deg,#EEF2FF,#F0FDFA)}.nextwrap .nextc{border-radius:0}
.nextc{display:flex;gap:14px;align-items:center;padding:16px 18px;background:linear-gradient(135deg,#EEF2FF,#F0FDFA);border-radius:16px}
.nextc .ni{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:26px;background:#fff;box-shadow:0 4px 14px rgba(15,23,42,.08);flex:none}
.nextc small{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#6D5DFC}
.nextc b{display:block;font-size:16.5px;margin:2px 0}
.nextc.skel{opacity:.6}
.lghead{display:grid;gap:4px;justify-items:start;margin-bottom:8px}.lghead.lgbig{justify-items:center;text-align:center}
.lgladder{display:flex;gap:4px;font-size:18px;align-items:center}.lgladder span{opacity:.28;filter:grayscale(1)}.lgladder span.past{opacity:.6;filter:none}
.lgladder span.on{opacity:1;filter:none;transform:scale(1.35);margin:0 6px}
.lghead.lgbig .lgladder{font-size:28px;margin-bottom:6px}
.lgstat{font-weight:700;margin:6px 0 10px;color:#334155}
.lgr.up{box-shadow:inset 3px 0 0 #16A34A}.lgr.down{box-shadow:inset 3px 0 0 #E5484D}
.lgr.up .rk{color:#16A34A}.lgr.down .rk{color:#E5484D}
.lglegend{display:flex;gap:14px;justify-content:center;margin-top:10px;font-size:12px;color:var(--mut)}
.lglegend span:before{content:"";display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.lglegend .up:before{background:#16A34A}.lglegend .down:before{background:#E5484D}
.recs{margin-top:16px;padding:12px 14px;border-radius:14px;background:#FFFBEB;border:1px solid #FDE68A;text-align:left}
.recs small{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#B45309}
.recs div{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}.recs span{background:#fff;border:1px solid #FDE68A;border-radius:999px;padding:5px 11px;font-weight:700;font-size:13.5px}
.recs .new{background:#F59E0B;color:#fff;border:0;padding:1px 7px;font-size:11px;margin-left:4px}
.cele .card{text-align:center;max-width:420px;background:linear-gradient(180deg,#FFFBEB,#fff 45%)}
.cele .burst{font-size:76px;line-height:1;animation:pop .6s cubic-bezier(.2,1.6,.4,1)}
@keyframes pop{0%{transform:scale(.2) rotate(-20deg);opacity:0}100%{transform:scale(1) rotate(0);opacity:1}}
@media(max-width:600px){.nextc{flex-wrap:wrap}.nextc .btn{width:100%}}

/* 2026-10-02 · görsel yenileme: güçlü Günlük Vizit kartı, renkli mod kartları, canlı soru başlığı, profil kapağı */
.card{border-radius:20px}
.card.daily{background:linear-gradient(125deg,#0B3B6E 0%,#1D4ED8 42%,#0D9488 100%);border:0;color:#fff;box-shadow:0 18px 40px rgba(29,78,216,.25)}
.card.daily:after{content:"🩺";opacity:.12;filter:grayscale(1) brightness(3)}
.card.daily:before{content:"";position:absolute;inset:0;background:radial-gradient(420px 220px at 85% -20%,rgba(255,255,255,.22),transparent 70%),radial-gradient(300px 200px at -5% 120%,rgba(94,234,212,.25),transparent 70%);pointer-events:none}
.card.daily h3{color:#BFDBFE}.card.daily h2{color:#fff}.card.daily .mut{color:#DBEAFE}
.card.daily .ring-wrap b{color:#fff}.card.daily .ring-wrap circle:first-child{stroke:rgba(255,255,255,.22)}
.card.daily .btn.pri{background:#fff;color:#0F3D7A;box-shadow:0 10px 26px rgba(2,6,23,.25)}
.card.daily .status .chip{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.25);color:#fff;backdrop-filter:blur(6px)}
.card.daily .status .chip small{color:#DBEAFE}
.card.daily .status .chip.pct{background:rgba(255,255,255,.14)!important;border-color:rgba(255,255,255,.25)!important;color:#fff}
.dailyrow{position:relative;z-index:1}
/* mod kartları */
.modes{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.mode{min-height:150px;justify-content:flex-start;gap:4px;padding:18px;border-top:3px solid var(--mc,#0D9488)}
.mode:before{background:radial-gradient(240px 140px at 100% 0%,color-mix(in srgb,var(--mc,#0D9488) 12%,transparent),transparent 70%)}
.mode .ic{position:static;width:50px;height:50px;border-radius:15px;display:grid;place-items:center;font-size:26px;margin-bottom:10px;
  background:color-mix(in srgb,var(--mc,#0D9488) 13%,#fff);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mc,#0D9488) 22%,transparent)}
.mode b{font-size:16.5px;position:relative}.mode span:not(.ic):not(.tag){position:relative;line-height:1.4}
.mode .tag{left:auto;right:12px;top:14px;background:color-mix(in srgb,var(--mc,#0D9488) 12%,#fff);color:var(--mc,#0D9488)}
.mode .go{position:absolute;right:16px;bottom:14px;font-style:normal;font-weight:900;color:var(--mc,#0D9488);opacity:0;transform:translateX(-6px);transition:all .18s}
.mode:hover .go,.mode:focus .go{opacity:1;transform:none}
.mode:hover{box-shadow:0 16px 34px color-mix(in srgb,var(--mc,#0D9488) 18%,transparent)}
/* soru ekranı */
.phead{background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px 14px;box-shadow:var(--shadow)}
.rbar{flex:1;display:grid;gap:6px;min-width:0}
.rtitle{display:flex;justify-content:space-between;align-items:baseline;font-size:13px}.rtitle b{font-size:14px}.rtitle span{color:var(--mut);font-weight:700}
.rxp{font-weight:900;color:#B45309;background:#FFFBEB;border:1px solid #FDE68A;border-radius:999px;padding:5px 11px;font-size:13.5px;white-space:nowrap}
.rxp.bump{animation:bump .45s ease}@keyframes bump{40%{transform:scale(1.22)}}
.combo{min-width:0}.combo.on{background:#FFF7ED;color:#C2410C;border-radius:999px;padding:5px 11px;font-size:13.5px;animation:bump .45s ease}
.qcard{position:relative;overflow:hidden;border:0;box-shadow:0 14px 40px rgba(15,23,42,.08)}
.qcard:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#0D9488,#2563EB,#6D5DFC)}
.stem{font-size:clamp(18px,2.4vw,22px);font-weight:700;color:#0F172A}
.opt{background:#fff;border:1.5px solid #E2E8F0;border-radius:16px;padding:15px 16px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.opt:hover:not(:disabled){border-color:#5EEAD4;background:#F0FDFA;transform:translateY(-1px);box-shadow:0 8px 18px rgba(13,148,136,.10)}
.opt .k{background:#EEF2FF;color:#4338CA;border-radius:10px}
.opt:hover:not(:disabled) .k{background:#0D9488;color:#fff}
.dots i{height:8px}.dots i.cur{background:linear-gradient(90deg,#0D9488,#2563EB);box-shadow:none}
/* profil kapağı ve rozetler */
.phero{display:flex;gap:20px;align-items:center;flex-wrap:wrap;padding:26px;border:0;color:#fff;
  background:linear-gradient(125deg,#3B1D8F,#1D4ED8 55%,#0D9488);box-shadow:0 18px 40px rgba(59,29,143,.22)}
.phero h2{color:#fff;font-size:26px;margin:2px 0 4px}.phero .mut{color:#E0E7FF!important}.phero .small.mut{color:#C7D2FE!important}
.phero .pkick{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#A5F3FC}
.phero .avatar{background:rgba(255,255,255,.15);border-color:#fff;box-shadow:0 0 0 6px rgba(255,255,255,.12)}
.phero .bar{background:rgba(255,255,255,.2)}.phero .bar i{background:linear-gradient(90deg,#FDE68A,#F59E0B)}
.badges{grid-template-columns:repeat(auto-fill,minmax(78px,1fr))}
.bdg{aspect-ratio:auto;padding:10px 4px 8px;display:flex;flex-direction:column;gap:4px;font-size:28px}
.bdg small{font-size:10.5px;font-weight:700;line-height:1.2;text-align:center;color:#475569}
.bdg.got{background:linear-gradient(160deg,#FFFBEB,#FEF3C7);border-color:#FCD34D;box-shadow:0 6px 14px rgba(245,158,11,.15)}
.bdg.off{filter:grayscale(1);opacity:.45}
@media(max-width:560px){.phead{flex-wrap:wrap}.rxp,.combo.on{font-size:12px;padding:4px 8px}.phero{padding:18px}}

/* 2026-10-02 · ücretsiz katman: kullanım satırı, teklif kartı, kota penceresi */
.usage{font-size:12.5px;font-weight:700;color:#475569;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 12px}
.usage a{font-weight:800}
.offer{display:flex;gap:14px;margin-top:16px;padding:16px 18px;border-radius:18px;text-align:left;background:linear-gradient(135deg,#FFF7ED,#FDF2F8);border:1px solid #FED7AA}
.offer .oi{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:26px;background:#fff;flex:none;box-shadow:0 4px 14px rgba(15,23,42,.08)}
.offer b{font-size:16px}.offer p{margin:4px 0 6px;color:#475569}.offer small{color:#94A3B8;font-size:11.5px}
.offer ul,.qmodal .perks{margin:6px 0;padding-left:18px;color:#334155;font-size:13.5px}.offer li,.qmodal li{margin:2px 0}
.qmodal{text-align:center;max-width:440px}.qmodal .qic{font-size:54px;text-align:center;display:block}a.btn{text-decoration:none}.qmodal .perks{text-align:left;display:inline-block}
.qbar{height:8px;border-radius:9px;background:#FEE2E2;overflow:hidden;margin:12px 0 6px}.qbar i{display:block;height:100%;background:linear-gradient(90deg,#F59E0B,#E5484D)}
.qfree{margin:10px 0 4px;padding:8px 12px;border-radius:12px;background:#F0FDFA;color:#0F766E;font-weight:700;font-size:13.5px}

/* 2026-10-10 · Kod Mavi · İleri Yaşam Desteği (client/ils.js): koyu resüsitasyon monitörü, öğretmen ekranı, ekip yarışı */
.ils{--mon:#04070d;--monl:#16202f}
.ils-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:22px;align-items:center;padding:26px;border-radius:24px;margin-bottom:18px;color:#fff;
  background:radial-gradient(500px 260px at 0% 0%,rgba(229,72,77,.45),transparent 70%),linear-gradient(135deg,#1A0B12 0%,#3B0D18 45%,#0B1B33 100%);box-shadow:0 20px 50px rgba(59,13,24,.35)}
.ils-hero .kick{font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#FCA5A5}
.ils-hero h1{color:#fff;font-size:clamp(28px,4vw,42px);margin:8px 0}.ils-hero p{color:#FDE2E4;line-height:1.6;margin:0 0 14px}
.ils-hero-chips{display:flex;gap:8px;flex-wrap:wrap}.ils-hero-chips span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:6px 12px;font-weight:700;font-size:13px}
.ils-hero-mon .ils-mon{margin:0}
.ils-cols{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:16px}
.ils-scen{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin:12px 0}
.ils-scen button{position:relative;text-align:left;border:1.5px solid var(--line2);background:#fff;border-radius:16px;padding:14px 14px 12px 58px;cursor:pointer;transition:all .15s;display:flex;flex-direction:column;gap:3px}
.ils-scen button i{position:absolute;left:12px;top:14px;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-style:normal;font-size:20px;background:color-mix(in srgb,var(--sc) 14%,#fff)}
.ils-scen button small{color:var(--mut);line-height:1.35}.ils-scen button span{font-size:11.5px;font-weight:800;color:var(--sc)}
.ils-scen button.on{border-color:var(--sc);background:color-mix(in srgb,var(--sc) 7%,#fff);box-shadow:0 8px 22px color-mix(in srgb,var(--sc) 18%,transparent)}
.ils-scen button.on:after{content:"✓";position:absolute;right:10px;top:8px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--sc);color:#fff;font-weight:900;font-size:12px}
.ils-set{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.ils-set label{display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:700;color:var(--mut)}
.ils-set .ck{grid-column:1/-1;flex-direction:row;align-items:center;gap:8px;color:var(--txt)}
.ils-solo{display:grid;gap:8px}.ils-grp{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut,#64748b);margin:14px 0 6px}.ils-solo .btn{justify-content:flex-start;border-left:4px solid var(--sc);background:#fff}
/* monitör */
.ils-mon{display:grid;grid-template-columns:minmax(0,1fr) 150px;background:var(--mon,#04070d);border:1px solid #1f2a3d;border-radius:20px;overflow:hidden;box-shadow:0 18px 40px rgba(2,6,23,.35),inset 0 0 0 1px rgba(255,255,255,.03);margin-bottom:14px}
.ils-mon.big{grid-template-columns:minmax(0,1fr) 190px}
.ils-scr{display:flex;flex-direction:column;min-width:0;border-right:1px solid #16202f}
.ils-scrtop{display:flex;gap:10px;align-items:center;padding:8px 12px;font:700 11.5px ui-monospace,Consolas,monospace;color:#64748B;letter-spacing:.06em}
.ils-scrtop .ils-clock{margin-left:auto;color:#E2E8F0}.ils-cpr{color:#FCA5A5;animation:ilsblink 1s steps(2) infinite}
.ils-cv{display:block;width:100%;height:200px}.ils-mon.big .ils-cv{height:clamp(220px,32vh,330px)}
.ils-vit{display:grid;grid-auto-rows:1fr;position:relative}
.ils-vit .v{padding:8px 12px;border-bottom:1px solid #16202f;display:flex;flex-direction:column;justify-content:center}
.ils-vit small{font:700 10.5px ui-monospace,Consolas,monospace;letter-spacing:.06em;opacity:.85}
.ils-vit b{font:800 30px/1.05 ui-monospace,Consolas,monospace;font-variant-numeric:tabular-nums}.ils-mon.big .ils-vit b{font-size:40px}
.ils-vit .hr{color:#3ddc97}.ils-vit .sp{color:#22d3ee}.ils-vit .bp{color:#F8FAFC}.ils-vit .bp b{font-size:22px}.ils-mon.big .ils-vit .bp b{font-size:28px}.ils-vit .co{color:#facc15}
.ils-heart{font-style:normal;display:inline-block}.ils-heart.on{animation:ilsbeat .3s ease}@keyframes ilsbeat{40%{transform:scale(1.6);color:#ff6b6b}}
.ils-mon.alarm .ils-vit .hr{background:rgba(229,72,77,.18);animation:ilsalarm 1s steps(2) infinite}@keyframes ilsalarm{50%{background:rgba(229,72,77,.42)}}
@keyframes ilsblink{50%{opacity:.35}}
.ils-snd{position:absolute;right:6px;bottom:6px;background:rgba(255,255,255,.06);border:1px solid #16202f;border-radius:9px;color:#94A3B8;cursor:pointer;padding:3px 7px;font-size:13px}
/* sahne */
.ils-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px 14px;margin-bottom:12px;box-shadow:0 6px 20px rgba(15,23,42,.06)}
.ils-sc{font-weight:800;padding:6px 12px;border-radius:999px;background:color-mix(in srgb,var(--sc) 12%,#fff);color:color-mix(in srgb,var(--sc) 80%,#000)}
.pill.crit{background:#FEE2E2;color:#B91C1C}.pill.okp{background:#DCFCE7;color:#15803D}
.ils-prog{flex:1;min-width:80px;max-width:260px;height:8px;border-radius:9px;background:#EEF2F6;overflow:hidden}.ils-prog i{display:block;height:100%;background:linear-gradient(90deg,#E5484D,#F59E0B);transition:width .5s}
.ils-prog.solo{max-width:none;margin:-4px 0 12px}
.ils-code{font:800 15px ui-monospace,Consolas,monospace;color:var(--mut)}
.ils-timer{position:relative;width:64px;height:64px}.ils-timer.sm{width:46px;height:46px}.ils-timer svg{width:100%;height:100%}
.ils-timer b{position:absolute;inset:0;display:grid;place-items:center;font-weight:900;font-size:18px}.ils-timer.sm b{font-size:14px}
.ils-main{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:14px;align-items:start}
.ils-case{position:relative;overflow:hidden}.ils-case:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(#E5484D,#F59E0B)}
.ils-case .story{font-size:16px;line-height:1.6;color:#334155;margin:0 0 10px}.ils-case .q{font-size:clamp(19px,2.2vw,24px);margin:0 0 12px;color:#0F172A}
.ils-stage .ils-case .story{font-size:clamp(16px,1.6vw,19px)}
.ils-opts{display:grid;gap:10px}.ils-opts.host{grid-template-columns:1fr 1fr;margin-top:2px}
.ils-opt{position:relative;display:flex;gap:12px;align-items:center;text-align:left;padding:14px 16px;border-radius:16px;border:1.5px solid #E2E8F0;background:#fff;font-size:15.5px;line-height:1.4;cursor:pointer;overflow:hidden;transition:all .15s;color:var(--txt);font-family:inherit;width:100%}
.ils-opt:before{content:"";position:absolute;inset:0 auto 0 0;width:var(--d,0);background:rgba(15,23,42,.05);transition:width .7s}
.ils-opt>*{position:relative}.ils-opt .k{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-weight:900;background:#FEE2E2;color:#B91C1C;flex:0 0 auto}
.ils-opt .dn{margin-left:auto;font-weight:900;font-variant-numeric:tabular-nums;color:var(--mut)}
button.ils-opt:hover:not(:disabled){border-color:#FCA5A5;background:#FFF5F5;transform:translateY(-1px)}
.ils-opts.host .ils-opt{cursor:default;font-size:clamp(15px,1.4vw,18px)}
.ils-opt.sel{border-color:#E5484D;background:#FFF1F2}
.ils-opt.ok{border-color:#16A34A;background:#F0FDF4}.ils-opt.ok:before{background:rgba(22,163,74,.14)}.ils-opt.ok .k{background:#16A34A;color:#fff}
.ils-opt.no{opacity:.75}.ils-opt.no .k{background:#E2E8F0;color:#475569}
.ils-opt.harm{border-color:#F59E0B;background:#FFFBEB}.ils-opt.harm:before{background:rgba(245,158,11,.16)}.ils-opt.harm .k{background:#F59E0B;color:#fff}
.ils-opt.harm:after{content:"⚠ ZARARLI";position:absolute;right:12px;top:6px;font-size:10px;font-weight:900;color:#B45309;letter-spacing:.08em}
html:not([lang="tr"]) .ils-opt.harm:after{content:"⚠ HARMFUL"}
.ils-opt:disabled{cursor:default}
.ils-ctl{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;padding:12px;border-radius:18px;background:#0F172A}
.ils-ctl .btn{background:#1E293B;color:#E2E8F0;border-color:#334155}.ils-ctl .btn.pri{background:linear-gradient(135deg,#E5484D,#F97316);color:#fff}.ils-ctl .btn.ghost{background:transparent}
.ils-stage.paused .ils-mon,.ils-play.paused .ils-mon{filter:saturate(.3) brightness(.7)}
.ils-stage.paused .ils-case:after,.ils-play.paused .ils-case:after{content:"⏸";position:absolute;inset:0;display:grid;place-items:center;font-size:64px;background:rgba(255,255,255,.7);backdrop-filter:blur(2px)}
.ils-rev{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:14px;margin-top:14px}
.ils-exp p{font-size:16px;line-height:1.65;margin:6px 0}.ils-harmnote{background:#FFFBEB;border-left:4px solid #F59E0B;padding:8px 12px;border-radius:10px;font-weight:700;color:#92400E}
.ils-next{margin-top:14px;background:linear-gradient(135deg,#0F172A,#1E1B4B);border:0;color:#fff}.ils-next h3{color:#C7D2FE}
.ils-next .btn.pri{background:linear-gradient(135deg,#16A34A,#0D9488);color:#fff}.btn.alt{background:linear-gradient(135deg,#F59E0B,#E5484D);color:#fff;border:0}.ils-next .btn.ghost{color:#E2E8F0;border-color:#475569}.ils-next .mut{color:#A5B4FC!important}
.ils-meter{display:grid;grid-template-columns:auto 1fr 34px;gap:8px;align-items:center;font-size:12.5px;font-weight:700;margin-top:8px}
.ils-meter .mb{height:10px;border-radius:9px;background:#EEF2F6;overflow:hidden}.ils-meter .mb i{display:block;height:100%;border-radius:9px;transition:width .8s}
.ils-meter b{text-align:right;font-variant-numeric:tabular-nums}
.ils-teams{display:grid;gap:8px;margin-top:10px}
.ils-teams .tr{display:grid;grid-template-columns:36px minmax(90px,140px) 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;background:#fff;border:1.5px solid color-mix(in srgb,var(--tc) 30%,#E2E8F0)}
.ils-teams .tr.me{box-shadow:0 0 0 3px color-mix(in srgb,var(--tc) 30%,transparent)}
.ils-teams .ti{font-size:22px;text-align:center}.ils-teams .tn small{display:block;color:var(--mut);font-size:11.5px}
.ils-teams .sb{height:12px;border-radius:9px;background:#EEF2F6;overflow:hidden}.ils-teams .sb i{display:block;height:100%;background:var(--tc);border-radius:9px;transition:width .8s}
.ils-teams .tb .ils-meter{margin-top:6px}.ils-teams .tsc{font-weight:900;font-size:20px;font-variant-numeric:tabular-nums}
.ils-team{display:inline-flex;gap:6px;align-items:center;padding:5px 12px;border-radius:999px;font-weight:800;background:color-mix(in srgb,var(--tc) 14%,#fff);color:color-mix(in srgb,var(--tc) 75%,#000)}
.ils-lobby{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:24px;align-items:center;padding:28px}.ils-lobby .lg{text-align:center}
.ils-intro{text-align:center;padding-top:60px}.ils-intro .ic{font-size:84px;filter:drop-shadow(0 12px 24px color-mix(in srgb,var(--sc) 40%,transparent));animation:pop .6s cubic-bezier(.2,1.6,.4,1)}
.ils-intro .count{color:var(--sc)}
.ils-wait{font-size:64px;margin:16px 0;animation:ilsbeat 1s ease infinite}
.ils-play .chip.score{color:#B45309}.chip.combo,.fb .combo{color:#C2410C;background:#FFF7ED;border-radius:999px;padding:4px 10px;font-size:14px}
.fb.harm{background:linear-gradient(135deg,#FFFBEB,#FEF3C7);border-color:#F59E0B}
.ils-outcome h2{font-size:24px}.ils-outs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.ils-outs span{padding:6px 12px;border-radius:12px;background:color-mix(in srgb,var(--tc) 10%,#fff)}
.ils-hard{display:flex;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line)}.ils-hard b{color:#E5484D;font-size:18px;min-width:52px}
@media(max-width:980px){.ils-hero,.ils-cols,.ils-main,.ils-rev,.ils-lobby{grid-template-columns:1fr}.ils-opts.host{grid-template-columns:1fr}}
@media(max-width:560px){.ils-mon,.ils-mon.big{grid-template-columns:1fr}.ils-scr{border-right:0}.ils-vit{grid-template-columns:repeat(4,1fr);grid-auto-rows:auto}.ils-vit .v{border-bottom:0;border-right:1px solid #16202f;padding:6px 8px}
  .ils-vit b,.ils-mon.big .ils-vit b{font-size:20px}.ils-vit .bp b,.ils-mon.big .ils-vit .bp b{font-size:15px}.ils-cv{height:150px}.ils-snd{display:none}.ils-set{grid-template-columns:1fr}.ils-teams .tr{grid-template-columns:30px 1fr auto}.ils-teams .tb{grid-column:1/-1}.ils-hero{padding:18px}.ils-bar .hide-s{display:none}}
@media(prefers-reduced-motion:reduce){.ils-heart.on,.ils-wait,.ils-cpr,.ils-mon.alarm .ils-vit .hr{animation:none}}
.ils-hard span small{display:block;color:var(--mut);font-size:11.5px}
#toast{pointer-events:none}