/* ================================================================
   岸香咖啡经营管理系统 · 全局样式（同原版不变）
   ================================================================ */
* { margin: 0; padding: 0; box-sizing: border-box; }
:root {
    --bg:#f7f4ee;--card:#fff;--card-h:#faf8f3;--bd:#e5dfd4;--bd-l:#ece8df;
    --ac:#b08d57;--ac-h:#c9a86c;--tx:#2c2c2c;--tx-s:#666;--tx-m:#aaa;
    --gn:#3d8b5e;--gn-b:rgba(61,139,94,.06);--rd:#c75450;--rd-b:rgba(199,84,80,.06);
    --og:#d4a017;--og-b:rgba(212,160,23,.07);--r:8px;
    --sh:0 1px 4px rgba(0,0,0,.04);--sh2:0 4px 16px rgba(0,0,0,.06);
    --fd:'Playfair Display',serif;--fb:'Noto Serif SC',Georgia,serif;
    --fm:'Lexend','DM Mono',monospace;--sp:12px;--sp-l:16px;
    --bg-primary:var(--bg);--bg-secondary:var(--card);--bg-tertiary:var(--card-h);
    --border:var(--bd);--border-light:var(--bd-l);--accent:var(--ac);--accent-hover:var(--ac-h);
    --accent-text:#fff;--accent-secondary:var(--ac-h);--text-primary:var(--tx);
    --text-secondary:var(--tx-s);--text-muted:var(--tx-m);--accent-green:var(--gn);
    --accent-red:var(--rd);--accent-amber:var(--og);--shadow:var(--sh);
    --overlay:rgba(44,44,44,.5);--modal-bg:var(--card);--modal-border:var(--bd);
}
html{font-size:15px}
body{background:var(--bg);color:var(--tx);font-family:var(--fb);min-height:100vh}
.hrow{display:flex;gap:6px;align-items:center;margin-bottom:10px;flex-wrap:wrap}
.hrow label{font-size:.78rem;color:var(--tx-s);white-space:nowrap;flex-shrink:0;min-width:36px}
#syncInd{display:flex;align-items:center;gap:4px;cursor:pointer;padding:3px 8px;border-radius:12px}
.sync-dot {display: inline-block;width: 6px;height: 6px;border-radius: 50%;}
.search-toggle{cursor:pointer;padding:6px;border-radius:6px;transition:background .2s}
.search-toggle:hover{background:var(--card-h)}
.search-bar{background:var(--card);border-bottom:1px solid var(--bd);padding:10px 0;display:none;animation:slideDown .2s ease}
.search-bar.show{display:block}
@keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.search-inner{max-width:1060px;margin:0 auto;padding:0 20px;display:flex;gap:8px;align-items:center}
.search-inner input{flex:1;background:var(--card-h);border:1px solid var(--bd);border-radius:6px;padding:9px 14px;font-family:var(--fb);font-size:.82rem;color:var(--tx);outline:none}
.search-inner input:focus{border-color:var(--ac)}
.search-close{background:none;border:none;font-size:1.1rem;cursor:pointer;color:var(--tx-m);padding:4px 8px;border-radius:4px}
.search-close:hover{color:var(--tx);background:var(--card-h)}
.search-results{max-width:1060px;margin:0 auto;padding:0 20px 20px}
.main{max-width:1060px;margin:0 auto;padding:22px 20px 60px}
.page-title{font-size:1.1rem;font-weight:700;margin-bottom:18px}
.page.active{display:block}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-bottom:20px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:15px;box-shadow:var(--sh)}
.card-l{font-size:.65rem;color:var(--tx-m);margin-bottom:2px;letter-spacing:.05em}
.card-v{font-family:var(--fm);font-size:1rem;font-weight:500;text-align:left}
.card-v.gn{color:var(--gn)}.card-v.rd{color:var(--rd)}.card-v.ac{color:var(--ac)}.card-v.og{color:var(--og)}
.card-sub{font-size:.65rem;color:var(--tx-m);margin-top:2px}
.sec{font-size:.7rem;color:var(--tx-m);letter-spacing:.08em;text-transform:uppercase;margin:22px 0 12px;padding-bottom:7px;border-bottom:1px solid var(--bd-l)}
.tw{overflow-x:auto;border:1px solid var(--bd);border-radius:var(--r);background:var(--card);margin-bottom:14px}
table{width:100%;border-collapse:collapse}
th{background:var(--card-h);font-size:.66rem;color:var(--tx-s);text-align:left;padding:9px 10px;border-bottom:1px solid var(--bd);font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
td{padding:8px 10px;border-bottom:1px solid var(--bd-l);font-size:.78rem;white-space:nowrap}
tr:last-child td{border-bottom:none}
tr:hover td{background:var(--card-h)}
.nr{text-align:left;font-family:var(--fm)}
.inp{padding:8px 12px;font-size:.82rem;border:1px solid var(--bd-l);border-radius:8px;background:var(--card);color:var(--tx);outline:none;font-family:var(--fm);transition:border-color .2s,box-shadow .2s,background .2s;line-height:1.4}
.inp:focus{border-color:var(--ac);box-shadow:0 0 0 2px rgba(212,168,83,.15);background:var(--card-h)}
.inp::placeholder{color:var(--tx-s);font-family:var(--fb);font-style:italic}
textarea.inp{width:100%;resize:vertical;font-family:var(--fb);min-height:80px;line-height:1.6}
select.inp{cursor:pointer;appearance:none;-webkit-appearance:none;padding-right:28px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' stroke='%23888' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center}
select.inp:hover{border-color:var(--tx-m)}
select.inp option{background:var(--card);color:var(--tx)}
.brow{display:flex;gap:7px;flex-wrap:wrap}
.btn{padding:7px 16px;border-radius:6px;border:1px solid var(--bd);background:var(--card);color:var(--tx);font-family:var(--fb);font-size:.78rem;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--card-h)}
.btn.p{background:var(--ac);color:#fff;border-color:var(--ac);font-weight:600}
.btn.p:hover{background:var(--ac-h)}
.btn.s{padding:4px 10px;font-size:.7rem}
.btn.d{color:var(--rd);border-color:var(--rd);background:rgba(199,84,80,.06)}
.btn.d:hover{background:rgba(199,84,80,.12)}
.btn.g{background:var(--gn);color:#fff;border-color:var(--gn);font-weight:600}
.btn.og{color:var(--og);border-color:var(--og);background:var(--og-b)}
.btn.og:hover{background:rgba(212,160,23,.12)}
.badge{display:inline-block;font-size:.6rem;padding:2px 8px;border-radius:12px;font-weight:600}
.badge.gn{background:var(--gn-b);color:var(--gn)}
.badge.rd{background:var(--rd-b);color:var(--rd)}
.badge.og{background:var(--og-b);color:var(--og)}
.pv-card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:14px;margin-bottom:10px;box-shadow:var(--sh)}
.pv-card h4{font-size:.82rem;color:var(--ac);margin-bottom:10px}
.pv-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid var(--bd-l);font-size:.8rem}
.pv-row:last-child{border-bottom:none}
.pv-row .k{color:var(--tx-s)}
.ed-input{background:var(--card-h);border:1px solid transparent;border-radius:4px;font-family:var(--fm);font-size:.8rem;padding:3px 6px;width:80px;text-align:left;color:var(--tx)}
.ed-input:focus{border-color:var(--ac);outline:none;background:#fff}
.chart-area{display:flex;align-items:flex-end;gap:6px;height:120px;padding:8px 0}
.chart-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.chart-bar{width:100%;max-width:32px;border-radius:3px 3px 0 0;transition:height .5s ease;min-height:2px}
.chart-bar.c1{background:var(--ac);opacity:.85}
.chart-lbl{font-family:var(--fm);font-size:.56rem;color:var(--tx-m);text-align:center;line-height:1.2}
.item-card{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--card);border:1px solid var(--bd);border-radius:var(--r);margin-bottom:6px;font-size:.8rem;box-shadow:var(--sh);gap:8px;flex-wrap:wrap}
.item-card .name{font-weight:600;min-width:100px}
.item-card .nums{font-family:var(--fm);display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.tab-bar{display:flex;gap:0;margin-bottom:14px;border-bottom:1px solid var(--bd)}
.tab-btn{background:none;border:none;font-family:var(--fb);font-size:.78rem;color:var(--tx-m);padding:8px 14px;cursor:pointer;position:relative}
.tab-btn:hover{color:var(--tx)}
.tab-btn.active{color:var(--ac);font-weight:600}
.tab-btn.active::after{content:'';position:absolute;bottom:-1px;left:8px;right:8px;height:2px;background:var(--ac)}
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:500}
.overlay.show{display:block}
.modal{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:22px;width:92%;max-width:560px;max-height:80vh;overflow-y:auto;z-index:501;box-shadow:var(--sh2);cursor:default}
.modal.show{display:block}
.modal h3{font-size:.92rem;margin-bottom:14px;color:var(--ac)}
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(60px);background:var(--ac);color:#fff;padding:9px 22px;border-radius:7px;font-weight:600;font-size:.8rem;opacity:0;transition:all .3s cubic-bezier(.16,1,.3,1);z-index:9999;pointer-events:none;white-space:nowrap;max-width:90vw}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.alert-bar{background:var(--og-b);border:1px solid rgba(212,160,23,.15);border-radius:var(--r);padding:10px 14px;margin-bottom:14px;font-size:.78rem;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tea-sale-row{display:flex;align-items:center;gap:6px;padding:6px 0;border-bottom:1px solid var(--bd-l);font-size:.78rem;flex-wrap:wrap}
.tea-sale-row label{min-width:70px;font-weight:600}
.free-row{display:flex;gap:6px;margin-bottom:6px;align-items:center}
.section-label{font-size:.78rem;color:var(--ac);font-weight:600;margin:16px 0 10px;padding-bottom:6px;border-bottom:1px dashed var(--bd-l)}
.pur-folder{margin-bottom:8px}
.pur-hdr{background:var(--card-h);border:1px solid var(--bd);border-radius:var(--r);padding:10px 14px;font-size:.8rem;font-weight:600;display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none}
.pur-hdr:hover{background:var(--bd-l)}
.pur-hdr .ico{font-size:.6rem;color:var(--tx-m);width:12px}
.pur-hdr .total{font-family:var(--fm);margin-left:auto;font-size:.82rem;font-weight:600;color:var(--ac)}
.pur-body{border:1px solid var(--bd);border-top:none;border-radius:0 0 var(--r) var(--r);overflow:hidden}
.pur-tbl{width:100%;border-collapse:collapse}
.pur-tbl th{background:var(--card-h);font-size:.66rem;color:var(--tx-s);text-align:left;padding:7px 10px;border-bottom:1px solid var(--bd);font-weight:600}
.pur-tbl td{padding:6px 10px;border-bottom:1px solid var(--bd-l);font-size:.78rem}
.pur-tbl tr:last-child td{border-bottom:none}
.pur-tbl tr:hover td{background:var(--card-h)}
.totals-bar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.pm-edit{background:var(--card-h);border:1px solid var(--bd);border-radius:4px;font-size:.74rem;padding:4px 6px;width:100%;min-width:50px}
.pm-edit:focus{border-color:var(--ac);outline:none}
.tag-btns{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:8px;align-items:center}
.tag-btn{padding:3px 10px;border-radius:12px;border:1px solid var(--bd);background:var(--card-h);color:var(--tx-s);font-family:var(--fb);font-size:.72rem;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.tag-btn:hover{border-color:var(--ac);color:var(--ac);background:var(--card)}
@keyframes aiSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.toolbar{position:fixed;top:0;left:0;width:60px;height:100vh;background:rgba(255,255,255,.75);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:center;padding:12px 0;z-index:200;overflow-y:auto;overflow-x:hidden;scrollbar-width:none}
.tl-main{font-size:.82rem;font-weight:700;letter-spacing:.06em}
.tl-sub{font-size:.4rem;font-weight:600;letter-spacing:.15em;opacity:.8;margin-top:1px}
.toolbar-divider{width:28px;height:1px;background:var(--border);margin:4px 0 10px;flex-shrink:0}
.toolbar-group{display:flex;flex-direction:column;align-items:center;gap:2px;margin-bottom:12px;width:100%;padding:0 6px}
.toolbar-btn{width:42px;height:42px;border:none;background:transparent;color:var(--text-muted);border-radius:10px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:all .15s;position:relative;flex-shrink:0}
.toolbar-btn .ticon{font-size:1.05rem;line-height:1;transition:transform .15s}
.toolbar-btn .tlabel{font-size:.48rem;font-weight:600;letter-spacing:.02em;opacity:.7;transition:opacity .15s}
.toolbar-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}
.toolbar-btn:hover .ticon{transform:scale(1.1)}
.toolbar-btn:hover .tlabel{opacity:1}
.toolbar-btn.active{background:rgba(26,115,232,.08);color:var(--accent)}
.toolbar-btn.active::before{content:'';position:absolute;left:-6px;top:50%;transform:translateY(-50%);width:3px;height:20px;background:var(--accent);border-radius:0 3px 3px 0}
.toolbar-btn .badge-dot{position:absolute;top:6px;right:8px;width:6px;height:6px;background:var(--accent-red);border-radius:50%;border:1.5px solid #fff}
.toolbar-bottom{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:2px;padding:0 6px;width:100%}
.toolbar-user{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-secondary));display:flex;align-items:center;justify-content:center;color:#fff;font-size:.65rem;font-weight:700;cursor:pointer;transition:box-shadow .2s;margin-top:8px}
.toolbar-user:hover{box-shadow:0 0 0 3px rgba(26,115,232,.15)}
.toolbar-mask{display:none;position:fixed;inset:0;background:var(--overlay);z-index:299}
.hamburger{display:none;width:34px;height:34px;border:none;background:transparent;color:var(--text-primary);font-size:1.2rem;cursor:pointer;align-items:center;justify-content:center;border-radius:8px;transition:background .15s;flex-shrink:0;margin-right:8px}
.hamburger:hover{background:var(--bg-tertiary)}
.floating-nav{position:fixed;top:12px;left:80px;right:16px;height:48px;background:rgba(255,255,255,.6);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(210,227,252,.5);border-radius:14px;box-shadow:0 4px 24px rgba(26,115,232,.06),0 1px 2px rgba(0,0,0,.04);display:flex;align-items:center;padding:0 16px;z-index:180;transition:all .3s cubic-bezier(.16,1,.3,1)}
.floating-nav.scrolled{background:rgba(255,255,255,.85);box-shadow:0 8px 32px rgba(26,115,232,.1),0 1px 2px rgba(0,0,0,.06)}
.fnav-title{font-size:.88rem;font-weight:700;color:var(--text-primary);display:flex;align-items:center;gap:8px;margin-right:auto;white-space:nowrap}
.fnav-title .page-icon{font-size:1rem}
.fnav-tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.fnav-tabs::-webkit-scrollbar{display:none}
.fnav-tab{padding:6px 14px;font-size:.78rem;font-weight:500;color:var(--text-secondary);border:none;background:transparent;border-radius:8px;cursor:pointer;transition:all .15s;white-space:nowrap}
.fnav-tab:hover{background:rgba(26,115,232,.04);color:var(--text-primary)}
.fnav-tab.active{background:rgba(26,115,232,.08);color:var(--accent);font-weight:600}
.fnav-right{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0}
.search-wrap{position:relative}
.search-wrap::before{content:'⌕';position:absolute;left:10px;top:50%;transform:translateY(-50%);font-size:.9rem;color:var(--text-muted);pointer-events:none}
.fnav-search{width:160px;padding:6px 12px 6px 28px;border:1px solid transparent;border-radius:8px;background:rgba(241,245,254,.6);color:var(--text-primary);font-family:'DM Sans',sans-serif;font-size:.78rem;outline:none;transition:all .2s}
.fnav-search:focus{width:220px;border-color:var(--border);background:var(--bg-secondary);box-shadow:0 0 0 3px rgba(26,115,232,.06)}
.fnav-search::placeholder{color:var(--text-muted)}
.fnav-icon-btn{width:32px;height:32px;border:none;background:transparent;color:var(--text-muted);border-radius:8px;cursor:pointer;font-size:.9rem;display:flex;align-items:center;justify-content:center;transition:all .15s}
.fnav-icon-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}
.sync-label{font-size:.72rem;font-weight:500;color:var(--text-secondary)}
.main-content{margin-left:60px;padding:76px 20px 24px 20px;min-height:100vh;position:relative;z-index:1}
@media(max-width:960px){.fnav-search{width:120px}.fnav-search:focus{width:160px}#headerDate{display:none}.fnav-tab{padding:6px 10px;font-size:.72rem}}
@media(max-width:840px){.fnav-tabs{display:none}.fnav-search{width:100px}.fnav-search:focus{width:140px}}
@media(max-width:768px){.hamburger{display:flex}.toolbar{top:0;left:0;width:140px;height:100vh;flex-direction:column;align-items:stretch;padding:16px 12px;border-right:1px solid var(--border);border-top:none;background:#f5f5f5;transform:translateX(-100%);transition:transform .3s cubic-bezier(.16,1,.3,1);z-index:300;overflow-y:auto}.toolbar.open{transform:translateX(0)}.toolbar-mask.open{display:block}.toolbar-logo{padding:12px 14px;cursor:pointer;border-radius:10px;transition:background .15s}.toolbar-logo:hover{background:var(--bg-tertiary)}.toolbar-divider{display:none}.toolbar-group{display:flex;flex-direction:column;gap:2px;margin-bottom:10px;padding:8px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;width:100%}.toolbar-btn{width:100%;height:36px;flex-direction:row;justify-content:flex-start;gap:10px;padding:0 10px;border-radius:8px}.toolbar-btn .ticon{font-size:.9rem;width:18px;text-align:center}.toolbar-btn .tlabel{font-size:.72rem;opacity:1}.toolbar-btn.active::before{left:0;top:50%;transform:translateY(-50%);width:3px;height:20px}.toolbar-bottom{margin-top:auto;display:flex;flex-direction:column;padding:8px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;width:100%;align-items:center;gap:8px}.floating-nav{left:8px;right:8px;top:8px}.main-content{margin-left:0;padding:68px 12px 24px}.hrow{display:flex!important;flex-wrap:wrap!important;gap:4px 6px!important;align-items:center!important;margin-bottom:8px!important}.hrow label{font-size:.72rem!important;white-space:nowrap!important;flex-shrink:0!important;width:auto!important}.hrow .inp,.hrow select.inp{flex:1!important;min-width:80px!important;max-width:none!important;width:auto!important}.hrow .btn{flex-shrink:0!important}.search-wrap{display:none}#syncLabel{display:none!important}}

.date-picker{position:absolute;z-index:10000;width:240px;background:var(--card);border:1px solid var(--bd);border-radius:14px;box-shadow:0 12px 48px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.06);padding:12px;font-family:var(--fm);animation:dpFadeIn .15s ease}
@keyframes dpFadeIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.dp-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding:0 2px}
.dp-title{font-size:.92rem;font-weight:600;color:var(--tx)}
.dp-nav{width:26px;height:26px;border:none;background:var(--card-h);color:var(--tx-m);border-radius:10px;font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:var(--fm)}
.dp-nav:hover{background:var(--bd);color:var(--tx)}
.dp-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:6px}
.dp-wd{text-align:center;font-size:.68rem;font-weight:600;color:var(--tx-s);padding:6px 0}
.dp-days{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.dp-day{text-align:center;padding:5px 0;font-size:.72rem;color:var(--tx);border-radius:10px;cursor:pointer;line-height:1;position:relative}
.dp-day:hover{background:var(--card-h)}.dp-day.dp-empty{cursor:default}.dp-day.dp-empty:hover{background:transparent}
.dp-day.dp-today{font-weight:700;color:var(--ac)}
.dp-day.dp-today::after{content:"";position:absolute;bottom:3px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--ac)}
.dp-day.dp-selected{background:var(--ac);color:#fff;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:0 2px 8px rgba(161,193,161,.35)}
.dp-day.dp-selected:hover{background:var(--ac)}.dp-day.dp-selected::after{display:none}
.dp-footer{display:flex;justify-content:space-between;margin-top:12px;padding-top:10px;border-top:1px solid var(--bd)}
.dp-btn{padding:6px 16px;border-radius:8px;border:none;font-size:.68rem;font-family:var(--fm);cursor:pointer}
.dp-btn-today{background:var(--ac);color:#fff;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.15)}
.dp-btn-today:hover{box-shadow:0 2px 8px rgba(161,193,161,.35)}
.dp-btn-clear{background:var(--card-h);color:var(--tx-m);border:1px solid var(--bd)}
.dp-btn-clear:hover{color:var(--rd);border-color:var(--rd)}
.dp-months{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.dp-month{text-align:center;padding:9px 0;font-size:.72rem;color:var(--tx);border-radius:10px;cursor:pointer}
.dp-month:hover{background:var(--card-h)}
.dp-month.dp-today{font-weight:700;color:var(--ac)}
.dp-month.dp-selected{background:var(--ac);color:#fff;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:0 2px 8px rgba(161,193,161,.35)}
.dp-month.dp-selected:hover{background:var(--ac)}
.rep-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;align-items:start}
.rep-grid>*{min-width:0}
.rep-grid .chart-box,.rep-grid [style*="background:var(--card)"]{margin-bottom:0}
.rep-grid canvas{max-width:100%!important}
.rep-grid .tw{width:100%;overflow-x:auto}
.rep-grid .tw table{min-width:100%;white-space:nowrap}
.rep-grid-wide{grid-template-columns:1fr .7fr}
.rep-grid-wide .tw{width:100%;overflow-x:auto}
.rep-grid-wide .tw table{min-width:100%;white-space:nowrap}
@media(max-width:768px){.rep-grid,.rep-grid-wide{display:flex;flex-direction:column;gap:14px}.rep-grid .tw{width:100%;overflow-x:auto}.rep-grid .tw table{min-width:100%}}
.tw{overflow-x:auto;border:1px solid var(--bd);border-radius:var(--r);background:var(--card);margin-bottom:14px;width:100%}
@media(max-width:768px){.tw{width:100%!important}}

/* 日历响应式优化 */
@media(max-width:768px){
  .dp-days{gap:2px}
  .dp-day{padding:4px 0;font-size:.68rem}
  .dp-weekdays{gap:1px}
  .dp-wd{font-size:.62rem;padding:4px 0}
  .dp-months{grid-template-columns:repeat(3,1fr);gap:4px}
  .dp-month{padding:6px 0;font-size:.68rem}
  #invHist .dp-days,
  #expDetail .dp-days{
    grid-template-columns:repeat(7,1fr);
  }

  /* 日报日历响应式 */
  .daily-calendar{
    grid-template-columns:repeat(7,1fr) !important;
    gap:2px !important;
  }
  .daily-calendar-cell{
    padding:4px 2px !important;
    min-height:50px !important;
    font-size:.65rem !important;
  }
  .daily-calendar-cell div:first-child{
    font-size:.65rem !important;
  }
  .daily-calendar-cell div:nth-child(2){
    font-size:.6rem !important;
  }
  .daily-calendar-cell div:last-child{
    font-size:.55rem !important;
  }

  /* 库存日历响应式 */
  .inv-calendar{
    grid-template-columns:repeat(7,1fr) !important;
    gap:2px !important;
  }
  .inv-calendar-cell{
    padding:4px 2px !important;
    min-height:45px !important;
  }
  .inv-calendar-cell div:first-child{
    font-size:.65rem !important;
  }
  .inv-calendar-cell div:last-child{
    font-size:.6rem !important;
  }

  /* 费用日历响应式 */
  .exp-calendar{
    grid-template-columns:repeat(7,1fr) !important;
    gap:2px !important;
  }
  .exp-calendar-cell{
    padding:4px 2px !important;
    min-height:50px !important;
  }
  .exp-calendar-cell div:first-child{
    font-size:.65rem !important;
  }
  .exp-calendar-cell div:last-child{
    font-size:.6rem !important;
  }
}


/* ================================================================
   交互增强 · 微动画优化（2026-06-03新增）
   ================================================================ */

/* A. 卡片悬浮效果 */
.card {
  transition: all 0.2s ease;
}
.card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transform: translateY(-2px);
}

/* B. 按钮交互增强 */
.btn {
  transition: all 0.15s ease;
}
.btn:active {
  transform: scale(0.98);
}
.btn.p:hover {
  box-shadow: 0 2px 8px rgba(176,141,87,0.3);
}
.btn.g:hover {
  box-shadow: 0 2px 8px rgba(61,139,94,0.3);
}

/* C. 表格行高亮 */
tr {
  transition: background 0.2s ease;
}
tr:hover td {
  background: var(--card-h);
  box-shadow: inset 3px 0 0 var(--ac);
}

/* D. 模态框动画 */
.modal {
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.95);
  transition: all 0.25s ease;
}
.modal.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

