/* "Sitene oyun ekle" sayfası (19.10.2026): portalın bordo/altın diliyle, işlevsel çalışma tezgahı (sol ayarlar, sağ önizleme + kod). */
@font-face{font-family:"Limelight";src:url(/sahne/yazi/limelight.woff2) format("woff2");font-display:swap}
:root{--bordo:#2a0713;--bordo2:#4a0f26;--kadife:#6b1230;--altin:#ffc857;--altin2:#d99a2b;--fildisi:#f6ecd2;--yazi:#f4e6c8;--mute:#cdb890;--cizgi:rgba(255,200,87,.28);--yesil:#2fbf7d;--disp:"Limelight","Georgia",serif;--govde:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:radial-gradient(1200px 700px at 70% -10%,#5a1230 0,transparent 60%),linear-gradient(#1c0510,#12030a 60%,#0c0206);color:var(--yazi);font:16px/1.55 var(--govde);min-height:100vh}
a{color:var(--altin)}
.atla{position:absolute;left:-999px;top:8px;background:var(--altin);color:#2a0713;padding:8px 12px;border-radius:8px;z-index:99}.atla:focus{left:8px}
:focus-visible{outline:3px solid var(--altin);outline-offset:2px;border-radius:6px}
.ust{display:flex;align-items:center;gap:14px;padding:10px 18px;border-bottom:1px solid var(--cizgi);background:rgba(20,4,12,.8);position:sticky;top:0;z-index:20;backdrop-filter:blur(6px)}
.marka img{display:block;height:34px;width:auto;max-width:100%}
.gezin{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.gezin a{padding:8px 12px;border-radius:10px;text-decoration:none;color:var(--yazi);font-weight:600;font-size:15px}
.gezin a:hover{background:rgba(255,200,87,.12)}
main{max-width:1280px;margin:0 auto;padding:0 18px 40px}
.kahraman{padding:42px 0 22px;max-width:820px}
h1{font:400 clamp(34px,6vw,58px)/1.05 var(--disp);color:#ffe3a0;margin:0 0 14px;text-shadow:0 0 22px rgba(255,200,87,.35),0 3px 0 #6b3d08}
h2{font:400 clamp(24px,3.4vw,34px)/1.1 var(--disp);color:var(--altin);margin:34px 0 12px}
h3{margin:0 0 6px;font-size:17px;color:#ffe3a0}
.giris{font-size:18px;color:var(--yazi);margin:0 0 20px}
.adimlar{display:flex;gap:12px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.adimlar li{flex:1 1 180px;border:1px solid var(--cizgi);border-radius:14px;padding:12px 14px;background:rgba(74,15,38,.5);display:flex;flex-direction:column;counter-increment:a}
.adimlar{counter-reset:a}
.adimlar b{color:var(--altin)}.adimlar b::before{content:counter(a)". ";opacity:.8}
.adimlar span{color:var(--mute);font-size:14px}

.tezgah{display:grid;grid-template-columns:minmax(300px,440px) minmax(0,1fr);gap:22px;align-items:start;margin-top:10px}
.ayarlar{display:flex;flex-direction:column;gap:14px}
.kart{border:1px solid var(--cizgi);border-radius:16px;padding:14px 16px 16px;margin:0;background:linear-gradient(rgba(74,15,38,.55),rgba(42,7,19,.7))}
.kart legend{font:400 20px/1.1 var(--disp);color:var(--altin);padding:0 8px}
.hizli{display:flex;gap:8px;align-items:center;margin:4px 0 10px;flex-wrap:wrap}
.hizli button,.cihaz button,.sekmeler button{font:600 14px/1 var(--govde);color:var(--yazi);background:rgba(255,200,87,.08);border:1px solid var(--cizgi);border-radius:10px;padding:9px 12px;cursor:pointer}
.hizli button:hover,.cihaz button:hover,.sekmeler button:hover{background:rgba(255,200,87,.18)}
#sayi{color:var(--mute);font-size:14px;margin-left:auto}
.grup{margin:10px 0 4px}.grup>b{display:block;color:var(--mute);font-size:13px;letter-spacing:.3px;margin-bottom:6px}
.oyunlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(138px,1fr));gap:8px}
.oyun{position:relative}
.oyun input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.oyun span{display:flex;align-items:center;gap:8px;border:1px solid var(--cizgi);border-radius:12px;padding:9px 10px;background:rgba(10,3,8,.45);font-weight:600;font-size:14.5px;min-height:42px;transition:background .15s,border-color .15s}
.oyun span::before{content:"";width:18px;height:18px;border-radius:6px;border:2px solid var(--mute);flex:none;background:transparent}
.oyun input:checked+span{background:rgba(255,200,87,.14);border-color:var(--altin)}
.oyun input:checked+span::before{background:var(--altin) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%232a0713' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/80% no-repeat;border-color:var(--altin)}
.oyun input:focus-visible+span{outline:3px solid var(--altin);outline-offset:2px}
.secenek{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--cizgi);border-radius:12px;margin:8px 0;cursor:pointer;background:rgba(10,3,8,.35)}
.secenek input{margin-top:4px;accent-color:var(--altin);width:18px;height:18px;flex:none}
.secenek span{font-size:14.5px;color:var(--mute)}.secenek b{display:block;color:var(--yazi);font-size:15.5px}
.secenek.kucuk{align-self:end;margin:0}
.alan{display:block;margin:10px 0}.alan>span{display:block;font-size:14px;color:var(--mute);margin-bottom:6px}.alan small{opacity:.8}
.alan input[type=text],.alan select{width:100%;padding:11px 12px;border-radius:12px;border:1px solid var(--cizgi);background:#12030a;color:var(--yazi);font:16px var(--govde)}
.alan input[type=range]{width:100%;accent-color:var(--altin)}
.alan output{color:var(--altin);font-weight:700}
.ikili{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.durum{min-height:22px;margin:6px 0;font-size:14.5px}.durum.ok{color:var(--yesil)}.durum.uyari{color:#ffb86b}
.ince{color:var(--mute);font-size:13.5px;margin:8px 0 0}

.sag{position:sticky;top:64px;display:flex;flex-direction:column;gap:14px;min-width:0}
.onizleme-kutu,.kod-kutu{border:1px solid var(--cizgi);border-radius:16px;padding:12px;background:rgba(10,3,8,.55)}
.onizleme-bas{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.onizleme-bas b{font:400 20px var(--disp);color:var(--altin)}
.cihaz{margin-left:auto;display:flex;gap:6px}
.cihaz button[aria-pressed=true],.sekmeler button[aria-selected=true]{background:var(--altin);color:#2a0713;border-color:var(--altin)}
.ekran{display:flex;justify-content:center;background:repeating-linear-gradient(45deg,#1a0610 0 12px,#14040c 12px 24px);border-radius:12px;padding:10px;overflow:hidden}
.ekran iframe{width:100%;max-width:760px;height:660px;border:0;background:#0a101c;transition:max-width .25s}
.ekran.tel iframe{max-width:390px}
.sekmeler{display:flex;gap:6px;margin-bottom:8px}
#kod-alani{width:100%;resize:vertical;background:#0a0207;color:#e9dcb8;border:1px solid var(--cizgi);border-radius:12px;padding:12px;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.kod-alt{display:flex;align-items:center;gap:12px;margin-top:10px}
.dugme{font:700 16px/1 var(--govde);background:linear-gradient(#ffd96e,#e3a22f);color:#2a0713;border:0;border-radius:12px;padding:13px 20px;cursor:pointer;box-shadow:0 3px 0 #8a5a12}
.dugme:active{transform:translateY(2px);box-shadow:0 1px 0 #8a5a12}
#kopya-durum{color:var(--yesil);font-weight:600}
.rehber{padding-top:8px}
.rehber-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.rehber-izgara article{border:1px solid var(--cizgi);border-radius:14px;padding:14px 16px;background:rgba(74,15,38,.4)}
.rehber p,.madde{color:var(--yazi);margin:0}
.madde{padding-left:20px;display:grid;gap:8px;max-width:860px}
code{background:rgba(255,200,87,.12);padding:1px 6px;border-radius:6px}
.bayiler ul{list-style:none;padding:0;display:flex;gap:10px;flex-wrap:wrap}
.bayiler li{border:1px solid var(--cizgi);border-radius:12px;padding:8px 14px;background:rgba(74,15,38,.4)}
.basvuru{padding-top:6px;max-width:900px}
.bas-form textarea{width:100%;padding:11px 12px;border-radius:12px;border:1px solid var(--cizgi);background:#12030a;color:var(--yazi);font:16px var(--govde);resize:vertical}
.tuzak{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.alt{border-top:1px solid var(--cizgi);padding:22px 18px 34px;text-align:center;color:var(--mute);font-size:14px}
@media(max-width:980px){.tezgah{grid-template-columns:1fr}.sag{position:static}.ekran iframe{height:620px}}
@media(max-width:520px){.ikili{grid-template-columns:1fr}.gezin a:first-child{display:none}.gezin a{padding:8px}.ust{padding:8px 12px}.kod-alt{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
