:root{font-family:HarmonyOS Sans,Source Han Sans SC,PingFang SC,Microsoft YaHei,sans-serif;color:#0f172a;--primary: #0f766e;--primary-dark: #115e59;--theme-color: #0f766e;--danger: #dc2626;--card: #ffffff;--muted: #64748b;--page-bg: #eef2f7;--page-bg-image: none;--page-bg-size: auto;--topbar-bg: #ffffff;--topbar-bg-image: none;--topbar-bg-size: auto;--topbar-text: #0f172a;--topbar-muted: #64748b;--topbar-border: #e2e8f0;--topbar-link-border: #e2e8f0;--topbar-link-hover: var(--theme-color);--topbar-input-bg: #f8fafc;--topbar-input-border: #e2e8f0;background:var(--page-bg)}*{box-sizing:border-box}body{margin:0;background:var(--page-bg);background-image:var(--page-bg-image);background-size:var(--page-bg-size);background-position:center}.container{max-width:1200px;margin:0 auto;padding:28px}.layout{display:flex;min-height:100vh}.sidebar{width:220px;background:#0f172a;color:#e2e8f0;display:flex;flex-direction:column;gap:12px;padding:16px 12px;position:sticky;top:0;height:100vh;border-right:1px solid rgba(148,163,184,.18);z-index:30}.sidebar-head{background:linear-gradient(135deg,#0f172ae6,#0f766e33);padding:8px 8px 10px;border-radius:10px}.sidebar.collapsed{width:72px}.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.sidebar .brand{color:#fff;font-weight:700;letter-spacing:.5px}.sidebar .muted{margin-left:0}.sidebar .btn.ghost{color:#e2e8f0;border-color:#94a3b859}.sidebar .btn.ghost:hover{background:#94a3b826}.sidebar-nav{display:flex;flex-direction:column;gap:6px}.sidebar-link{display:flex;align-items:center;gap:10px;color:#e2e8f0;text-decoration:none;padding:8px 10px;border-radius:8px;transition:background .2s ease,color .2s ease;position:relative}.sidebar-link:hover{background:#94a3b826;color:#fff}.sidebar-link.router-link-active{background:#0f766e59;color:#fff}.nav-icon{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(148,163,184,.35);background:#94a3b814;color:#fff;font-size:12px}.sidebar-footer{margin-top:auto;display:flex;flex-direction:column;gap:6px;align-items:stretch}.sidebar-footer .muted{font-size:12px}.sidebar-toggle{width:100%;padding:8px 10px;font-size:12px;letter-spacing:1px;text-align:center;color:#e2e8f0;background:#94a3b81f;border:1px solid rgba(148,163,184,.35);cursor:pointer}.sidebar-toggle:hover{background:#94a3b833}.sidebar.collapsed .sidebar-toggle{font-size:11px}.sidebar-user{display:flex;flex-direction:column;gap:8px}.sidebar.collapsed .nav-text,.sidebar.collapsed .sidebar-user .muted{display:none}.sidebar.collapsed .sidebar-link{justify-content:center}.sidebar.collapsed .sidebar-link:after{content:attr(data-tip);position:absolute;left:110%;top:50%;transform:translateY(-50%);background:#0f172a;color:#e2e8f0;padding:4px 8px;border:1px solid rgba(148,163,184,.35);font-size:12px;opacity:0;pointer-events:none;white-space:nowrap;z-index:60}.sidebar.collapsed .sidebar-link:hover:after{opacity:1}.main{flex:1;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;background:var(--topbar-bg);background-image:var(--topbar-bg-image);background-size:var(--topbar-bg-size);background-position:center;border-bottom:1px solid var(--topbar-border);color:var(--topbar-text);box-shadow:0 4px 8px #0f172a0f;position:sticky;top:0;z-index:20}.topbar-left{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.page-meta{display:flex;flex-direction:column;gap:2px}.page-title{font-weight:700;color:var(--topbar-text)}.breadcrumb{font-size:12px;color:var(--topbar-muted)}.topbar-center{flex:1;display:flex;justify-content:center}.search-box{display:flex;align-items:center;gap:8px;background:var(--topbar-input-bg);border:1px solid var(--topbar-input-border);padding:6px;border-radius:999px}.search-box:focus-within{border-color:var(--topbar-input-border)}.search-box .input{margin-top:0;border:none;background:transparent;color:var(--topbar-text)}.search-box .input::placeholder{color:var(--topbar-muted)}.search-select{width:90px;color:var(--topbar-text);border:none;background-color:transparent;padding-right:32px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:repeating-linear-gradient(to bottom,var(--topbar-border),var(--topbar-border) 2px,transparent 2px,transparent 4px),linear-gradient(45deg,transparent 50%,var(--topbar-text) 50%),linear-gradient(135deg,var(--topbar-text) 50%,transparent 50%);background-position:right 20px center,right 10px center,right 6px center;background-size:1px 14px,6px 6px,6px 6px;background-repeat:no-repeat}.search-select:focus{outline:none}.search-input{min-width:220px}.search-btn{padding:6px 12px;white-space:nowrap}.logo{display:flex;align-items:center;gap:12px}.logo-mark{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f172a,#0f766e);color:#fff;font-weight:700;border-radius:6px;letter-spacing:.5px}.logo-text{display:flex;flex-direction:column;gap:2px}.logo-title{font-weight:700;color:var(--topbar-text)}.logo-sub{font-size:12px;color:var(--topbar-muted)}.topbar-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.topbar-right .muted{color:var(--topbar-muted)}.icon-button{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:6px;border:none;background:transparent;color:var(--topbar-text);cursor:pointer}.icon-button:hover{background:#94a3b82e}.icon-button[data-tip]:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%) translateY(0);background:#0f172a;color:#fff;font-size:12px;padding:4px 8px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:60}.icon-button[data-tip]:hover:after{opacity:1;transform:translate(-50%) translateY(-2px)}.icon-bell{width:20px;height:20px}.appearance-toggle{border:1px solid var(--topbar-link-border);border-radius:8px;width:34px;height:34px}.appearance-toggle.active{color:var(--topbar-link-hover);background:#94a3b82e}.icon-split,.icon-gear{width:18px;height:18px}.icon-button .badge{position:absolute;top:2px;right:2px;transform:translate(40%,-40%);margin-left:0}.topbar .btn.ghost{color:var(--topbar-text);border-color:var(--topbar-link-border)}.topbar .user-actions .btn.ghost{border:none;background:transparent}.topbar .btn.ghost:hover{background:#94a3b82e}.user-actions{display:flex;align-items:center;gap:10px}.dropdown{position:relative}.dropdown-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:160px;background:#fff;border:1px solid #e2e8f0;box-shadow:0 12px 24px #0f172a1f;padding:8px;z-index:40}.appearance-menu{min-width:260px}.dropdown-section{padding:6px 0}.dropdown-label{font-size:12px;color:var(--muted);padding:0 8px 6px}.pill-group{display:flex;flex-wrap:wrap;gap:6px;padding:0 8px 6px}.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid #e2e8f0;background:#fff;padding:4px 8px;font-size:12px;cursor:pointer}.pill.active{border-color:var(--theme-color);color:var(--theme-color)}.pill-dot{width:10px;height:10px;border-radius:2px;border:1px solid rgba(15,23,42,.1)}.appearance-actions{display:flex;justify-content:flex-end;gap:8px;padding:8px 8px 2px;border-top:1px dashed #e2e8f0}.appearance-actions .btn{padding:6px 12px}.appearance-actions .btn:disabled{opacity:.6;cursor:not-allowed}.settings-menu{min-width:260px}.form-field{display:flex;flex-direction:column;gap:6px;padding:6px 8px;font-size:12px;color:var(--muted)}.form-field .input{margin-top:0}.settings-actions{display:flex;justify-content:flex-end;gap:8px;padding:8px;border-top:1px dashed #e2e8f0}.settings-actions .btn{padding:6px 12px}.dropdown-item{width:100%;text-align:left;background:transparent;border:none;padding:8px 10px;cursor:pointer;font-size:13px;color:#0f172a}.dropdown-item:hover{background:#f1f5f9}.dropdown-empty{font-size:12px;color:var(--muted);padding:6px 8px}.notice-menu{min-width:220px}.notice-item{padding:6px 8px;border-bottom:1px dashed #e2e8f0}.notice-item:last-child{border-bottom:none}.notice-text{font-size:13px;color:#0f172a}.badge{margin-left:6px;background:var(--danger);color:#fff;font-size:11px;padding:2px 6px;border-radius:12px}.topbar-link{color:var(--topbar-text);text-decoration:none;font-size:14px;padding:6px 10px;border:1px solid var(--topbar-link-border);border-radius:6px}.topbar-link:hover{border-color:var(--topbar-link-border);color:var(--topbar-link-hover)}.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 28px;background:linear-gradient(135deg,#0f172a,#0f766e);color:#fff;position:sticky;top:0;z-index:10}.brand{font-weight:700;letter-spacing:1px}.nav-links{display:flex;gap:14px;flex-wrap:wrap}.nav a{color:#fff;text-decoration:none;font-size:14px}.card{background:var(--card);border-radius:14px;padding:20px;box-shadow:0 10px 30px #0f172a14;animation:fadeUp .4s ease;transition:transform .2s ease,box-shadow .2s ease}.card:hover{transform:translateY(-2px);box-shadow:0 16px 32px #0f172a1f}.btn{display:inline-flex;align-items:center;gap:6px;background:var(--primary);color:#fff;padding:8px 16px;border-radius:8px;border:none;cursor:pointer}.btn:hover{background:var(--primary-dark)}.btn.ghost{background:transparent;color:var(--primary);border:1px solid rgba(15,118,110,.4)}.btn.danger{background:var(--danger)}.input{width:100%;padding:8px 10px;margin-top:6px;border:1px solid #e2e8f0;border-radius:8px;background:#f8fafc}.input.error{border-color:#dc2626b3;background:#fee2e240}.hint{margin-top:8px;color:var(--muted)}.error-text{margin-top:6px;font-size:12px;color:var(--danger)}.muted{color:var(--muted);margin-left:8px;font-size:13px}.actions{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}.upload-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px}.thumb-preview{margin-top:8px;display:flex;align-items:center;gap:10px}.thumb-preview img{width:90px;height:90px;object-fit:cover;border:1px solid #e2e8f0;background:#f8fafc}.pagination-row{margin-top:12px;align-items:center;gap:8px}.pagination-row .btn{padding:6px 12px;font-size:13px}.pagination-row .input{padding:6px 8px;height:30px}.pagination-row .muted{font-size:12px}.toast{position:fixed;top:16px;left:50%;z-index:60;background:var(--primary);color:#fff;padding:10px 14px;border-radius:0;box-shadow:0 12px 24px #0f172a2e;font-size:13px;opacity:0;transform:translate(-50%,-8px);transition:opacity .2s ease,transform .2s ease;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%)}.toast-success{background:var(--primary)}.toast-error{background:var(--danger)}@media (max-width: 640px){.pagination-row{gap:6px}.pagination-row .btn{padding:6px 10px}.toast{left:16px;right:16px;text-align:center;transform:translateY(-8px)}.topbar{padding:12px 16px;flex-direction:column;align-items:flex-start}.topbar-center{width:100%;justify-content:flex-start}.logo-sub{display:none}.search-input{min-width:140px}.search-box{width:100%}.topbar-right{width:100%;justify-content:space-between}}.list-item{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px dashed #e2e8f0}.order-item{padding:12px 0;border-bottom:1px dashed #e2e8f0}.order-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;z-index:30;opacity:1;transition:opacity .3s ease}.modal-mask.fade-out{opacity:0;pointer-events:none}.confirm-mask{animation:confirmFadeIn 3s ease}.confirm-card{width:min(360px,100%);border-radius:0;background-color:#f8fafc;background-image:radial-gradient(rgba(148,163,184,.25) 1px,transparent 1px);background-size:14px 14px;border:1px solid #e2e8f0;box-shadow:0 16px 40px #0f172a2e;animation:confirmFadeIn 3s ease}@keyframes confirmFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.modal-card{width:min(900px,100%);max-height:calc(100vh - 80px);overflow:auto;background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;padding:16px;box-shadow:0 20px 50px #0f172a33}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}.modal-title{font-weight:700;color:#0f172a}.detail-title{margin-top:10px;font-weight:600;color:#0f172a}.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:6px 12px;font-size:13px}.detail-list{display:flex;flex-direction:column;gap:6px}.detail-item{padding:6px 0;border-bottom:1px dashed #e2e8f0}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}