/* Rewrite Panel - Apple tarzı arayüz: SF yazı tipi, cam üst bar, segmentli sekmeler, açık/koyu mod */
:root{
  --bg:#f5f5f7;--card:#fff;--ink:#1d1d1f;--muted:#6e6e73;--line:rgba(0,0,0,.1);
  --fill:rgba(120,120,128,.12);--seg-on:#fff;--accent:#0071e3;--ring:rgba(0,113,227,.28);
  --bad:#d70015;--bad-bg:rgba(255,59,48,.12);--good:#248a3d;--good-bg:rgba(52,199,89,.16);
  --glass:rgba(255,255,255,.72);--shadow:0 1px 2px rgba(0,0,0,.04),0 10px 30px rgba(0,0,0,.05);
}
@media (prefers-color-scheme:dark){:root{
  --bg:#000;--card:#1c1c1e;--ink:#f5f5f7;--muted:#98989d;--line:rgba(255,255,255,.14);
  --fill:rgba(120,120,128,.24);--seg-on:#636366;--accent:#0a84ff;--ring:rgba(10,132,255,.4);
  --bad:#ff453a;--bad-bg:rgba(255,69,58,.18);--good:#30d158;--good-bg:rgba(48,209,88,.18);
  --glass:rgba(28,28,30,.72);--shadow:none;
}}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;
  font:15px/1.47 -apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;letter-spacing:-.01em}

/* Üst bar */
header{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:56px;padding:0 24px;
  background:var(--glass);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line)}
header>b{font-weight:600;font-size:16px;letter-spacing:-.02em}
nav{display:flex;background:var(--fill);padding:2px;border-radius:10px}
nav button{border:0;background:none;padding:5px 18px;border-radius:8px;font:inherit;font-size:14px;font-weight:500;color:var(--ink);cursor:pointer;transition:background .2s,box-shadow .2s}
nav button.active{background:var(--seg-on);box-shadow:0 1px 3px rgba(0,0,0,.14),0 0 0 .5px rgba(0,0,0,.04)}
.link{justify-self:end;background:none;border:0;color:var(--accent);font:inherit;cursor:pointer;padding:6px 4px}
.link:hover{opacity:.7}

main{max-width:1040px;margin:0 auto;padding:28px 20px 60px}
.title{font-size:34px;line-height:1.1;font-weight:700;letter-spacing:-.03em;margin:8px 4px 4px}
.sub{color:var(--muted);margin:0 4px 22px;font-size:15px}

