.app{display:grid;grid-template-columns:240px 1fr;grid-template-rows:56px 1fr;height:100vh;overflow:hidden}.sidebar{grid-row:1/3;background:var(--surface-raised);border-right:1px solid var(--rule);color:var(--ink);display:flex;flex-direction:column;padding:0 12px 12px}.brand{height:56px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--rule);margin:0 -12px 8px;padding:0 8px 0 20px}.brand .mark{width:24px;height:24px;border-radius:6px;background:var(--signal);display:grid;place-items:center;color:#fff;font:700 12px var(--display)}.brand b{font:600 15px/20px var(--display);color:var(--ink)}.brand span{font-size:11px;color:var(--ink-muted);display:block;line-height:14px}.nav-g{padding:12px 8px 4px;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint)}.nav a{display:flex;align-items:center;gap:10px;height:36px;padding:0 8px;border-radius:var(--r-ctl);color:var(--ink);text-decoration:none;font-weight:500}.nav a .cnt{margin-left:auto;background:var(--danger-soft);color:var(--danger-deep);border:1px solid rgba(220,38,38,.24);border-radius:999px;font-size:11px;font-weight:600;padding:0 7px;line-height:18px}.nav a .f2{margin-left:auto;font-size:10px;color:var(--ink-faint);border:1px solid var(--rule);border-radius:4px;padding:0 4px;line-height:14px}.nav a.on{background:var(--signal-wash);color:var(--signal)}.nav a svg{color:var(--ink-muted)}.nav a.on svg{color:var(--signal)}.sb-foot{margin-top:auto;padding-top:10px;font-size:12px;color:var(--ink-muted);align-items:center;gap:8px}.f0-strip,.sb-foot{border-top:1px solid var(--rule);display:flex}.f0-strip{margin-top:8px;padding-top:8px;flex-direction:column;gap:6px}.f0-strip a{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:var(--ink);text-decoration:none}.f0-strip a svg{color:var(--ink-muted)}.f0-tag{font-size:10.5px;color:var(--ink-faint);line-height:14px}.topbar{grid-column:2;height:56px;background:var(--surface-raised);border-bottom:1px solid var(--rule);color:var(--ink);display:flex;align-items:center;gap:12px;padding:0 24px}.client{padding:0 10px;border:1px solid var(--rule);font-weight:500}.client,.search{display:flex;align-items:center;gap:8px;height:36px;border-radius:var(--r-ctl)}.search{flex:1 1;max-width:520px;padding:0 12px;background:var(--surface-sunken);color:var(--ink-faint)}.search kbd{margin-left:auto;font:500 11px var(--mono);border:1px solid var(--rule);border-radius:4px;padding:1px 5px;color:var(--ink-muted);background:var(--surface-raised)}.period{height:36px;padding:0 10px;border:1px solid var(--rule);border-radius:var(--r-ctl)}.period,.tb-right{display:flex;align-items:center;gap:8px}.tb-right{margin-left:auto}.icon-btn{width:36px;height:36px;display:grid;place-items:center;border-radius:var(--r-ctl);color:var(--ink-muted);position:relative;border:0;background:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;cursor:pointer}.icon-btn .dot{position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:50%;background:var(--danger);border:1.5px solid var(--surface-raised)}.avatar{width:32px;height:32px;border-radius:50%;background:var(--surface-sunken);display:grid;place-items:center;font-weight:600;font-size:12px;color:var(--ink-muted)}.user-info{line-height:16px}.main{grid-column:2;flex-direction:column;min-width:0;background:var(--surface);color:var(--ink)}.content,.main{overflow:hidden;display:flex}.content{flex:1 1;padding:24px;flex-direction:column;gap:16px;min-height:0}.menu-btn{width:36px;height:36px;display:none;place-items:center;border-radius:var(--r-ctl);color:var(--ink);border:0;background:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;cursor:pointer;margin-right:8px}.sidebar-overlay{display:none;position:fixed;inset:0;background:var(--overlay-scrim);z-index:998}@media (max-width:768px){.app{grid-template-columns:1fr;grid-template-rows:56px 1fr}.topbar{grid-column:1;padding:0 16px}.menu-btn{display:grid}.sidebar{position:fixed;top:0;left:0;bottom:0;width:280px;max-width:85vw;z-index:999;transform:translateX(-100%);transition:transform .25s ease-out;box-shadow:none}.sidebar.open{transform:translateX(0);box-shadow:2px 0 12px var(--overlay-shadow)}.sidebar.open~.sidebar-overlay{display:block}.main{grid-column:1}.client,.period span{display:none}}@media (max-width:480px){.topbar{padding:0 12px;gap:8px}.tb-right{gap:4px}.user-info{display:none}.avatar{width:28px;height:28px;font-size:11px}}