/* ══════════════════════════════════════════════════════════════════
   TECH VEDA — ACCOUNTING
   Tokens per Tech Veda Brand Guidelines v1.0
   Dark-first · Saffron = action · Green = confirmation
   Documents print light: deeper saffron #E07B12 / green #138808
   ══════════════════════════════════════════════════════════════════ */

:root{
  --bg:#07090E; --bg-2:#0A0D14; --surface:#0D1018; --surface-2:#141925;
  --text:#E8ECF4; --muted:#8A93A6; --muted-2:#6B7488;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.15);
  --saffron:#FF9933; --saffron-hi:#FFC182; --saffron-dp:#F0821B;
  --green:#34C759; --green-hi:#6FE58F;
  --red:#FF6B6B; --amber:#FFC94D; --blue:#6E8CE8;

  --glass-fill:linear-gradient(177deg,rgba(255,255,255,.078) 0%,rgba(255,255,255,.024) 62%,rgba(255,255,255,.038) 100%);
  --glass-stroke:rgba(255,255,255,.105);
  --shadow:0 24px 64px -32px rgba(0,0,0,.92);
  --shadow-sm:0 10px 30px -18px rgba(0,0,0,.9);

  --font-display:"Space Grotesk","SF Pro Display",system-ui,sans-serif;
  --font-sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --font-deva:"Tiro Devanagari Hindi","Noto Sans Devanagari",Georgia,serif;

  --side-w:252px;
  --r:14px; --r-sm:10px; --r-lg:20px;
  --ease:cubic-bezier(.22,.61,.36,1);
  color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#EEF1F8; --bg-2:#E7EBF4; --surface:#FFFFFF; --surface-2:#F4F6FB;
  --text:#0E1320; --muted:#5A6478; --muted-2:#78829A;
  --line:rgba(15,22,40,.10); --line-2:rgba(15,22,40,.17);
  --saffron:#E07B12; --saffron-hi:#F09A3C; --saffron-dp:#C56808;
  --green:#138808; --green-hi:#2AA81C;
  --red:#C82F2F; --amber:#B07800; --blue:#3D5BC4;
  --glass-fill:linear-gradient(177deg,rgba(255,255,255,.86) 0%,rgba(255,255,255,.62) 100%);
  --glass-stroke:rgba(15,22,40,.10);
  --shadow:0 24px 54px -34px rgba(20,40,80,.42);
  --shadow-sm:0 10px 26px -18px rgba(20,40,80,.4);
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; min-height:100svh; background:var(--bg); color:var(--text);
  font-family:var(--font-sans); font-size:15px; line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  letter-spacing:-.003em; overflow-x:clip;
}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;letter-spacing:-.022em;margin:0;text-wrap:balance}
p{margin:0}
a{color:var(--saffron);text-decoration:none}
a:hover{text-decoration:underline}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--saffron);outline-offset:2px;border-radius:6px}
::selection{background:rgba(255,153,51,.28)}

/* ── ambient ground ─────────────────────────────────────────────── */
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.aurora i{position:absolute;display:block;border-radius:50%;filter:blur(80px);mix-blend-mode:screen}
.aurora .a1{width:min(56vw,820px);height:min(44vw,620px);left:-16%;top:-24%;
  background:radial-gradient(50% 50% at 50% 50%,rgba(255,153,51,.40),rgba(255,140,40,.13) 54%,transparent 76%);
  animation:drift1 26s var(--ease) infinite alternate}
.aurora .a2{width:min(44vw,620px);height:min(38vw,520px);right:-20%;top:30%;
  background:radial-gradient(50% 50% at 50% 50%,rgba(52,199,89,.15),transparent 72%);
  animation:drift2 32s var(--ease) infinite alternate}
.aurora .a3{width:min(68vw,1000px);height:min(36vw,500px);left:24%;bottom:-32%;
  background:radial-gradient(50% 50% at 50% 50%,rgba(78,112,220,.24),transparent 72%);
  animation:drift1 36s var(--ease) infinite alternate-reverse}
@keyframes drift1{to{transform:translate3d(5%,7%,0) scale(1.14)}}
@keyframes drift2{to{transform:translate3d(-6%,10%,0) scale(1.1)}}
:root[data-theme="light"] .aurora i{mix-blend-mode:normal;opacity:.5}

