:root{--ground:#F6F0E2;--surface:#FFFDF7;--line:#DDD3BC;--soft:#EDE5D0;--ink:#17261F;--muted:#5A6159;--pine:#2E7D5B;--pine-ink:#FFFFFF;--pine-text:#1F5C42;--pine-tint:#DCEBE2;--amber:#E0861B;--amber-tint:#FBE6C8;--amber-line:#E9C58F;--amber-text:#8A4B00;--rust:#A33B12;--rust-tint:#FBE3DA;--dark:#17261F;--dark-ink:#F6F0E2;--tone-a:#FBE6C8;--tone-p:#DCEBE2;--tone-s:#EADFC4;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--ground:#121A16;--surface:#1B2620;--line:#33423A;--soft:#26332C;--ink:#F1ECDD;--muted:#A8B3A9;--pine-text:#7FD1A9;--pine-tint:#1E3A2D;--amber-tint:#3B2B14;--amber-line:#6A4B1E;--amber-text:#F2B866;--rust:#F0987A;--rust-tint:#3F2018;--dark:#0A100D;--dark-ink:#F1ECDD;--tone-a:#3B2B14;--tone-p:#1E3A2D;--tone-s:#2B3029;color-scheme:dark}}
:root[data-theme="dark"]{--ground:#121A16;--surface:#1B2620;--line:#33423A;--soft:#26332C;--ink:#F1ECDD;--muted:#A8B3A9;--pine-text:#7FD1A9;--pine-tint:#1E3A2D;--amber-tint:#3B2B14;--amber-line:#6A4B1E;--amber-text:#F2B866;--rust:#F0987A;--rust-tint:#3F2018;--dark:#0A100D;--dark-ink:#F1ECDD;--tone-a:#3B2B14;--tone-p:#1E3A2D;--tone-s:#2B3029;color-scheme:dark}
*{box-sizing:border-box}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
body{min-height:100%;margin:0;background:var(--ground);color:var(--ink);font-family:'Hind','Noto Sans Gurmukhi',system-ui,sans-serif;font-size:16px;line-height:1.4}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--dark);z-index:30}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
.dp{font-family:'Rozha One',Georgia,serif;font-weight:400;letter-spacing:0}
.sr{position:absolute;left:-9999px}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--dark);color:var(--dark-ink);display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:8px 14px}
.phone[lang="pa"]{font-family:'Noto Sans Gurmukhi','Hind',system-ui,sans-serif}
h1:focus{outline:none}
.sel{min-height:44px;border-radius:12px;padding:0 10px;border:1.5px solid #5A6159;background:var(--surface);color:var(--ink);font-weight:600}
.top .brand{display:flex;align-items:center;gap:8px;font-size:22px}
.roles{display:flex;gap:6px;flex-wrap:wrap;flex:1}
.role{min-height:44px;padding:0 14px;border-radius:999px;border:1.5px solid #5A6159;background:transparent;color:var(--dark-ink);font-weight:600;font-size:15px}
.role[aria-pressed="true"]{background:var(--pine);border-color:var(--pine);color:#fff}
.reset{min-height:44px;padding:0 14px;border-radius:12px;border:1.5px solid #5A6159;background:transparent;color:var(--dark-ink);font-size:14px;font-weight:600}
.stage{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:16px;padding:16px}
.phone{width:390px;height:min(844px,calc(100dvh - 140px));min-height:560px;border:10px solid var(--dark);border-radius:46px;overflow:hidden;background:var(--ground);position:relative}
.scr{display:flex;flex-direction:column;height:100%;background:var(--ground)}
.hd{display:flex;align-items:center;gap:8px;padding:14px 18px 0}
.bd{flex:1;overflow-y:auto;padding:10px 18px 14px;display:flex;flex-direction:column;gap:12px}
.ft{padding:10px 18px 14px;border-top:1px solid var(--line);background:var(--ground);display:flex;flex-direction:column;gap:8px}
.tabs{display:flex;border-top:1px solid var(--line);background:var(--surface)}
.dot{position:absolute;top:8px;left:calc(50% + 8px);width:11px;height:11px;border-radius:50%;background:var(--amber);border:2px solid var(--surface)}
.tab{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:62px;border:0;background:transparent;color:var(--muted);font-size:12px;font-weight:600}
.tab[aria-current="page"]{color:var(--pine-text)}
.guide{flex:0 1 290px;min-width:260px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:6px 16px 14px}
.guide summary{display:flex;align-items:center;min-height:48px;font-weight:700;font-size:17px;cursor:pointer}
.gs{display:flex;gap:10px;align-items:flex-start;padding:7px 0;font-size:15px;border-top:1px solid var(--soft)}
.gs i{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid var(--muted);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:13px;font-weight:700;margin-top:1px}
.gs.ok i{background:var(--pine);border-color:var(--pine);color:#fff}
.log{max-height:170px;overflow:auto;font-size:14px;color:var(--muted);display:flex;flex-direction:column;gap:4px;padding-top:6px;border-top:1px solid var(--soft)}
.wide{flex:1 1 640px;min-width:0;max-width:1180px}
.adm{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
.nav{flex:0 0 200px;display:flex;flex-direction:column;gap:4px;background:var(--dark);border-radius:18px;padding:12px}
.nv{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:10px;border:0;background:transparent;color:var(--dark-ink);font-size:16px;font-weight:500;text-align:left}
.nv[aria-current="page"]{background:var(--pine);color:#fff;font-weight:600}
.nv .n{margin-left:auto;background:var(--amber);color:#17261F;border-radius:999px;padding:0 8px;font-size:13px;font-weight:700}
.mn{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:14px 16px}
.kp{display:flex;flex-direction:column;gap:2px;padding:14px 18px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.kpg{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr));gap:12px}
.b{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 20px;border-radius:14px;border:1.5px solid transparent;font-weight:600;font-size:17px;text-decoration:none}
.b.p{background:var(--pine);color:var(--pine-ink)}
.b.o{background:transparent;border-color:var(--ink);color:var(--ink)}
.b.d{background:var(--dark);color:var(--dark-ink);border-color:var(--dark)}
.b.s{min-height:44px;font-size:15px;padding:0 14px;border-radius:12px}
.b.l{background:transparent;color:var(--pine-text);padding:0 6px;min-height:44px;justify-content:flex-start;font-size:16px}
.b[disabled]{background:var(--soft);color:var(--muted);border-color:var(--line);cursor:not-allowed}
.chip{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;border-radius:999px;background:var(--pine-tint);font-size:14px;font-weight:600}
.chip.a{background:var(--amber-tint);color:var(--amber-text)}
.chip.r{background:var(--rust-tint);color:var(--rust)}
.seg{display:flex;gap:8px;flex-wrap:wrap}
.sg{min-height:44px;padding:0 16px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);font-weight:600;font-size:15px}
.sg[disabled]{background:var(--soft);color:var(--muted);cursor:not-allowed}
.sg[aria-pressed="true"]{background:var(--ink);color:var(--ground);border-color:var(--ink)}
.stp{display:flex;align-items:center;gap:4px}
.stp button{width:44px;height:44px;border-radius:12px;border:1.5px solid var(--ink);background:var(--surface);font-size:22px;font-weight:600}
.stp button.p{background:var(--pine);border-color:var(--pine);color:#fff}
.stp span{min-width:24px;text-align:center;font-weight:600;font-size:17px}
.row{display:flex;align-items:center;gap:10px;padding:10px 12px 10px 16px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.ln{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:40px}
.muted{color:var(--muted)}
.inp{min-height:48px;padding:0 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);width:100%}
textarea.inp{padding:10px 14px;min-height:80px}
.fl{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:600;color:var(--muted)}
.tg{display:grid;gap:10px;align-items:center;min-height:52px;padding:0 16px;border-top:1px solid var(--soft);font-size:15px}
.tg.h{font-size:13px;font-weight:600;color:var(--muted);min-height:42px;border-top:0}
.scroll{overflow-x:auto}
.bubble{max-width:290px;padding:10px 14px;border-radius:18px 18px 18px 6px;background:var(--surface);border:1px solid var(--line);font-size:16px}
.bubble.me{align-self:flex-end;border-radius:18px 18px 6px 18px;background:var(--pine-tint);border-color:transparent}
.ph{height:76px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:34px}
.hero{border-radius:20px;padding:16px 18px;background:var(--pine);color:#fff;display:flex;flex-direction:column;gap:4px}
.bar{height:14px;border-radius:7px;background:var(--soft);overflow:hidden}
.bar>i{display:block;height:100%;background:var(--pine)}
dialog{border:0;padding:0;background:transparent;color:var(--ink);max-width:100vw;max-height:100dvh;overscroll-behavior:contain}
dialog::backdrop{background:rgba(0,0,0,.55);overflow:hidden;overscroll-behavior:contain}
.mdl{background:var(--surface);border-radius:22px;padding:20px;width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 40px);overflow:auto;display:flex;flex-direction:column;gap:12px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--dark);color:var(--dark-ink);border:1px solid #5A6159;padding:12px 18px;border-radius:12px;z-index:60;max-width:calc(100vw - 32px);font-weight:600}
details.fq{border-top:1px solid var(--soft)}
details.fq summary{display:flex;align-items:center;min-height:48px;font-weight:600;cursor:pointer}
details.fq p{margin:0 0 12px;color:var(--muted)}
input[type=range]{width:100%;accent-color:var(--pine);min-height:44px}
.fun{display:flex;flex-direction:column;gap:4px;padding:6px 0}
@media (max-width:480px){.stage{padding:0}.phone{width:100%;height:calc(100dvh - 150px);border:0;border-radius:0}.guide{margin:8px 12px}}
@media (prefers-reduced-motion:no-preference){.bar>i{transition:width .3s}}
