/* مأخوذ من النموذج المعتمد مع إضافات بسيطة للنسخة الحقيقية */
:root{--g:#226246;--o:#c97650;--bg:#f3f6f3;--c:#fff;--t:#1d3a2e;--m:#667870;--l:#d9e2dc;--gr:#eef0f1;color-scheme:light}
@media(prefers-color-scheme:dark){:root{--bg:#12201a;--c:#1b2d25;--t:#e6efe9;--m:#9bb0a5;--l:#2f463b;--gr:#26352d;color-scheme:dark}}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}body{margin:0;min-height:100%;background:var(--bg);color:var(--t);font:15px/1.6 "Segoe UI",Tahoma,"Noto Naskh Arabic",sans-serif;-webkit-tap-highlight-color:transparent}
#app{max-width:480px;margin:0 auto;padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
header{padding:14px 16px;padding-top:calc(14px + env(safe-area-inset-top,0px));background:var(--c);border-bottom:1px solid var(--l);position:sticky;top:0;z-index:5;text-align:center}
header b{display:block;font-size:17px}header span{font-size:12px;color:var(--m)}
.pw{position:relative}.pw input{padding-right:46px}.eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;background:none;font-size:18px;cursor:pointer;color:var(--m)}
.dg{display:flex;gap:8px}.dg>div{flex:1}.sc{overflow-x:auto;margin-top:12px}
.tb{width:100%;border-collapse:collapse;font-size:12px}.tb th,.tb td{padding:6px 5px;border-bottom:1px solid var(--l);text-align:center;white-space:nowrap}.tb tr.cl{cursor:pointer}
main{padding:16px}h2{margin:0 0 12px;font-size:19px}
label{display:block;font-size:13px;color:var(--m);margin:12px 0 4px}
input,select,textarea{width:100%;padding:11px 12px;border:1px solid var(--l);border-radius:10px;background:var(--c);color:var(--t);font:inherit}
.b,.b2{display:block;width:100%;padding:13px;border-radius:10px;border:1px solid var(--g);font:inherit;font-weight:700;text-align:center;text-decoration:none;margin-top:10px;cursor:pointer}
.b{background:var(--g);color:#fff}.b2{background:var(--c);color:var(--g)}.b[disabled],.b2[disabled]{opacity:.45;cursor:not-allowed}.b.o{background:var(--o);border-color:var(--o)}
.card{background:var(--c);border:1px solid var(--l);border-radius:14px;padding:14px;margin-top:12px}
.card small{color:var(--m)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}
.s{border-radius:9px;padding:7px 2px;text-align:center;font-size:11px;cursor:pointer}.s i{display:block;font:700 20px/1.2 inherit;font-style:normal}
.k0{background:#e6e9eb;color:#44505a}.k1{background:#fdebd3;color:#9a5a12}.k2{background:#eadff5;color:#6b3f93}.k3{background:#dcf1e3;color:#1d7040}.k4{background:#f8dcdc;color:#a53232}.k5{background:#dce8f8;color:#2a5ca3}
.chip{display:inline-block;padding:2px 10px;border-radius:20px;font-size:12px}
.row{display:flex;align-items:center;gap:10px;justify-content:space-between}
.empty{border:2px dashed var(--l);border-radius:14px;padding:28px 16px;text-align:center}
#toast{min-height:20px;color:var(--o);font-size:13px;margin-top:8px}
nav{position:fixed;bottom:0;left:0;right:0;max-width:480px;margin:0 auto;display:flex;background:var(--c);border-top:1px solid var(--l);padding-bottom:env(safe-area-inset-bottom,0px);z-index:6}
nav a{flex:1;text-align:center;padding:13px 4px;color:var(--m);font-size:13px;cursor:pointer}nav a.on{color:var(--g);font-weight:700}
.log{border-inline-start:3px solid var(--g);padding:2px 10px;margin:8px 0;font-size:13px}.log small{color:var(--m);display:block}
.hint{background:var(--gr);border-radius:10px;padding:10px;font-size:12px;color:var(--m);margin-top:14px}
.warn{border-color:var(--o)!important}
#live{position:fixed;top:calc(8px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);width:calc(100% - 24px);max-width:456px;z-index:20}
#live .card{margin:0 0 6px;border-color:var(--o);box-shadow:0 4px 18px rgba(0,0,0,.15);cursor:pointer}
.busy{opacity:.6;pointer-events:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--o);outline-offset:2px}