.grid-bg{position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(to right,rgba(255,255,255,.042) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.042) 1px,transparent 1px);
  background-size:76px 76px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0%,#000 8%,transparent 72%);
          mask-image:radial-gradient(120% 90% at 50% 0%,#000 8%,transparent 72%)}
:root[data-theme="light"] .grid-bg{background-image:
    linear-gradient(to right,rgba(15,22,40,.05) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(15,22,40,.05) 1px,transparent 1px)}

.grain{position:fixed;inset:-200%;z-index:3;pointer-events:none;opacity:.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grainShift 6s steps(6) infinite}
@keyframes grainShift{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}
  60%{transform:translate(-2%,-2%)}80%{transform:translate(3%,1%)}100%{transform:translate(0,0)}}

@media (prefers-reduced-motion:reduce){
  .aurora i,.grain{animation:none}
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* ── brand mark: white trace on ink, ink trace on paper ─────────── */
.m-light{display:none}
:root[data-theme="light"] .m-dark{display:none}
:root[data-theme="light"] .m-light{display:block}

/* ── brand wordmark ─────────────────────────────────────────────── */
.wm{line-height:1.02;display:flex;flex-direction:column;gap:3px;min-width:0}
.wm .deva{font-family:var(--font-deva);font-size:18px;color:var(--text);letter-spacing:0}
.wm .en{font-family:var(--font-display);font-size:9.5px;font-weight:600;
  letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}

/* ══ BUTTONS ════════════════════════════════════════════════════ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:9px 15px;border-radius:var(--r-sm);cursor:pointer;
  font-family:var(--font-display);font-size:13.5px;font-weight:600;letter-spacing:-.012em;
  border:1px solid transparent;background:none;color:var(--text);white-space:nowrap;
  transition:transform .2s var(--ease),background .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease);
}
.btn svg{width:14px;height:14px;flex:0 0 auto}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn:not(:disabled):active{transform:scale(.975)}

.btn-primary{
  color:#0A0D14;
  background:linear-gradient(180deg,rgba(255,177,101,.98),rgba(255,143,36,.92));
  border-color:rgba(255,205,150,.44);
  box-shadow:inset 0 1px 0 0 rgba(255,255,255,.5),inset 0 -1px 0 0 rgba(140,66,0,.3),
             0 12px 30px -14px rgba(255,153,51,.6);
}
.btn-primary:not(:disabled):hover{box-shadow:inset 0 1px 0 0 rgba(255,255,255,.55),0 16px 34px -12px rgba(255,153,51,.75)}
:root[data-theme="light"] .btn-primary{color:#fff;
  background:linear-gradient(180deg,#EF8F22,#D06E08);border-color:rgba(160,84,4,.35);
  box-shadow:inset 0 1px 0 0 rgba(255,255,255,.28),0 12px 26px -14px rgba(224,123,18,.6)}

.btn-soft{background:var(--glass-fill);border-color:var(--glass-stroke);color:var(--text);
  backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
  box-shadow:inset 0 1px 0 0 rgba(255,255,255,.12)}
.btn-soft:not(:disabled):hover{border-color:var(--line-2);background:rgba(255,255,255,.07)}
:root[data-theme="light"] .btn-soft:not(:disabled):hover{background:#fff}

.btn-ghost{color:var(--muted);border-color:transparent}
.btn-ghost:not(:disabled):hover{color:var(--text);background:rgba(255,255,255,.07)}
:root[data-theme="light"] .btn-ghost:not(:disabled):hover{background:rgba(15,22,40,.06)}

.btn-danger{color:var(--red);border-color:color-mix(in srgb,var(--red) 34%,transparent);
  background:color-mix(in srgb,var(--red) 10%,transparent)}
.btn-danger:not(:disabled):hover{background:color-mix(in srgb,var(--red) 18%,transparent)}

.btn-sm{padding:7px 11px;font-size:12.5px;border-radius:9px}
.btn-sm svg{width:13px;height:13px}
.btn-xs{padding:5px 9px;font-size:11.5px;border-radius:8px;gap:5px}
.btn-xs svg{width:12px;height:12px}
.btn-block{width:100%}
.btn.icon{padding:7px;aspect-ratio:1}

/* ══ LOGIN ══════════════════════════════════════════════════════ */
.login-wrap{position:relative;z-index:4;min-height:100svh;display:grid;place-items:center;
  padding:32px 20px}
.login-card{
  width:100%;max-width:410px;padding:clamp(26px,4vw,38px);
  border-radius:var(--r-lg);
  background:var(--glass-fill);border:1px solid var(--glass-stroke);
  backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);
  box-shadow:inset 0 1px 0 0 rgba(255,255,255,.18),var(--shadow);
  animation:riseIn .8s var(--ease) both;
}
:root[data-theme="light"] .login-card{background:#fff;box-shadow:var(--shadow)}
@keyframes riseIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:26px}
.login-brand img{width:44px;height:44px;object-fit:contain;
  filter:drop-shadow(0 3px 14px rgba(255,153,51,.34))}
