:root{--bg: #f3f1ec;--panel: #ffffff;--line: #dfdac9;--ink: #23262b;--ink-soft: #6b6a63;--accent: #1f3b53;--accent-soft: #e4ebf0;--amber: #b5741f;--amber-soft: #f5e9d6;--green: #2f6f5e;--green-soft: #dce9e3;--red: #a83c34;--red-soft: #f4e0dd;--mono: "SFMono-Regular", "JetBrains Mono", "Menlo", "Consolas", monospace}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #16181c;--panel: #1e2126;--line: #33363d;--ink: #e8e6df;--ink-soft: #96958d;--accent: #7fa8c9;--accent-soft: #223341;--amber: #d9a15a;--amber-soft: #3a2f1c;--green: #7fbfa9;--green-soft: #1e3129;--red: #d98a82;--red-soft: #3a2320}}:root[data-theme=dark]{--bg: #16181c;--panel: #1e2126;--line: #33363d;--ink: #e8e6df;--ink-soft: #96958d;--accent: #7fa8c9;--accent-soft: #223341;--amber: #d9a15a;--amber-soft: #3a2f1c;--green: #7fbfa9;--green-soft: #1e3129;--red: #d98a82;--red-soft: #3a2320}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:-apple-system,PingFang SC,Noto Sans SC,Segoe UI,sans-serif;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}#app{min-height:100%}.wrap{max-width:980px;margin:0 auto;padding:28px 20px 60px}header{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:22px;border-bottom:1px solid var(--line);padding-bottom:18px}header h1{font-size:19px;font-weight:600;margin:0;letter-spacing:.01em}header .sub{font-size:13px;color:var(--ink-soft);margin-top:4px}.header-right{display:flex;align-items:center;gap:14px}.user-chip{font-size:13px;color:var(--ink-soft)}.user-chip b{color:var(--ink);font-weight:600}.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:16px;flex-wrap:wrap}.search{flex:1;min-width:180px;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);font-size:14px}.search:focus{outline:2px solid var(--accent);outline-offset:-1px}button{font-family:inherit;cursor:pointer}.btn{border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:9px 16px;border-radius:8px;font-size:13.5px;white-space:nowrap}.btn:hover{border-color:var(--accent)}.btn:disabled{opacity:.6;cursor:default}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-primary:hover{opacity:.9}.btn-primary.full{width:100%}.btn-ghost{border:none;background:transparent;padding:6px 8px;font-size:13px;color:var(--accent)}.btn-danger-ghost{border:none;background:transparent;padding:6px 8px;font-size:13px;color:var(--red)}table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:13.5px}thead th{text-align:left;font-weight:600;color:var(--ink-soft);font-size:12px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--bg)}tbody td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:middle}tbody tr:last-child td{border-bottom:none}tbody tr:hover{background:var(--accent-soft)}.mono{font-family:var(--mono);font-size:12.5px}.key-status{font-size:12px;color:var(--ink-soft)}.empty{text-align:center;padding:60px 20px;color:var(--ink-soft);font-size:14px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#14141473;display:none;align-items:flex-start;justify-content:center;padding:40px 16px;padding-top:calc(40px + env(safe-area-inset-top,0px));z-index:50;overflow-y:auto}.overlay.show{display:flex}.modal{background:var(--panel);border:1px solid var(--line);border-radius:12px;width:100%;max-width:460px;padding:24px}.modal h2{font-size:16px;margin:0 0 16px}.field{margin-bottom:14px}.field label{display:block;font-size:12.5px;color:var(--ink-soft);margin-bottom:6px}.field input,.field select{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--ink);font-size:14px;font-family:inherit}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.keybox{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin-bottom:10px}.keybox .label-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.keybox .label-row span:first-child{font-size:12px;color:var(--ink-soft);font-weight:600}.keybox textarea{width:100%;height:92px;resize:vertical;font-family:var(--mono);font-size:11px;background:transparent;border:none;color:var(--ink);padding:0}.keybox textarea:focus{outline:none}.warn{font-size:12px;color:var(--amber);background:var(--amber-soft);border-radius:7px;padding:9px 11px;margin-bottom:14px;line-height:1.5}.toast{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%) translateY(10px);background:var(--ink);color:var(--bg);padding:9px 18px;border-radius:999px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:100}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}@media (max-width: 640px){table,thead,tbody,tr,td,th{display:block}thead{display:none}tbody tr{border-bottom:1px solid var(--line);padding:12px 14px}tbody td{border:none;padding:4px 0}tbody td[data-label]:before{content:attr(data-label);display:inline-block;width:78px;color:var(--ink-soft);font-size:12px}}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.login-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;width:100%;max-width:380px;padding:32px 28px;text-align:center}.login-card .brand-mark{width:44px;height:44px;margin:0 auto 14px;border-radius:10px;background:var(--accent);color:#fff;font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center}.login-card .brand-name{font-size:13.5px;color:var(--ink-soft);margin-bottom:24px}.login-card h2{font-size:17px;margin:0 0 6px;text-align:left}.login-sub{font-size:12.5px;color:var(--ink-soft);margin:0 0 18px;text-align:left;line-height:1.6}.login-card form{text-align:left}.text-input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font-size:14px;font-family:inherit;margin-bottom:14px}.login-card label{display:block;font-size:12.5px;color:var(--ink-soft);margin-bottom:6px}.code-row{display:flex;gap:8px;margin-bottom:18px}.code-box{flex:1;min-width:0;height:46px;text-align:center;font-size:20px;font-family:var(--mono);border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink)}.code-box:focus{outline:2px solid var(--accent);outline-offset:-1px}.link-btn{display:block;width:100%;text-align:center;border:none;background:transparent;color:var(--ink-soft);font-size:12.5px;padding:10px 0 0}.link-btn:hover{color:var(--accent)}.demo-hint{font-size:12px;color:var(--ink-soft);background:var(--bg);border-radius:7px;padding:9px 11px;margin-top:16px;line-height:1.6;text-align:left}.demo-hint b{color:var(--ink)}