:root{--a:#F2B705;--bg:#11121B;--b2:#181A26;--t:#ECEDF3;--h:#8C90A6;--l:#ffffff14;--ok:#22C3A6;--no:#E6553A}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--t);font:15px/1.5 'Noto Sans Ethiopic',system-ui,sans-serif}
main{max-width:560px;margin:auto;padding:18px 16px 60px}h1{font-size:22px;margin:4px 0}.sub{color:var(--h);margin:0 0 16px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.card,.row{background:var(--b2);border:1px solid var(--l);border-radius:14px;padding:14px;cursor:pointer;color:var(--t);text-align:left;font:inherit}
.card{min-height:96px;display:flex;flex-direction:column;justify-content:space-between}.card b{font-size:26px}
.rows{display:flex;flex-direction:column;gap:9px}.row{display:flex;justify-content:space-between;gap:10px}.p{color:var(--a);font-weight:700;white-space:nowrap}
.back{background:none;border:0;color:var(--h);padding:0 0 12px;font:inherit;cursor:pointer}
label{display:block;color:var(--h);margin:12px 0 6px;font-size:13px}
input{width:100%;background:var(--b2);border:1px solid var(--l);color:var(--t);border-radius:12px;padding:13px;font:inherit}
.btn{width:100%;border:0;border-radius:14px;padding:14px;margin-top:16px;font:600 16px inherit;background:var(--a);color:#1A1300;cursor:pointer}
.btn.s{background:var(--b2);color:var(--t);border:1px solid var(--l)}.btn:disabled{opacity:.5}
.box{background:var(--b2);border:1px solid var(--l);border-radius:14px;padding:14px;margin:12px 0}
.hint{background:#F2B7051a;border:1px solid #F2B70540;border-radius:12px;padding:12px;margin:12px 0}
.err{color:var(--no);margin:10px 0}.big{font-size:20px;font-weight:700;color:var(--a)}
.st{font-size:18px;font-weight:700;margin:8px 0}.mini{display:flex;gap:8px}.mini .btn{margin-top:10px;padding:11px}
.tabs{display:flex;gap:6px;margin:12px 0;overflow-x:auto}.tabs button{flex:none;padding:9px 12px;border-radius:10px;border:1px solid var(--l);background:var(--b2);color:var(--t);font:inherit}.tabs .on{background:var(--a);color:#1A1300}
.o img{max-width:100%;border-radius:10px;margin-top:8px}.o small{color:var(--h)}.o code{user-select:all;word-break:break-all}
main{padding-bottom:90px}nav{position:fixed;left:0;right:0;bottom:0;display:flex;background:var(--bg);border-top:1px solid var(--l);padding-bottom:env(safe-area-inset-bottom,0)}
nav button{flex:1;background:none;border:0;color:var(--h);padding:9px 2px;font:11px inherit;cursor:pointer}nav .on{color:var(--a)}
.pi{width:100%;max-height:260px;object-fit:cover;border-radius:10px;margin-bottom:8px}h3{margin:4px 0}.mini{align-items:center;justify-content:space-between}
.sec{display:flex;justify-content:space-between;align-items:center;margin:22px 0 10px}.sec h2{margin:0;font-size:18px}.sec a{color:var(--a);cursor:pointer}
.hero{font-size:26px;font-weight:800;line-height:1.25;margin:8px 0}.k{color:var(--a);letter-spacing:.1em;font-size:12px}
[data-theme=light]{--bg:#f4f5fa;--b2:#ffffff;--t:#14151f;--h:#6a6e85;--l:#00000018}
header{max-width:560px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:12px 16px 0}header b{font-size:18px}
header button{background:var(--b2);border:1px solid var(--l);color:var(--t);border-radius:10px;padding:7px 11px;margin-left:6px;font:inherit;cursor:pointer}
nav .ctr{flex:none;width:66px;height:66px;border-radius:50%;margin:-24px 4px 4px;background:var(--b2);border:2px solid var(--l);color:var(--t)}nav .ctr.on{background:var(--a);color:#1A1300;border-color:var(--a)}
.cp{background:var(--b2);border:1px solid var(--l);color:var(--t);border-radius:8px;padding:5px 10px;margin-left:6px;font:inherit;font-size:13px;cursor:pointer}

.heroc{background:linear-gradient(135deg,#F2B70522,#22C3A614 60%,transparent),var(--b2);border:1px solid var(--l);border-radius:20px;padding:20px 18px;margin:6px 0 12px}
.heroc .hero{font-size:24px}.steps{display:flex;gap:8px;margin:12px 0}.steps div{flex:1;background:var(--b2);border:1px solid var(--l);border-radius:14px;padding:10px 8px;font-size:12px;text-align:center;color:var(--h)}
.steps i{display:block;width:24px;height:24px;line-height:24px;margin:0 auto 6px;border-radius:50%;background:var(--a);color:#1A1300;font-style:normal;font-weight:700}
.sec h2{border-left:4px solid var(--a);padding-left:10px}
.cg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cc{position:relative;background:linear-gradient(160deg,#F2B7051c,transparent 70%),var(--b2);border:1px solid var(--l);border-radius:16px;padding:14px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.cc:active,.pcard:active,.row:active{transform:scale(.97)}.cn{font-size:22px;font-weight:800}.cpz{color:var(--a);font-weight:800;font-size:16px;margin-top:6px}
.cb{margin-top:10px;background:var(--a);color:#1A1300;border-radius:10px;text-align:center;padding:8px;font-weight:700;font-size:14px}
.hs{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory}.hs::-webkit-scrollbar{display:none}
.pcard{flex:none;width:170px;scroll-snap-align:start;background:var(--b2);border:1px solid var(--l);border-radius:16px;padding:8px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.pcard img,.pcard .ph{width:100%;aspect-ratio:1;object-fit:contain;background:#00000040;border-radius:12px;margin-bottom:4px;display:flex;align-items:center;justify-content:center;font-size:40px}
.ic{width:42px;height:42px;border-radius:50%;background:#F2B70526;display:flex;align-items:center;justify-content:center;font-size:22px;flex:none}
.row{align-items:center}.pi{aspect-ratio:1;object-fit:contain;background:#00000040;max-height:340px}
.box{border-radius:16px}
