/* LegalOS DanieleV31 — 全新架构样式表 */
:root {
  --bg1:#0D1117; --bg2:#161B22; --bg3:#1C2230;
  --line:#21262D; --t1:#E6EDF3; --t2:#C9D1D9;
  --t3:#8B949E; --t4:#484F58;
  --gold:#D4A843; --goldbg:rgba(212,168,67,.12);
  --blue:#2563EB; --blubg:rgba(37,99,235,.12);
  --green:#22C55E; --grnbg:rgba(34,197,94,.12);
  --red:#EF4444; --redbg:rgba(239,68,68,.12);
  --orange:#F59E0B;
  --safe:env(safe-area-inset-bottom,12px);
  --radius:10px;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
body{background:var(--bg1);color:var(--t1);font-family:-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;height:100dvh;display:flex;flex-direction:column;overflow:hidden;font-size:14px}

/* ── Layout ── */
#app{flex:1;display:flex;flex-direction:column;overflow:hidden}
#topbar{background:var(--bg2);border-bottom:1px solid var(--line);padding:10px 16px;display:flex;align-items:center;gap:10px;flex-shrink:0;min-height:54px}
#topbar .tb-logo{width:32px;height:32px;background:var(--gold);border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#000;flex-shrink:0}
#topbar .tb-info{flex:1;min-width:0}
#topbar .tb-title{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#topbar .tb-sub{font-size:10px;color:var(--t4)}
#topbar .tb-actions{display:flex;gap:8px;align-items:center}
#main{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
#bottomnav{background:var(--bg2);border-top:1px solid var(--line);display:flex;padding-bottom:calc(var(--safe) + 20px);flex-shrink:0}
#bottomnav .bn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:9px 4px 7px;gap:3px;color:var(--t3);font-size:10px;cursor:pointer;border:none;background:none;transition:color .2s}
#bottomnav .bn.on{color:var(--gold)}
#bottomnav .bn .bi{font-size:20px}

/* ── Pages ── */
.page{display:none;height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}
.page.active{display:block}

/* ── Login ── */
#login-page{position:fixed;inset:0;z-index:9999;background:var(--bg1);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px}
#login-page .lp-logo{width:72px;height:72px;background:var(--gold);border-radius:18px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:28px;color:#000;margin-bottom:24px}
#login-page h1{font-size:22px;font-weight:700;margin-bottom:4px}
#login-page p{font-size:13px;color:var(--t4);margin-bottom:32px;text-align:center}

/* ── Cards & Common ── */
.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.card+.card{margin-top:10px}
.sect{padding:14px 16px 0}
.sect-title{font-size:11px;color:var(--t4);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}

/* ── Buttons ── */
.btn{border:none;border-radius:8px;padding:10px 18px;font-size:13px;font-weight:600;cursor:pointer;transition:opacity .2s;display:inline-flex;align-items:center;gap:6px}
.btn:active{opacity:.75}
.btn-gold{background:var(--gold);color:#000}
.btn-blue{background:var(--blue);color:#fff}
.btn-out{background:transparent;color:var(--t2);border:1px solid var(--line)}
.btn-red{background:var(--red);color:#fff}
.btn-blk{display:block;width:100%;justify-content:center}
.btn-sm{padding:6px 12px;font-size:12px;border-radius:6px}

/* ── Form ── */
.fg{margin-bottom:14px}
.fg label{display:block;font-size:11px;color:var(--t4);margin-bottom:5px;font-weight:600}
.fc{width:100%;background:var(--bg3);border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--t1);font-size:14px;outline:none}
.fc:focus{border-color:var(--gold)}
textarea.fc{resize:vertical;min-height:80px}

/* ── Cases ── */
.case-card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin-bottom:10px;cursor:pointer;transition:border-color .2s}
.case-card:active{border-color:var(--gold)}
.cc-no{font-size:11px;color:var(--blue);font-weight:600;margin-bottom:4px}
.cc-name{font-size:15px;font-weight:700;margin-bottom:6px}
.cc-meta{font-size:11px;color:var(--t4);display:flex;gap:10px;flex-wrap:wrap}
.tag{display:inline-block;padding:2px 8px;border-radius:4px;font-size:10px;font-weight:600}
.tag-lit{background:var(--blubg);color:var(--blue)}
.tag-green{background:var(--grnbg);color:var(--green)}
.tag-red{background:var(--redbg);color:var(--red)}
.tag-gold{background:var(--goldbg);color:var(--gold)}

/* ── Detail Tabs ── */
.det-tabs{display:flex;overflow-x:auto;padding:0 16px;border-bottom:1px solid var(--line);-webkit-overflow-scrolling:touch}
.det-tabs::-webkit-scrollbar{display:none}
.dtb{padding:12px 14px;font-size:13px;color:var(--t3);cursor:pointer;white-space:nowrap;border-bottom:2px solid transparent;flex-shrink:0;transition:color .2s}
.dtb.on{color:var(--gold);border-bottom-color:var(--gold)}

/* ── Documents ── */
.doc-card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:10px}
.doc-head{display:flex;align-items:center;gap:10px;padding:12px}
.doc-icon{font-size:24px;width:36px;text-align:center;flex-shrink:0}
.doc-info{flex:1;min-width:0}
.doc-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc-meta{font-size:11px;color:var(--t4);margin-top:2px}
.doc-actions{display:flex;gap:6px}
.doc-preview{padding:0 12px 12px;font-size:11px;color:var(--t3);line-height:1.6;max-height:80px;overflow:hidden}

/* ── AI Analysis ── */
.ai-btn-row{display:flex;gap:8px;flex-wrap:wrap;padding:14px 16px}
.ai-status{margin:0 16px 12px;padding:10px 14px;border-radius:8px;font-size:12px;background:var(--blubg);border:1px solid rgba(37,99,235,.3);color:#60A5FA;display:none}
.ai-section{margin:0 16px 14px}
.ai-sec-title{font-size:11px;font-weight:700;color:#60A5FA;background:rgba(37,99,235,.15);padding:6px 10px;border-radius:6px;border-left:3px solid var(--blue);margin-bottom:8px}
.ai-sec-body{font-size:12px;color:var(--t2);line-height:1.8;white-space:pre-wrap}
.ai-qa-box{margin:0 16px 14px;background:var(--bg3);border:1px solid var(--line);border-radius:var(--radius);padding:12px}

/* ── Report Card ── */
.report-card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin-bottom:10px}
.rc-type{font-size:10px;color:var(--blue);font-weight:600;margin-bottom:4px}
.rc-summary{font-size:13px;margin-bottom:8px}
.rc-date{font-size:11px;color:var(--t4)}
.rc-actions{display:flex;gap:8px;margin-top:10px}

/* ── Modal / Sheet ── */
.overlay{position:fixed;inset:0;z-index:8000;background:rgba(0,0,0,.75);display:none;align-items:flex-end}
.overlay.show{display:flex}
.sheet{width:100%;background:var(--bg1);border-radius:20px 20px 0 0;max-height:92dvh;display:flex;flex-direction:column;padding-bottom:var(--safe)}
.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--line);flex-shrink:0}
.sheet-title{font-weight:700;font-size:15px}
.sheet-body{flex:1;overflow-y:auto;padding:16px}
.sheet-close{background:var(--bg3);border:none;color:var(--t2);border-radius:6px;padding:4px 10px;cursor:pointer;font-size:13px}