.login-title{font-size:27px;font-weight:700;letter-spacing:-.03em;margin-bottom:4px}
.login-sub{font-size:13px;color:var(--muted);margin-bottom:24px}
.login-err{font-size:12.5px;color:var(--red);margin:-4px 0 14px;
  padding:9px 12px;border-radius:9px;
  background:color-mix(in srgb,var(--red) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--red) 30%,transparent)}
.login-foot{margin-top:22px;font-size:11.5px;color:var(--muted-2);text-align:center}
.login-foot .rule{display:block;height:2px;width:52px;margin:0 auto 14px;border-radius:2px;
  background:linear-gradient(90deg,var(--saffron) 0 33.3%,transparent 33.3% 66.6%,var(--green) 66.6% 100%)}

/* ══ FORM FIELDS ════════════════════════════════════════════════ */
.fld{display:block;margin-bottom:15px}
.fld > span:first-of-type,.lbl{display:block;font-size:11px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.fld-req > span:first-of-type::after{content:" *";color:var(--saffron)}
input,select,textarea{
  width:100%;padding:10px 13px;border-radius:var(--r-sm);
  background:var(--surface-2);color:var(--text);
  border:1px solid var(--line);
  font-family:var(--font-sans);font-size:14px;line-height:1.5;
  transition:border-color .18s var(--ease),background .18s var(--ease);
}
:root[data-theme="light"] input,:root[data-theme="light"] select,:root[data-theme="light"] textarea{background:#fff}
input:hover,select:hover,textarea:hover{border-color:var(--line-2)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--saffron);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--saffron) 16%,transparent)}
input::placeholder,textarea::placeholder{color:var(--muted-2)}
input[type=number],input.num-in{font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:right}
input[readonly],input:disabled,select:disabled,textarea:disabled{opacity:.6;cursor:not-allowed}
textarea{resize:vertical;min-height:74px}
select{appearance:none;cursor:pointer;padding-right:34px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A93A6' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;background-size:15px}
.hint{font-size:11.5px;color:var(--muted-2);margin-top:5px;line-height:1.5}
.fld-err{border-color:var(--red)!important}
.err-msg{font-size:11.5px;color:var(--red);margin-top:5px}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 16px}
.span2{grid-column:1/-1}
@media(max-width:640px){.grid2,.grid3{grid-template-columns:1fr}}

.check{display:flex;align-items:flex-start;gap:9px;padding:9px 11px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--surface-2);cursor:pointer;margin-bottom:8px}
:root[data-theme="light"] .check{background:#fff}
.check:hover{border-color:var(--line-2)}
.check input{width:16px;height:16px;flex:0 0 auto;margin:3px 0 0;accent-color:var(--saffron);cursor:pointer}
.check .ck-t{font-size:13.5px;font-weight:500;line-height:1.4}
.check .ck-s{font-size:11.5px;color:var(--muted);line-height:1.45}

.fieldset{border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:0 0 18px}
.fieldset > legend{font-family:var(--font-display);font-size:11.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);padding:0 8px}

/* ══ APP SHELL ══════════════════════════════════════════════════ */
.app{position:relative;z-index:4;display:grid;grid-template-columns:var(--side-w) minmax(0,1fr);min-height:100svh}

