:root{
  --sand:#f7efe1;
  --ivory:#fffaf0;
  --ink:#172623;
  --muted:#70665b;
  --indigo:#143a57;
  --indigo-2:#0d2a40;
  --madder:#9d2f2f;
  --madder-dark:#6f2027;
  --brass:#c08d3c;
  --turquoise:#2f8f91;
  --line:#dec9a9;
  --shadow:0 24px 70px rgba(74,42,20,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  font-family:Georgia,'Times New Roman',serif;
  background:
    radial-gradient(circle at 14% 8%, rgba(192,141,60,.18), transparent 24rem),
    radial-gradient(circle at 88% 0%, rgba(20,58,87,.18), transparent 30rem),
    linear-gradient(135deg, rgba(157,47,47,.05) 25%, transparent 25%) 0 0/28px 28px,
    var(--sand);
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.11;
  background:
    radial-gradient(circle, var(--indigo) 2px, transparent 3px) 0 0/34px 34px,
    radial-gradient(circle, var(--madder) 2px, transparent 3px) 17px 17px/34px 34px;
  mask-image:linear-gradient(to bottom,#000,transparent 78%);
}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.shell{display:grid;grid-template-columns:minmax(19rem,23.5rem) 1fr;min-height:100vh;position:relative;z-index:1}
.panel{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(255,250,240,.96),rgba(255,246,229,.92));
  border:1px solid rgba(126,78,37,.2);
  box-shadow:var(--shadow);
}
.panel::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:7px;
  background:repeating-linear-gradient(90deg,var(--madder) 0 18px,var(--indigo) 18px 36px,var(--brass) 36px 44px,var(--ivory) 44px 50px);
}
.side{
  position:sticky;
  top:0;
  height:100vh;
  padding:30px;
  display:flex;
  flex-direction:column;
  gap:22px;
  border-width:0 1px 0 0;
  background:
    linear-gradient(rgba(13,42,64,.86),rgba(13,42,64,.92)),
    repeating-linear-gradient(45deg,rgba(255,255,255,.12) 0 1px,transparent 1px 18px),
    var(--indigo-2);
  color:#fff7e6;
}
.side::before{height:100%;width:8px;inset:0 auto 0 0;background:repeating-linear-gradient(180deg,var(--madder) 0 20px,var(--brass) 20px 26px,var(--indigo) 26px 46px)}
.ajrak-band{
  min-height:74px;
  border:1px solid rgba(255,255,255,.18);
  background:
    radial-gradient(circle at 12px 12px,#fff7e6 2px,transparent 3px) 0 0/24px 24px,
    radial-gradient(circle at 12px 12px,var(--turquoise) 4px,transparent 5px) 12px 12px/24px 24px,
    linear-gradient(135deg,var(--madder),var(--indigo));
  box-shadow:inset 0 0 0 5px rgba(255,255,255,.08);
}
.seal-wrap{display:flex;align-items:center;gap:14px}
.seal-wrap span{height:1px;flex:1;background:linear-gradient(90deg,var(--brass),transparent)}
.seal{
  width:78px;height:78px;border:2px solid var(--brass);border-radius:50%;display:grid;place-items:center;
  color:#fff7e6;font-weight:800;letter-spacing:.1em;background:rgba(255,255,255,.08);
  box-shadow:0 0 0 8px rgba(192,141,60,.12), inset 0 0 0 1px rgba(255,255,255,.16);
}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:var(--brass);font:800 11px Arial,sans-serif;margin:0}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(34px,4vw,46px);line-height:1.02;margin-bottom:0;letter-spacing:-.025em}
h2{font-size:clamp(26px,3vw,36px);margin-bottom:0;letter-spacing:-.02em}
h3{font-size:20px}
.intro,.muted,.note{color:var(--muted);line-height:1.72}
.side .intro{color:#e6d7bd}
.language-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.language-grid button,.topbar button,.filters button,.stack-form button{
  border:1px solid var(--indigo);
  background:linear-gradient(135deg,var(--indigo),var(--indigo-2));
  color:#fff;
  padding:12px 15px;
  box-shadow:0 10px 22px rgba(20,58,87,.14);
}
.language-grid button{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff7e6}
.language-grid button.active{background:var(--brass);border-color:var(--brass);color:#24180c}
nav{display:grid;gap:8px}
nav a{color:#fff7e6;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.14);padding:11px 0}
nav a:hover{color:#fff;background:rgba(255,255,255,.06);padding-inline:8px}
.rule-box{margin-top:auto;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);padding:17px;display:grid;gap:8px}
.rule-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:rgba(192,141,60,.18);border:1px solid rgba(192,141,60,.45);color:#ffe1a4}
.rule-box p{color:#eadbc2;margin:0;line-height:1.65}
.workspace{min-width:0;padding:24px;display:grid;gap:18px}
.topbar{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:center;padding:26px}
.topbar-pattern{width:112px;height:52px;border:1px solid rgba(157,47,47,.24);background:
  radial-gradient(circle,var(--madder) 2px,transparent 3px) 0 0/18px 18px,
  radial-gradient(circle,var(--indigo) 2px,transparent 3px) 9px 9px/18px 18px,
  rgba(192,141,60,.08)}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.metric{background:linear-gradient(145deg,var(--madder-dark),var(--madder));color:#fff;padding:20px;border:1px solid rgba(255,255,255,.16);box-shadow:0 18px 35px rgba(111,32,39,.14)}
.metric:nth-child(even){background:linear-gradient(145deg,var(--indigo),var(--indigo-2))}
.metric span{display:block;color:#f2d4aa;font:800 11px Arial,sans-serif;text-transform:uppercase;letter-spacing:.1em}
.metric strong{display:block;font-size:34px;margin-top:8px}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}
.workspace>.panel,.grid>.panel{padding:26px}
.policy-pill,.lawyer-top span,.chips small,.plan span{
  border:1px solid rgba(126,78,37,.2);
  background:#fff;
  padding:7px 10px;
  color:var(--madder-dark);
  font:800 11px Arial,sans-serif;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.filters{display:grid;grid-template-columns:2fr repeat(3,1fr) auto;gap:10px;margin-bottom:18px}
.filters input,.filters select,.stack-form input,.stack-form select,.stack-form textarea{
  width:100%;
  border:1px solid rgba(126,78,37,.25);
  background:#fffdf7;
  padding:13px;
  color:var(--ink);
  outline:none;
}
.filters input:focus,.filters select:focus,.stack-form input:focus,.stack-form select:focus,.stack-form textarea:focus{border-color:var(--brass);box-shadow:0 0 0 3px rgba(192,141,60,.16)}
textarea{min-height:120px;resize:vertical}
.lawyer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.lawyer-card{
  display:grid;
  grid-template-columns:104px 1fr;
  gap:17px;
  background:#fffdf7;
  border:1px solid rgba(126,78,37,.2);
  padding:17px;
  box-shadow:0 12px 30px rgba(74,42,20,.07);
}
.lawyer-card img{width:104px;height:132px;object-fit:cover;border:5px solid #fff;border-radius:2px;background:#eee;box-shadow:0 0 0 1px var(--line),0 12px 24px rgba(0,0,0,.12)}
.lawyer-top{display:flex;justify-content:space-between;gap:10px}
.lawyer-top h3{margin:0}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.lawyer-card footer{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:10px;color:var(--muted);font-size:13px}
.lawyer-card a{color:var(--indigo)}
.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.plan-grid{display:grid;gap:10px}
.plan{display:flex;justify-content:space-between;gap:10px;align-items:center;background:#fffdf7;border:1px solid rgba(126,78,37,.2);padding:16px}
.plan strong{color:var(--indigo)}
.payment-nodes{margin-top:14px;display:grid;gap:8px;color:var(--muted)}
.stack-form{display:grid;gap:10px}
.ledger-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.list{display:grid;gap:8px}
.row{background:#fffdf7;border:1px solid rgba(126,78,37,.2);padding:12px}
.row b,.row small{display:block}
.row small{color:var(--muted);margin-top:4px}
#toast{position:fixed;right:22px;bottom:22px;background:var(--indigo);color:#fff;padding:14px 16px;opacity:0;transform:translateY(10px);transition:.2s;z-index:10;box-shadow:0 18px 35px rgba(20,58,87,.25)}
#toast.show{opacity:1;transform:none}
[dir="rtl"] body{font-family:Georgia,'Noto Nastaliq Urdu','Times New Roman',serif;text-align:right}
[dir="rtl"] .side{border-width:0 0 0 1px}
[dir="rtl"] .side::before{left:0;right:auto}
[dir="rtl"] .lawyer-card footer,[dir="rtl"] .lawyer-top,[dir="rtl"] .section-head,[dir="rtl"] .plan{flex-direction:row-reverse}
[dir="rtl"] .topbar{direction:rtl}
@media(max-width:1100px){
  .shell{grid-template-columns:1fr}
  .side{position:relative;height:auto;border-width:0 0 1px}
  .side::before{height:8px;width:100%;inset:0 0 auto}
  .metrics,.lawyer-grid,.grid.two,.ledger-grid{grid-template-columns:1fr}
  .filters{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .workspace{padding:12px}
  .side{padding:20px}
  .filters{grid-template-columns:1fr}
  .topbar,.section-head{align-items:flex-start;grid-template-columns:1fr}
  .topbar-pattern{width:100%;height:38px}
  .lawyer-card{grid-template-columns:1fr}
  .lawyer-card img{width:100%;height:230px}
  .metrics{gap:8px}
  h1{font-size:32px}
}