/* ── PDF Preview ── */
#pdf-overlay{position:fixed;inset:0;z-index:9500;background:rgba(0,0,0,.95);display:none;flex-direction:column}
#pdf-overlay.show{display:flex}
#pdf-topbar{background:var(--bg2);padding:10px 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);flex-shrink:0}
#pdf-frame{flex:1;border:none;width:100%;background:#fff}
#pdf-text-view{flex:1;overflow-y:auto;padding:16px;font-size:13px;line-height:1.8;color:var(--t2);white-space:pre-wrap}

/* ── Toast ── */
#toast{position:fixed;top:70px;left:50%;transform:translateX(-50%);z-index:9999;background:var(--bg3);color:var(--t1);padding:8px 18px;border-radius:20px;font-size:13px;pointer-events:none;opacity:0;transition:opacity .3s;white-space:nowrap}
#toast.show{opacity:1}

/* ── Stats grid ── */
.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 16px}
.stat-card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
.stat-val{font-size:24px;font-weight:800;font-family:monospace}
.stat-label{font-size:11px;color:var(--t4);margin-top:3px}

/* ── Upload ── */
.upload-zone{border:2px dashed var(--line);border-radius:var(--radius);padding:30px 16px;text-align:center;cursor:pointer;transition:border-color .2s}
.upload-zone:hover,.upload-zone.drag{border-color:var(--gold)}
.upload-item{display:flex;align-items:center;gap:10px;padding:10px;background:var(--bg3);border-radius:8px;margin-bottom:8px}
.up-name{flex:1;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.up-status{font-size:11px;color:var(--t4)}

/* ── Info grid ── */
.ig{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:12px}
.ig-c{background:var(--bg2);padding:10px 12px}
.ig-l{font-size:10px;color:var(--t4);margin-bottom:3px}
.ig-v{font-size:13px;font-weight:600}

/* ── Scrollbar ── */
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:2px}

/* ── Loading ── */
.spinner{width:20px;height:20px;border:2px solid var(--line);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-center{display:flex;justify-content:center;align-items:center;padding:40px;color:var(--t4);gap:10px}

/* ── Desktop hide bottom nav ── */
@media(min-width:768px){
  #bottomnav{display:none}
  body{flex-direction:row}
  #sidenav{width:200px;background:var(--bg2);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:16px 0}
  #sidenav .sn{padding:10px 20px;cursor:pointer;color:var(--t3);display:flex;align-items:center;gap:10px;font-size:13px;transition:color .2s}
  #sidenav .sn.on{color:var(--gold);background:var(--goldbg)}
  #app{flex:1}
}