:root{--ink:#18212f;--muted:#718096;--line:#e8ebf0;--accent:#6956e8;--bg:#f6f7fb;--good:#158454;--bad:#b83228;--soft:#eef1f8}*{box-sizing:border-box}body{margin:0;font:14px Inter,system-ui,"Noto Sans CJK SC",sans-serif;color:var(--ink);background:var(--bg)}a{color:var(--accent);text-decoration:none}aside{position:fixed;width:235px;inset:0 auto 0 0;background:#171a28;color:#fff;padding:28px 20px}.brand{font-size:21px;font-weight:800}.brand span{color:#8b7cff}.brand.big{font-size:28px;color:var(--ink)}.company{margin:30px 0;padding:14px;background:#222638;border-radius:10px}.company small{display:block;color:#aeb4c4;margin-top:5px}nav a{display:block;color:#c9cede;padding:12px;border-radius:8px;margin:3px 0}nav a:hover{background:#292d41;color:#fff}main{margin-left:235px;min-height:100vh}header{height:64px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:flex-end;gap:18px;padding:0 32px}header form{margin:0}section{padding:32px;max-width:1400px;margin:auto}.auth{margin:0;display:grid;place-items:center}.auth section{width:100%;max-width:500px}.authbox{background:#fff;padding:36px;border-radius:16px;box-shadow:0 15px 45px #19203a17}.pagehead{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.pagehead h1{margin:0}.pagehead p{color:var(--muted)}.primary{display:inline-block;background:var(--accent);color:#fff;border:0;border-radius:8px;padding:11px 17px;cursor:pointer}.secondary{display:inline-block;background:#fff;border:1px solid var(--line);border-radius:8px;padding:11px 17px;color:var(--ink)}.wide{width:100%}.link{border:0;background:none;color:var(--accent);cursor:pointer}.cards,.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:18px}.grid{grid-template-columns:2fr 1fr}.cards article,.panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px}.cards small{color:var(--muted);display:block}.cards strong{font-size:24px;display:block;margin-top:10px}.panel{margin-bottom:18px;overflow:auto}.panel h2{font-size:16px;margin-top:0}.row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:13px;border-bottom:1px solid var(--line)}th{color:var(--muted);font-size:12px;text-transform:uppercase}.input,input,textarea,select{width:100%;padding:10px;border:1px solid #d6dae2;border-radius:7px;background:#fff}.formpanel{max-width:760px}.formpanel label{display:block;font-weight:600;margin-bottom:5px}.formpanel p{margin:0 0 16px}.badge{font-size:12px;padding:4px 9px;border-radius:20px;background:#eee}.badge.paid{background:#dff7eb;color:var(--good)}.badge.overdue,.badge.void{background:#fee4e2;color:var(--bad)}.badge.sent,.badge.partial{background:#e7efff;color:#305fbb}.invoice-meta{display:flex;justify-content:space-between}.totals{margin:20px 0 0 auto;width:330px;text-align:right}.bars{height:230px;display:flex;align-items:flex-end;gap:18px}.bars div{height:100%;display:flex;flex-direction:column;justify-content:flex-end;text-align:center;min-width:38px}.bars i{display:block;background:var(--accent);border-radius:5px 5px 0 0;min-height:2px}.bars b{font-size:9px;color:var(--muted)}.update-shell{padding:0;overflow:hidden}.update-summary{padding:26px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fff 0%,#fafbff 100%)}.update-hero strong{display:block;font-size:22px;margin-bottom:8px}.update-hero p{margin:0;color:var(--muted)}.update-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}.update-card{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:16px}.update-card small{display:block;color:var(--muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em;font-size:11px}.update-card b{font-size:14px}.loggrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:22px}.logbox{background:#0f172a;border:1px solid #1f2a44;border-radius:12px;overflow:hidden}.logbox.error{background:#fff5f5;border-color:#ffd0d0}.loghead{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.08)}.logbox.error .loghead{background:#fff0f0;border-bottom-color:#ffd0d0}.loghead strong{font-size:13px}.loghead span{font-size:12px;color:var(--muted)}.logbox pre{margin:0;padding:16px;white-space:pre-wrap;word-break:break-word;max-height:380px;overflow:auto;font:13px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;color:#e2e8f0}.logbox.error pre{color:#b83228;background:#fff}.hintgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:0 22px 22px}.hintbox{background:#f7f8ff;border:1px solid #d7dcff;border-radius:12px;padding:16px}.hintbox strong{display:block;margin-bottom:6px}.hintbox p{margin:0;color:var(--muted)}.mockup-layout{display:grid;grid-template-columns:1.35fr .95fr;gap:20px;align-items:start}.mock-banner{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;background:linear-gradient(135deg,#f8f7ff 0%,#ffffff 55%,#f4f7ff 100%)}.mock-banner h2{margin:6px 0 8px;font-size:24px}.mock-banner p{margin:0;color:var(--muted);max-width:62ch}.mock-actions{display:flex;flex-direction:column;gap:10px;min-width:190px}.mock-kpis{margin-top:18px}.mock-list{display:grid;gap:12px}.mock-list-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}.mock-list-item:last-child{border-bottom:0;padding-bottom:0}.mock-list-item strong{display:block;font-size:15px}.mock-list-item span{color:var(--muted);font-size:13px}.mock-right{position:sticky;top:18px}.mock-phone{padding:14px;border-radius:22px;background:#101525;color:#fff;box-shadow:0 20px 50px rgba(16,21,37,.18)}.mock-phone-head{display:flex;gap:7px;margin-bottom:14px}.mock-phone-head .dot{width:9px;height:9px;border-radius:999px;background:rgba(255,255,255,.24)}.mock-phone-body{display:grid;gap:12px}.mock-phone-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:14px}.mock-phone-card.accent{background:linear-gradient(135deg,#6f5df3,#8b7cff)}.mock-phone-card small{display:block;color:rgba(255,255,255,.72);margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em;font-size:11px}.mock-phone-card strong{display:block;font-size:20px;margin-bottom:6px}.mock-phone-card p{margin:0;color:rgba(255,255,255,.8);line-height:1.5}.mock-phone-card.accent p,.mock-phone-card.accent small{color:rgba(255,255,255,.88)}@media(max-width:800px){aside{position:static;width:auto}nav{display:flex;overflow:auto}nav a{white-space:nowrap}main{margin:0}.cards,.grid,.update-grid,.loggrid,.hintgrid,.mockup-layout{grid-template-columns:1fr}section{padding:18px}header{padding:0 18px}.pagehead{align-items:flex-start;gap:12px}.mock-right{position:static}}