/* E. 输入框交互增强 */
.inp {
  transition: all 0.2s ease;
}
.inp:focus {
  border-color: var(--ac);
  box-shadow: 0 0 0 3px rgba(176,141,87,0.1), 0 2px 6px rgba(0,0,0,0.05);
}
.inp:hover:not(:focus) {
  border-color: var(--tx-m);
}

/* F. 导航栏反馈 */
.toolbar-btn {
  transition: all 0.2s ease;
}
.toolbar-btn:hover {
  background: var(--card-h);
  transform: translateX(2px);
}
.toolbar-btn.active {
  background: rgba(176,141,87,0.1);
  border-right: 2px solid var(--ac);
}

/* G. 加载动画增强 */
@keyframes loadingPulse {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 1; }
}
#loadingBar {
  animation: loadingPulse 1.5s ease-in-out infinite;
}

/* H. 选项卡动画 */
.tab-btn {
  transition: all 0.2s ease;
}
.tab-btn:hover {
  color: var(--ac);
}
.tab-btn.active::after {
  animation: tabSlide 0.3s ease;
}
@keyframes tabSlide {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

/* ================================================================
   进阶交互优化 · 2026-06-03新增
   ================================================================ */

/* 1. 数据卡片计数动画 */
@keyframes countUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.card-v {
  animation: countUp 0.5s ease;
}

/* 2. 滚动进入动画 */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.page.active > * {
  animation: fadeInUp 0.4s ease forwards;
  opacity: 0;
}
.page.active > *:nth-child(1) { animation-delay: 0s; }
.page.active > *:nth-child(2) { animation-delay: 0.1s; }
.page.active > *:nth-child(3) { animation-delay: 0.2s; }
.page.active > *:nth-child(4) { animation-delay: 0.3s; }

/* 3. 选中效果增强 */
tr.selected td {
  background: rgba(176,141,87,0.08);
  box-shadow: inset 0 0 0 1px var(--ac);
}
.card.selected {
  border-color: var(--ac);
  box-shadow: 0 0 0 2px rgba(176,141,87,0.2);
}

/* 4. 加载骨架屏 */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.skeleton {
  background: linear-gradient(90deg, var(--card-h) 25%, var(--card) 50%, var(--card-h) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 4px;
}

/* 5. 深色模式支持 */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1a1a1a;
    --card: #2d2d2d;
    --card-h: #363636;
    --bd: #404040;
    --bd-l: #4a4a4a;
    --tx: #e0e0e0;
    --tx-s: #b0b0b0;
    --tx-m: #808080;
    --ac: #d4a574;
    --ac-h: #e0b88a;
  }
}

