/* V42.2 professional visual system
   Loaded last to consolidate the accumulated module styles without changing business logic. */
:root{
  --ui-primary:var(--store-theme,var(--theme-primary,var(--green,#155c49)));
  --ui-primary-dark:var(--store-theme-dark,#0e4739);
  --ui-primary-soft:var(--store-theme-soft,#eaf4f0);
  --ui-primary-faint:var(--store-theme-faint,#f5f9f7);
  --ui-gold:#c49346;
  --ui-danger:#c34f45;
  --ui-warning:#b87816;
  --ui-ink:#17231f;
  --ui-text:#33433e;
  --ui-muted:#73817c;
  --ui-bg:#f5f7f6;
  --ui-surface:#fff;
  --ui-surface-subtle:#f8faf9;
  --ui-line:#dde6e2;
  --ui-line-strong:#cad8d2;
  --ui-radius-sm:9px;
  --ui-radius:14px;
  --ui-radius-lg:20px;
  --ui-shadow-sm:0 2px 8px rgba(22,50,41,.045);
  --ui-shadow:0 12px 34px rgba(20,55,44,.075);
  --ui-shadow-lg:0 28px 80px rgba(15,40,32,.22);
  --ui-ease:cubic-bezier(.2,.75,.25,1);
}

html{background:var(--ui-bg);scrollbar-gutter:stable}
body{color:var(--ui-text);background:
  radial-gradient(circle at 96% 0,color-mix(in srgb,var(--ui-primary) 8%,transparent) 0,transparent 27rem),
  var(--ui-bg);font-family:"Microsoft YaHei UI","PingFang SC",Inter,system-ui,sans-serif;font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
button{letter-spacing:.01em}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,var(--ui-primary) 18%,transparent);outline-offset:1px}

/* Application shell */
#app{grid-template-columns:248px minmax(0,1fr)}
aside{width:248px;padding:24px 16px 18px;background:
  radial-gradient(circle at 20% 0,rgba(255,255,255,.075),transparent 20rem),
  linear-gradient(180deg,var(--ui-primary-dark),color-mix(in srgb,var(--ui-primary-dark) 88%,#061b15));
  border-right:1px solid rgba(255,255,255,.08);box-shadow:12px 0 36px rgba(16,50,39,.07)}
.brand{padding:5px 14px 24px;border-bottom:1px solid rgba(255,255,255,.09);margin-bottom:12px}
.brand b{font-size:22px;line-height:1.25;letter-spacing:.045em;font-weight:800}.brand span{margin-top:7px;opacity:.64;letter-spacing:.13em}
nav{gap:4px;overflow-y:auto;overflow-x:hidden;padding:2px 0 8px;scrollbar-width:none}nav::-webkit-scrollbar{display:none}
nav button{min-height:46px;padding:11px 13px 11px 46px!important;border-radius:11px!important;color:rgba(239,248,244,.78)!important;font-weight:560!important;transition:background .2s ease,color .2s ease,transform .2s ease!important}
nav button:before{left:15px!important;top:50%!important;transform:translateY(-50%);font-size:16px;opacity:.72!important}
nav button:hover{background:rgba(255,255,255,.075)!important;color:#fff!important;transform:translateX(2px)!important}
nav button.active{background:linear-gradient(90deg,rgba(255,255,255,.16),rgba(255,255,255,.075))!important;color:#fff!important;box-shadow:inset 3px 0 0 var(--ui-gold),0 7px 18px rgba(0,0,0,.07)!important}
.user{margin:12px 0 0;padding:14px 14px;border:1px solid rgba(255,255,255,.075)!important;border-radius:12px!important;background:rgba(255,255,255,.055)!important;align-items:center;gap:8px}
.user #who{font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user .link{flex:none;color:rgba(255,255,255,.8);padding:6px 8px;border-radius:7px;cursor:pointer}.user .link:hover{color:#fff;background:rgba(255,255,255,.08)}
main{grid-column:2;padding:0 34px 52px;min-width:0}
header{height:100px;gap:12px}header h2{font-size:27px;line-height:1.15;color:var(--ui-ink);font-weight:800;letter-spacing:.025em}header small{display:block;margin-top:5px;color:var(--ui-muted)}header .ghost{margin-left:0!important}header>div+button{margin-left:auto!important}header>button+button{margin-left:0!important}
#view{animation:uiViewIn .38s var(--ui-ease) both}

/* Controls */
.primary,.ghost,.danger,.login button,.toolbar button,.actions button,.panel-head button{min-height:40px;border-radius:10px;padding:9px 16px;font-weight:650;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease,filter .18s ease;cursor:pointer}
.primary,.login button{border:1px solid transparent!important;background:var(--ui-primary)!important;color:#fff!important;box-shadow:0 7px 16px color-mix(in srgb,var(--ui-primary) 19%,transparent)!important}
.primary:hover,.login button:hover{filter:brightness(1.04);transform:translateY(-1px);box-shadow:0 10px 22px color-mix(in srgb,var(--ui-primary) 25%,transparent)!important}
.ghost{border:1px solid var(--ui-line-strong)!important;background:rgba(255,255,255,.88)!important;color:var(--ui-primary)!important;box-shadow:none!important}
.ghost:hover{border-color:color-mix(in srgb,var(--ui-primary) 35%,var(--ui-line))!important;background:var(--ui-primary-faint)!important;transform:translateY(-1px)}
.danger{border:1px solid #f0d4d0!important;background:#fff7f6!important;color:var(--ui-danger)!important}.danger:hover{background:#fff0ee!important}
.link{cursor:pointer;color:var(--ui-primary);font-weight:650}
button:disabled{opacity:.5;cursor:not-allowed!important;transform:none!important;box-shadow:none!important}

input,select,textarea,.toolbar input,.toolbar select,.field input,.field select,.field textarea{border:1px solid var(--ui-line-strong)!important;border-radius:10px!important;background:#fff!important;color:var(--ui-ink);min-height:42px;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
textarea{line-height:1.65;resize:vertical}
input::placeholder,textarea::placeholder{color:#9aa6a1}
input:hover,select:hover,textarea:hover{border-color:color-mix(in srgb,var(--ui-primary) 28%,var(--ui-line-strong))!important}
input:focus,select:focus,textarea:focus{outline:0!important;border-color:color-mix(in srgb,var(--ui-primary) 68%,#fff)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--ui-primary) 11%,transparent)!important}

/* Toolbars, cards and panels */
.toolbar{display:flex;align-items:center;gap:10px;margin:0 0 16px;padding:14px 15px;border:1px solid var(--ui-line)!important;border-radius:var(--ui-radius)!important;background:rgba(255,255,255,.9)!important;box-shadow:var(--ui-shadow-sm)!important}
.toolbar input,.toolbar select{padding:9px 12px}.toolbar>span{color:var(--ui-muted)}
.cards{gap:16px}.card,.panel{border:1px solid var(--ui-line)!important;background:rgba(255,255,255,.94)!important;box-shadow:var(--ui-shadow-sm)!important}
.card{min-height:122px;padding:20px 21px;border-radius:var(--ui-radius)!important;isolation:isolate}.card:after{width:94px!important;height:94px!important;right:-38px!important;top:-40px!important;background:linear-gradient(145deg,color-mix(in srgb,var(--ui-primary) 10%,transparent),transparent)!important}
.card small{color:var(--ui-muted);font-size:13px}.card strong{margin-top:8px;font-size:28px;line-height:1.25;color:var(--ui-ink);font-variant-numeric:tabular-nums}.card em{display:block;margin-top:5px;color:var(--ui-muted);font-size:12px;font-style:normal}.card.green strong{color:var(--ui-primary)}.card.red strong{color:var(--ui-danger)}
.clickable-card{cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.clickable-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--ui-primary) 24%,var(--ui-line))!important;box-shadow:var(--ui-shadow)!important}
.panel{padding:22px;border-radius:var(--ui-radius-lg)!important;margin-bottom:16px}.panel+.panel{margin-top:16px}.panel-head{min-height:42px;margin-bottom:17px;gap:16px}.panel-head h3,.panel h3{color:var(--ui-ink);font-size:17px;font-weight:780}.panel-head small{display:block;margin-top:4px;color:var(--ui-muted)}
.grid2{gap:16px;margin-top:16px}

/* Data tables */
.table-wrap{border:1px solid var(--ui-line);border-radius:12px;overflow:auto;background:#fff;scrollbar-color:#b8c6c0 transparent;scrollbar-width:thin}
.table-wrap table{border-collapse:separate;border-spacing:0}
th,td{padding:13px 12px;border-bottom:1px solid var(--ui-line);vertical-align:middle}
th{height:45px;background:var(--ui-surface-subtle)!important;color:#65746f;font-size:12px;font-weight:700;letter-spacing:.025em}
td{color:var(--ui-text);font-variant-numeric:tabular-nums}tbody tr:last-child td{border-bottom:0}tbody tr{transition:background .15s ease}tbody tr:hover{background:var(--ui-primary-faint)!important}tbody tr:hover td{background:transparent!important}
.badge{display:inline-flex;align-items:center;min-height:25px;padding:3px 9px;border:1px solid #ecd8aa;border-radius:999px;background:#fff8e8;color:#95671b;font-size:12px;font-weight:700}.badge.ok{border-color:#cce3d9;background:#edf8f3;color:var(--ui-primary)}.badge.pending{border-color:#f0d6a5;background:#fff8e8;color:#9c6712}
.empty{padding:46px 20px;color:var(--ui-muted);text-align:center}

/* Forms and settings */
.form-grid{gap:16px}.field label{margin-bottom:6px;color:#687873;font-weight:620}.field input,.field select,.field textarea{padding:11px 12px}
.actions{gap:10px;margin-top:22px;padding-top:18px;border-top:1px solid var(--ui-line)}
.settings-main-panel{max-width:1120px}.settings-main-panel hr{border:0;border-top:1px solid var(--ui-line);margin:28px 0}

/* Modals */
.modal{z-index:900;padding:20px;background:rgba(15,29,25,.52);backdrop-filter:blur(8px) saturate(.85)}
.dialog{width:min(820px,96vw);max-height:calc(100dvh - 40px);padding:27px;border:1px solid rgba(255,255,255,.82)!important;border-radius:22px!important;background:#fff;box-shadow:var(--ui-shadow-lg)!important;overscroll-behavior:contain;animation:uiDialogIn .32s var(--ui-ease) both}
.dialog>.close{z-index:50;right:18px;top:16px;width:38px;height:38px;padding:0;border:1px solid transparent;border-radius:50%;background:#f2f6f4;color:#61716b;font-size:22px;line-height:36px;cursor:pointer}.dialog>.close:hover{border-color:var(--ui-line);background:#eaf1ee;color:var(--ui-ink)}
.dialog h2{margin:4px 48px 21px 0;color:var(--ui-ink);font-size:25px;line-height:1.3}.dialog .panel{box-shadow:none!important}
.account-dialog-wide{width:min(1540px,calc(100vw - 40px))!important}.account-dialog-wide .cards{grid-template-columns:repeat(3,minmax(190px,280px));justify-content:start}.account-dialog-wide .card{min-height:116px}

/* Login */
.login{background:
  radial-gradient(circle at 18% 12%,color-mix(in srgb,var(--ui-primary) 72%,#fff) 0,transparent 28rem),
  linear-gradient(145deg,var(--ui-primary-dark),color-mix(in srgb,var(--ui-primary-dark) 82%,#061711))}
.login-card{width:min(420px,calc(100vw - 32px));padding:42px;border:1px solid rgba(255,255,255,.65);border-radius:24px;box-shadow:0 35px 90px rgba(5,22,17,.42);text-align:left}.login-card .mark{margin:0;width:58px;height:58px;border-radius:16px;background:linear-gradient(145deg,var(--ui-primary),var(--ui-gold));font-size:30px;line-height:58px;text-align:center;box-shadow:0 12px 28px color-mix(in srgb,var(--ui-primary) 25%,transparent)}
.login-card h1{font-size:28px}.login-card p{margin-bottom:25px}.login-card input{height:48px;padding:12px 14px}.login-card button{height:48px;margin-top:17px}.login-card small{display:block;margin-top:3px;text-align:center}

/* Module entrance motion */
.home-enter>.card,.account-summary>.card,.expense-category-cards>.card{animation:uiCardIn .46s var(--ui-ease) both;animation-delay:var(--delay,0ms)}
@keyframes uiViewIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
@keyframes uiCardIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none}}
@keyframes uiDialogIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}

/* Do not let the professional shell alter printable customer documents. */
.sale-document,.delivery-document,.invoice-print,.sale-export-sheet{font-family:"Microsoft YaHei","PingFang SC",sans-serif}

@media(max-width:1100px){#app{grid-template-columns:220px minmax(0,1fr)}aside{width:220px}main{padding-left:24px;padding-right:24px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}header{height:88px}.account-dialog-wide .cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){#app{display:block}aside{width:min(280px,84vw);z-index:950}main{padding:0 14px 34px}header{height:auto;min-height:78px;padding:12px 0;flex-wrap:wrap}header h2{font-size:22px}header>div{min-width:calc(100% - 48px)}header>div+button{margin-left:0!important}.cards{grid-template-columns:1fr 1fr;gap:12px}.card{min-height:108px;padding:17px}.panel{padding:16px;border-radius:15px!important}.toolbar{align-items:stretch}.toolbar input,.toolbar select,.toolbar button{flex:1 1 150px}.modal{padding:8px}.dialog{padding:20px 16px;border-radius:18px!important;max-height:calc(100dvh - 16px)}.dialog h2{font-size:21px}.account-dialog-wide{width:calc(100vw - 16px)!important}.account-dialog-wide .cards{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}.span2{grid-column:auto}}
@media(max-width:520px){.cards,.account-dialog-wide .cards{grid-template-columns:1fr}.card{min-height:96px}.login-card{padding:30px 24px}.toolbar{padding:12px}.panel-head{align-items:flex-start;flex-direction:column}.panel-head>button,.panel-head>.actions{width:100%}.panel-head>button{justify-content:center}.actions{flex-wrap:wrap}.actions button{flex:1 1 120px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}