/* 共享骨架：侧边栏 + 内容区（mockup 预览版） */
.mock-banner{position:fixed;z-index:99;right:16px;bottom:16px;background:var(--river-dark);color:rgba(255,255,255,.85);font-size:11px;letter-spacing:.12em;padding:7px 14px;border-radius:999px;box-shadow:var(--shadow)}
.app-shell{min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;z-index:20;display:flex;width:var(--sidebar);flex-direction:column;padding:28px 18px 22px;color:rgba(255,255,255,.72);background:var(--river-dark);overflow:hidden;transition:width .24s ease}
.sidebar::after{content:"";position:absolute;right:-80px;bottom:80px;width:210px;height:210px;border:1px solid rgba(255,255,255,.07);border-radius:47% 53% 62% 38%;transform:rotate(24deg);box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 58px rgba(255,255,255,.018);pointer-events:none}
.brand{position:relative;z-index:1;display:flex;align-items:center;gap:13px;padding:0 10px 34px;color:#fff}
.brand-mark{display:inline-grid;flex:0 0 auto;width:39px;height:39px;place-items:center;color:var(--river-dark);background:#dceae2;border-radius:12px 12px 12px 3px;font-family:var(--display);font-size:24px;font-weight:700;transform:rotate(-2deg)}
.brand strong{display:block;font-family:var(--display);font-size:22px;letter-spacing:.16em}
.brand small{display:block;margin-top:2px;color:rgba(255,255,255,.5);font-size:10px;letter-spacing:.18em}
.side-nav{position:relative;z-index:1;display:grid;gap:8px}
.side-nav a{display:flex;align-items:center;gap:13px;min-height:48px;padding:0 14px;border-radius:12px;font-size:14px;transition:.2s ease}
.side-nav a:hover{color:#fff;background:rgba(255,255,255,.06)}
.side-nav a.active{color:#fff;background:rgba(205,229,217,.15);box-shadow:inset 3px 0 #b7d2c1}
.nav-icon{display:grid;width:27px;height:27px;place-items:center;border:1px solid rgba(255,255,255,.16);border-radius:8px;font-family:var(--display);font-size:13px}
.side-nav a.active .nav-icon{color:var(--river-dark);background:#cde0d5;border-color:#cde0d5}
.side-subnav{display:grid;gap:2px;margin:-3px 0 8px 40px;padding-left:10px;border-left:1px solid rgba(255,255,255,.12)}
.side-subnav a{min-height:30px;padding:0 8px;border-radius:7px;color:rgba(255,255,255,.47);font-size:10px}
.side-subnav a:hover{color:#fff}
.side-subnav a.active{color:#d9e9e0;background:rgba(205,229,217,.1)}
.sidebar-foot{position:relative;z-index:1;margin-top:auto}
.operator{display:grid;grid-template-columns:37px 1fr auto;align-items:center;gap:10px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:13px;transition:.2s ease}
.operator:hover{background:rgba(255,255,255,.06)}
.avatar{display:inline-grid;flex:0 0 auto;width:37px;height:37px;place-items:center;color:var(--river-dark);background:#d9e7e0;border-radius:50%;font-family:var(--display);font-size:16px;font-weight:700}
.avatar.tint{background:var(--gold-soft);color:#8a6a34}
.operator small{color:rgba(255,255,255,.42);font-size:10px;display:block}
.operator strong{color:#fff;font-size:13px;margin-top:2px;display:block}
.content-shell{min-height:100vh;margin-left:var(--sidebar)}
.page-content{width:min(1480px,100%);margin:0 auto;padding:38px 42px 60px}
.page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 26px}
.page-header h1{margin:3px 0 5px;font-family:var(--display);font-size:clamp(30px,3vw,40px);line-height:1.2;letter-spacing:.035em;font-weight:700}
.muted{margin:0;color:var(--muted);font-size:13px;line-height:1.7}
.panel{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.panel-head h2{margin:0;font-family:var(--display);font-size:19px;letter-spacing:.03em;font-weight:700}
.soft-label{color:var(--muted);font-size:11px;background:var(--paper);border:1px solid var(--line);padding:4px 10px;border-radius:999px;white-space:nowrap}
.panel-head a{color:var(--river);font-size:12px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:var(--radius-sm);font-size:14px;font-weight:600;padding:12px 24px;transition:all 200ms ease}
.button.primary{color:#fff;background:var(--river)}
.button.primary:hover{background:var(--river-dark);transform:translateY(-1px)}
.button.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.button.ghost:hover{border-color:var(--river);color:var(--river)}
.button.danger{background:var(--danger);color:#fff}
.input{padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius-sm);font:inherit;font-size:14px;background:#fff;transition:border-color 200ms ease,box-shadow 200ms ease;width:100%}
.input:focus{outline:none;border-color:var(--river);box-shadow:0 0 0 3px rgba(36,87,90,.15)}