/* Lebanese.ai design system (brand book: claude.ai/artifact/QUUv9Bn4UjrR7D12baPGpF), tokens v1.
   Cedar (dark) is the default for web; Paper (light) via <html data-theme="light">. */
@font-face{font-family:"Readex Pro";src:url(/static/fonts/ReadexPro-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Readex Pro";src:url(/static/fonts/ReadexPro-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Readex Pro";src:url(/static/fonts/ReadexPro-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/static/fonts/JetBrainsMono-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/static/fonts/JetBrainsMono-500.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  /* Cedar */
  --bg:#0B2A22;--surface:#12352B;--surface-2:#1A4337;--line:#24503F;--line-strong:#5C8A77;
  --ink:#F5F1EA;--ink-muted:#B3C4BC;--ink-subtle:#7F978D;
  --accent:#E0453A;--accent-text:#FF8A7F;--action:#FF6B5E;--on-action:#0B2A22;--action-soft:#3A2420;
  --link:#8DD3B5;--focus:#FF9A90;--success:#2E9C8F;--warning:#E8A13A;--danger:#E86A2E;--info:#5AA9E6;
  --shadow-sm:none;--shadow-lg:0 24px 48px rgba(0,0,0,.35);
  --sans:"Readex Pro","Segoe UI",Tahoma,system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:999px;
  color-scheme:dark;
}
:root[data-theme="light"]{
  /* Paper */
  --bg:#F5F1EA;--surface:#FBF8F3;--surface-2:#EDE7DC;--line:#DCD3C4;--line-strong:#8C8270;
  --ink:#0B2A22;--ink-muted:#46594F;--ink-subtle:#7A8580;
  --accent-text:#B3302A;--action:#0B2A22;--on-action:#F5F1EA;--action-soft:#F3DCD7;
  --link:#1F6B52;--focus:#B3302A;--success:#1C7A6F;--warning:#8A5A08;--danger:#B4421A;--info:#2766A6;
  --shadow-sm:0 1px 2px rgba(11,42,34,.08);--shadow-lg:0 24px 48px rgba(11,42,34,.12);
  color-scheme:light;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/26px var(--sans)}
a{color:var(--link)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;box-shadow:0 0 0 2px var(--bg)}
.wrap{max-width:1040px;margin:0 auto;padding:0 16px}
@media (min-width:768px){.wrap{padding:0 40px}}

/* header */
.site-header{border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.logo-link{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink-muted)}
.logo{height:22px;width:auto;display:block}
.logo.paper{display:none}
:root[data-theme="light"] .logo.cedar{display:none}
:root[data-theme="light"] .logo.paper{display:block}
.logo-tag{font:500 12px/16px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted)}
.theme-toggle{font:500 13px var(--sans);background:none;border:1px solid var(--line-strong);color:var(--ink-muted);border-radius:var(--radius-full);padding:4px 12px;cursor:pointer;min-height:32px}

/* type */
.eyebrow{font:500 12px/16px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted)}
h1,h2,h3{font-family:var(--sans);font-weight:600;color:var(--ink)}
.muted{color:var(--ink-muted)}
code,pre,.mono{font-family:var(--mono)}

/* controls */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:var(--radius-md);font:500 14px/20px var(--sans);text-decoration:none;cursor:pointer;border:1px solid var(--line-strong);background:transparent;color:var(--ink)}
.btn.primary{background:var(--action);border-color:var(--action);color:var(--on-action)}
.btn.link{border:0;background:none;color:var(--link);padding:0;min-height:auto}
.btn:disabled{opacity:.6;cursor:wait}
input,textarea,select{width:100%;font:400 16px/24px var(--sans);color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:10px 12px}
textarea.arabizi,input.arabizi{font-family:var(--mono)}
label{display:block;font:500 14px/20px var(--sans);color:var(--ink-muted);margin:16px 0 6px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}

/* token pills and the ScriptPair */
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{font:500 15px/22px var(--mono);background:var(--surface-2);color:var(--ink);border-radius:var(--radius-full);padding:4px 12px;border:0}
.pill.hot{background:var(--action-soft);color:var(--accent-text)}
button.pill{cursor:pointer}
.script-pair .ar{font:600 30px/44px var(--sans);direction:rtl}
.script-pair .az{font:500 15px/22px var(--mono);color:var(--accent-text)}

/* messages */
.msg{border-radius:var(--radius-md);padding:12px 16px;margin:16px 0;font-size:14px;line-height:22px;background:var(--surface);border:1px solid var(--line-strong)}
.msg.ok{border-color:var(--success)}
.msg.warn{border-color:var(--warning)}
.msg.err{border-color:var(--danger)}
.msg .tag{font:500 12px/16px var(--mono);letter-spacing:.12em;text-transform:uppercase;margin-right:8px}
.msg.ok .tag{color:var(--success)}.msg.warn .tag{color:var(--warning)}.msg.err .tag{color:var(--danger)}
.err-text{color:var(--danger);font-size:14px;margin-top:10px}

/* tables and code */
table{border-collapse:collapse;width:100%;font-size:14px;line-height:22px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{font:500 12px/16px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted)}
.tablewrap{overflow-x:auto}
pre{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);padding:16px;overflow-x:auto;font:400 13px/22px var(--mono);margin:8px 0 20px}
:not(pre)>code{background:var(--surface-2);border-radius:4px;padding:1px 6px;font-size:13px}

.site-footer{border-top:1px solid var(--line);margin-top:96px;padding:32px 0 48px;color:var(--ink-muted);font-size:14px;line-height:22px}
.hidden{display:none !important}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}