/* Kartlar */
.card{background:var(--card);border-radius:18px;padding:22px 24px;margin-bottom:16px;box-shadow:var(--shadow)}
.card.narrow{width:100%;max-width:400px;padding:32px 30px}
.center{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.narrow h1{text-align:center;font-size:24px;font-weight:700;letter-spacing:-.025em;margin:0 0 4px}
.narrow .sub{text-align:center;margin-bottom:22px}
.narrow .btn{width:100%;padding:11px 20px;margin-top:4px;text-align:center}
.appicon{width:68px;height:68px;border-radius:16px;margin:0 auto 16px;display:grid;place-items:center;color:#fff;font-weight:700;font-size:26px;letter-spacing:-.04em;
  background:linear-gradient(150deg,#5ab0ff,#0071e3 70%);box-shadow:0 8px 20px rgba(0,113,227,.35)}
h2{margin:0 0 6px;font-size:19px;font-weight:600;letter-spacing:-.02em}
h3{margin:0 0 8px;font-size:13px;font-weight:600;color:var(--muted)}
.muted{color:var(--muted)}
.warn{color:var(--bad)}
p{margin:0 0 12px}

/* Form */
label{display:block;font-size:13px;font-weight:500;color:var(--muted);margin-bottom:14px}
label.inline{display:inline-flex;gap:8px;align-items:center;margin:0 14px 0 0;color:var(--ink);font-size:14px;font-weight:400}
input,select,textarea{display:block;width:100%;margin-top:6px;padding:10px 13px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:15px;
  background:var(--card);color:var(--ink);transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
input::placeholder,textarea::placeholder{color:#a1a1a6}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--ring)}
select{padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%238e8e93' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center}
input[type=checkbox]{display:inline-block;width:18px;height:18px;margin:0;padding:0;border-radius:5px;cursor:pointer;position:relative;flex:none;
  border:1.5px solid #b0b0b6;background:var(--card);vertical-align:middle}
input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}
input[type=checkbox]:checked::after{content:"";position:absolute;left:5px;top:1.5px;width:4px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
input[type=checkbox]:focus{box-shadow:0 0 0 4px var(--ring)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.grid h2,.grid textarea,.grid button,.grid #baseWrap,.grid label:has(textarea){grid-column:1/-1}
.grid h2:not(:first-child){margin-top:14px}
.grid button{justify-self:start;margin-top:6px}

/* Butonlar */
.btn{display:inline-block;background:var(--accent);color:#fff;border:0;border-radius:980px;padding:9px 20px;font:inherit;font-size:14px;font-weight:500;cursor:pointer;
  text-decoration:none;transition:filter .15s,transform .08s,opacity .15s;white-space:nowrap}
.btn:hover{filter:brightness(1.08)}
.btn:active{transform:scale(.97)}
.btn:focus-visible{outline:none;box-shadow:0 0 0 4px var(--ring)}
.btn:disabled{opacity:.45;cursor:default;filter:none;transform:none}
.btn.ghost{background:var(--fill);color:var(--accent)}
.btn.danger{background:var(--bad-bg);color:var(--bad)}
.btn.small{padding:4px 13px;font-size:13px}
.bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bar select,.bar input:not([type=checkbox]){width:auto;margin:0;min-width:170px}
.spacer{flex:1}

/* Tablo */
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:middle}
tr:last-child td{border-bottom:0}
th{color:var(--muted);font-weight:500;font-size:12px;padding-top:2px}
tr:not(:first-child):hover td{background:var(--fill)}
td:first-child,th:first-child{padding-left:6px;width:40px}
.right{text-align:right;white-space:nowrap}
.badge{display:inline-block;padding:2px 11px;border-radius:980px;font-size:12px;font-weight:600;background:var(--fill);color:var(--muted)}
.badge.good{background:var(--good-bg);color:var(--good)}
.badge.bad{background:var(--bad-bg);color:var(--bad)}
.badge.run{background:var(--ring);color:var(--accent)}

/* Bildirim (toast) */
.msg{position:fixed;top:68px;left:50%;transform:translateX(-50%);z-index:30;max-width:min(560px,92vw);padding:12px 22px;border-radius:14px;font-weight:500;
  background:var(--glass);-webkit-backdrop-filter:saturate(180%) blur(24px);backdrop-filter:saturate(180%) blur(24px);
  border:1px solid var(--line);box-shadow:0 12px 40px rgba(0,0,0,.18);animation:drop .3s ease}
.msg.bad{color:var(--bad)}
@keyframes drop{from{opacity:0;transform:translate(-50%,-10px)}}

/* İlerleme */
.progress{height:6px;background:var(--fill);border-radius:3px;overflow:hidden}
#bar{height:100%;width:0;background:var(--accent);border-radius:3px;transition:width .35s ease}
.log{list-style:none;margin:10px 0 0;padding:0;max-height:180px;overflow:auto;font-size:13px}
.log li{padding:3px 0;color:var(--muted)}.log li.bad{color:var(--bad)}

/* Kurulum */
.checks{list-style:none;padding:0;margin:0 0 14px}.checks li{padding:3px 0}.checks .ok{color:var(--good)}.checks .bad{color:var(--bad)}

/* Önizleme sayfası (sheet) */
#modal{position:fixed;inset:0;background:rgba(0,0,0,.32);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:16px;z-index:40;animation:fade .2s ease}
.modalBox{background:var(--card);border-radius:20px;padding:20px 22px;width:100%;max-width:1000px;max-height:92vh;overflow:auto;box-shadow:0 30px 80px rgba(0,0,0,.35);animation:pop .25s cubic-bezier(.2,.8,.2,1)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
iframe{width:100%;height:52vh;border:1px solid var(--line);border-radius:12px;background:#fff}
@keyframes fade{from{opacity:0}}
@keyframes pop{from{opacity:0;transform:scale(.96)}}

@media(max-width:760px){
  header{grid-template-columns:1fr auto;height:auto;padding:10px 16px;row-gap:8px}
  nav{grid-column:1/-1;order:3;overflow:auto}nav button{flex:1;padding:5px 10px}
  .grid,.cols{grid-template-columns:1fr}.title{font-size:28px}
}