/* ── Brain — استایل (دارک پیش‌فرض + تم روشن) ── */
:root{
  --bg:#0f1420; --panel:#171e2e; --panel2:#1d2740; --line:#2a3654;
  --tx:#e8edf7; --mut:#9aa7c4; --acc:#22d3a5; --acc2:#3f8efc; --warn:#f2a900;
}
html.theme-light{
  --bg:#f4f6fb; --panel:#ffffff; --panel2:#eef1f8; --line:#d8dfec;
  --tx:#1b2437; --mut:#5b6885; --acc:#0d9488; --acc2:#2563eb; --warn:#b45309;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:Vazirmatn,'Segoe UI',Tahoma,sans-serif;
  background:var(--bg); color:var(--tx); min-height:100vh; transition:background .3s;
}
header{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 22px;
  background:var(--panel); border-bottom:1px solid var(--line); position:sticky;top:0;z-index:50}
header h1{font-size:20px; display:flex;align-items:center;gap:8px}
header .sub{font-size:12px;color:var(--mut)}
.spacer{flex:1}
button.btn{
  border:1px solid var(--line); background:var(--panel2); color:var(--tx);
  padding:7px 14px; border-radius:10px; cursor:pointer; font-size:13px; transition:.2s;
}
button.btn:hover{border-color:var(--acc); color:var(--acc)}
button.btn-home,button.btn-back,button.btn-zoom{
  border:1px solid var(--line); background:var(--panel2); color:var(--tx);
  padding:7px 14px; border-radius:10px; cursor:pointer; font-size:13px; transition:.2s;
}
button.btn-home:hover,button.btn-back:hover,button.btn-zoom:hover{border-color:var(--acc); color:var(--acc)}
button.btn-zoom{width:36px;padding:7px 0;font-weight:700}
button.btn.primary{background:var(--acc); color:#06231b; border:none; font-weight:700}
button.btn.ghost{background:transparent}
.icon-btn{width:34px;height:34px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center}

#controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 22px;background:var(--panel2);border-bottom:1px solid var(--line)}
#breadcrumb{font-size:13px;color:var(--mut);display:flex;gap:6px;flex-wrap:wrap;align-items:center}
#breadcrumb b{color:var(--tx)}
#search{flex:1;min-width:200px;max-width:420px;display:flex;gap:6px;align-items:center;position:relative}
#search input{flex:1;background:var(--panel);border:1px solid var(--line);color:var(--tx);border-radius:9px;padding:7px 12px;font-size:13px;outline:none}
#search input:focus{border-color:var(--acc2)}
#searchResults{position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--panel);border:1px solid var(--line);border-radius:10px;max-height:280px;overflow:auto;z-index:60;display:none}
#searchResults .it{padding:8px 12px;cursor:pointer;font-size:13px;border-bottom:1px solid var(--line)}
#searchResults .it:hover{background:var(--panel2)}
#searchResults .it small{display:block;color:var(--mut)}

#stage{max-width:1100px;margin:16px auto;padding:0 16px}
#stage svg{width:100%;height:auto;display:block;border-radius:14px}
.shape-region{cursor:pointer;transition:opacity .15s, filter .15s}
.shape-region:hover{filter:brightness(1.18)}
.shape-region .rname{pointer-events:none}
.gyrus{stroke:rgba(255,255,255,.30);fill:none;stroke-width:2.2;pointer-events:none}

#shelf h2{font-size:14px;color:var(--mut);margin:22px 4px 10px}
#shelf .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;transition:.2s}
.tile:hover{border-color:var(--acc);transform:translateY(-2px)}
.tile h3{font-size:14px;margin-bottom:4px}
.tile p{font-size:12px;color:var(--mut);line-height:1.7}

#panel{position:fixed;bottom:16px;right:16px;left:16px;max-width:520px;margin:0 auto;background:var(--panel);
  border:1px solid var(--line);border-radius:16px;padding:16px 18px;display:none;box-shadow:0 12px 40px rgba(0,0,0,.45);z-index:70}
#panel h3{font-size:16px;margin-bottom:6px}
#panel .pdesc{font-size:13px;color:var(--mut);line-height:1.9;max-height:160px;overflow:auto}
#panel .pmeta{font-size:12px;color:var(--mut);margin-top:8px}
#panel .pactions{display:flex;gap:8px;margin-top:12px}
#toast{position:fixed;top:18px;left:50%;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--line);
  padding:10px 18px;border-radius:10px;font-size:13px;z-index:99;display:none}

footer{color:var(--mut);font-size:12px;text-align:center;padding:22px;line-height:2}

/* تم‌ها */
body[dir=rtl]{direction:rtl;text-align:right}
body[dir=ltr]{direction:ltr;text-align:left}

/* نوار اسکرول */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}

@media(max-width:640px){
  header h1{font-size:16px}
  #shelf .grid{grid-template-columns:1fr 1fr}
}