/* 6. 键盘快捷键提示 */
.btn {
  position: relative;
}
.btn[data-shortcut]::after {
  content: attr(data-shortcut);
  position: absolute;
  right: -35px;
  top: 50%;
  transform: translateY(-50%);
  background: var(--tx);
  color: var(--card);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.6rem;
  font-family: var(--fm);
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
  white-space: nowrap;
}
.btn[data-shortcut]:hover::after {
  opacity: 1;
}

/* 7. 图表交互动画 */
canvas {
  transition: filter 0.2s ease;
}
canvas:hover {
  filter: brightness(1.05) drop-shadow(0 2px 4px rgba(0,0,0,0.1));
}

/* 8. 空状态优化 */
.empty-state {
  text-align: center;
  padding: 40px 20px;
  color: var(--tx-m);
  font-size: 0.85rem;
}
.empty-state::before {
  content: '📭';
  font-size: 3rem;
  display: block;
  margin-bottom: 16px;
  opacity: 0.6;
}

/* 9. 成功/错误反馈动画 */
@keyframes successPop {
  0% { transform: scale(0.8); opacity: 0; }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); opacity: 1; }
}
@keyframes errorShake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}
.toast.success {
  animation: successPop 0.3s ease;
  border-left: 3px solid var(--gn);
}
.toast.error {
  animation: errorShake 0.3s ease;
  border-left: 3px solid var(--rd);
}