.side{
  position:sticky;top:0;height:100svh;display:flex;flex-direction:column;
  padding:20px 14px;gap:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
  backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);
  border-right:1px solid var(--line);
  box-shadow:inset -1px 0 0 0 rgba(255,255,255,.04);
  z-index:50;
}
:root[data-theme="light"] .side{background:rgba(255,255,255,.8)}
.side-brand{display:flex;align-items:center;gap:11px;padding:4px 8px 0}
.side-brand img{width:36px;height:36px;object-fit:contain;filter:drop-shadow(0 3px 12px rgba(255,153,51,.32))}

.side-nav{display:flex;flex-direction:column;gap:2px;flex:1;overflow-y:auto;margin:0 -4px;padding:0 4px}
.nav-item{
  display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:11px;
  font-size:13.5px;font-weight:500;letter-spacing:-.012em;color:var(--muted);
  cursor:pointer;border:1px solid transparent;text-align:left;width:100%;
  font-family:var(--font-sans);background:none;
  transition:color .2s var(--ease),background .2s var(--ease)}
.nav-item svg{width:16px;height:16px;flex:0 0 auto;opacity:.85}
.nav-item:hover{color:var(--text);background:rgba(255,255,255,.06)}
:root[data-theme="light"] .nav-item:hover{background:rgba(15,22,40,.05)}
.nav-item[aria-current="page"]{
  color:var(--text);font-weight:600;
  background:linear-gradient(90deg,color-mix(in srgb,var(--saffron) 20%,transparent),transparent 82%);
  border-color:color-mix(in srgb,var(--saffron) 26%,transparent)}
.nav-item[aria-current="page"] svg{color:var(--saffron);opacity:1}
.nav-item .cnt{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--muted-2);
  font-variant-numeric:tabular-nums}
.nav-sep{height:1px;background:var(--line);margin:9px 12px}

.side-foot{border-top:1px solid var(--line);padding-top:14px;display:flex;flex-direction:column;gap:11px}
.who{display:flex;align-items:center;gap:10px;padding:0 6px;min-width:0}
.who .av{width:34px;height:34px;border-radius:11px;flex:0 0 auto;display:grid;place-items:center;
  font-family:var(--font-display);font-size:12.5px;font-weight:700;color:#0A0D14;
  background:linear-gradient(150deg,var(--saffron-hi),var(--saffron));
  box-shadow:0 6px 18px -8px rgba(255,153,51,.7)}
:root[data-theme="light"] .who .av{color:#fff}
.who .wt{min-width:0}
.who .wn{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who .wr{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.side-actions{display:flex;gap:6px}
.side-actions #logoutBtn{flex:1}

.side-scrim{position:fixed;inset:0;z-index:45;background:rgba(0,0,0,.55);backdrop-filter:blur(3px)}

/* ── main + topbar ──────────────────────────────────────────────── */
.main{min-width:0;display:flex;flex-direction:column}
.topbar{
  position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:14px;
  padding:15px clamp(16px,2.6vw,32px);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
  backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);
  border-bottom:1px solid var(--line)}
:root[data-theme="light"] .topbar{background:rgba(255,255,255,.82)}
.crumbs{flex:1;min-width:0}
.crumbs h1{font-size:20px;font-weight:600;letter-spacing:-.026em}
.crumbs p{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.burger{display:none}

.view{padding:clamp(18px,2.6vw,30px);flex:1;animation:fadeIn .35s var(--ease) both}
@keyframes fadeIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}

@media(max-width:960px){
  .app{grid-template-columns:1fr}
  .side{position:fixed;left:0;top:0;width:min(84vw,var(--side-w));transform:translateX(-102%);
    transition:transform .3s var(--ease);box-shadow:var(--shadow)}
  .app.side-open .side{transform:none}
  .burger{display:inline-flex}
}

/* ══ BOOT PANEL ═════════════════════════════════════════════════
   Stands in for the old login card. Access has already decided who
   is here; this only reports progress, or why nothing loaded. */
.boot-card{text-align:center;gap:6px}
.boot-card h1{font-family:var(--font-display);font-size:20px;font-weight:600;margin:2px 0 4px}
.boot-card p{color:var(--muted);font-size:13.5px;line-height:1.6;margin:0}
.boot-card p.small{font-size:12px;color:var(--muted-2);margin-top:10px}
.boot-card .btn{margin-top:16px;align-self:center}