/* 10. 表单验证动画 */
.inp.error {
  border-color: var(--rd) !important;
  animation: errorShake 0.3s ease;
}
.inp.success {
  border-color: var(--gn) !important;
  box-shadow: 0 0 0 2px rgba(61,139,94,0.15);
}
.inp.validating {
  border-color: var(--og) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23d4a017' stroke-width='2'%3E%3Cpath d='M12 2v4M12 18v4M4.93 4.93l2.83 2.83M16.24 16.24l2.83 2.83M2 12h4M18 12h4M4.93 19.07l2.83-2.83M16.24 7.76l2.83-2.83'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  padding-right: 32px;
}

/* 11. 按钮禁用状态 */
.btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

/* 12. 滚动条美化 */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: var(--card-h);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb {
  background: var(--bd);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--tx-m);
}

/* 13. 选中文本颜色 */
::selection {
  background: rgba(176,141,87,0.3);
  color: var(--tx);
}

/* 14. 聚焦轮廓移除（无障碍保留） */
:focus:not(:focus-visible) {
  outline: none;
}
:focus-visible {
  outline: 2px solid var(--ac);
  outline-offset: 2px;
}

/* 15. 平滑滚动 */
html {
  scroll-behavior: smooth;
}

/* 弹窗动画 */
.modal-enter {
    animation: modalEnter 0.3s ease;
}

.modal-exit {
    animation: modalExit 0.2s ease;
}

@keyframes modalEnter {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

@keyframes modalExit {
    from {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
    to {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.95);
    }
}
