@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700;800&display=swap");:root{--font-sans:"Be Vietnam Pro",-apple-system,BlinkMacSystemFont,sans-serif;--bg-page:#f8f9fc;--bg-sidebar:#fff;--bg-card:#fff;--bg-subtle:#f1f3f9;--bg-field:#f8f9fc;--border-subtle:#e5e7eb;--border-strong:#d1d5db;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--text-inverse:#fff;--brand-pink:#ff37a5;--brand-pink-hover:#e62892;--brand-pink-subtle:rgba(255,55,165,.08);--brand-pink-border:rgba(255,55,165,.25);--status-success:#10b981;--status-success-bg:#ecfdf5;--status-danger:#ef4444;--status-danger-bg:#fef2f2;--status-warning:#f59e0b;--status-warning-bg:#fffbeb;--status-info:#3b82f6;--status-info-bg:#eff6ff;--shadow-sm:0 1px 3px 0 rgba(0,0,0,.04);--shadow-md:0 4px 12px -2px rgba(0,0,0,.08),0 2px 4px -1px rgba(0,0,0,.04);--shadow-lg:0 12px 28px -4px rgba(0,0,0,.12),0 4px 8px -2px rgba(0,0,0,.04);--radius-pill:9999px;--radius-card:16px;--radius-sm:8px}[data-theme=dark]{--bg-page:#0b0c10;--bg-sidebar:#13141b;--bg-card:#181922;--bg-subtle:#20222e;--bg-field:#1e1f2b;--border-subtle:#292b3a;--border-strong:#3d4054;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--text-inverse:#0b0c10;--brand-pink:#ff5cb8;--brand-pink-hover:#ff37a5;--brand-pink-subtle:rgba(255,92,184,.12);--brand-pink-border:rgba(255,92,184,.3);--status-success:#34d399;--status-success-bg:rgba(52,211,153,.12);--status-danger:#f87171;--status-danger-bg:hsla(0,91%,71%,.12);--status-warning:#fbbf24;--status-warning-bg:rgba(251,191,36,.12);--status-info:#60a5fa;--status-info-bg:rgba(96,165,250,.12);--shadow-sm:0 1px 3px 0 rgba(0,0,0,.5);--shadow-md:0 4px 12px -2px rgba(0,0,0,.6);--shadow-lg:0 12px 28px -4px rgba(0,0,0,.7)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-page);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased;transition:background-color .2s ease,color .2s ease}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;background-color:var(--brand-pink);color:#fff;font-weight:600;font-size:14px;border-radius:var(--radius-pill);padding:10px 22px;border:none;cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-sm);text-decoration:none;font-family:inherit}.btn-primary:hover:not(:disabled){background-color:var(--brand-pink-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;background-color:var(--bg-subtle);color:var(--text-primary);font-weight:600;font-size:14px;border-radius:var(--radius-pill);padding:10px 20px;border:1px solid var(--border-subtle);cursor:pointer;transition:all .2s ease;text-decoration:none;font-family:inherit}.btn-secondary:hover:not(:disabled){background-color:var(--border-subtle);color:var(--text-primary)}.btn-sm{padding:6px 14px;font-size:12px}.input-field{width:100%;max-width:100%;box-sizing:border-box;padding:10px 14px;border-radius:var(--radius-sm);border:1px solid var(--border-subtle);background-color:var(--bg-field);color:var(--text-primary);font-family:inherit;font-size:14px;outline:none;transition:border-color .15s,box-shadow .15s}textarea,textarea.input-field{box-sizing:border-box;max-width:100%;resize:vertical}.input-field:focus{border-color:var(--brand-pink);box-shadow:0 0 0 3px var(--brand-pink-subtle)}.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--radius-pill);font-size:12px;font-weight:600;letter-spacing:.02em}.badge-dev{background-color:var(--brand-pink-subtle);color:var(--brand-pink);border:1px solid var(--brand-pink-border)}.badge-viewer{background-color:var(--status-info-bg);color:var(--status-info);border:1px solid #bfdbfe}.badge-success{background-color:var(--status-success-bg);color:var(--status-success)}.badge-danger{background-color:var(--status-danger-bg);color:var(--status-danger)}.card{background-color:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-card);padding:24px;box-shadow:var(--shadow-sm);transition:border-color .2s ease,box-shadow .2s ease}.card:hover{box-shadow:var(--shadow-md)}.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.65);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:99999;padding:16px;animation:fadeIn .15s ease-out}.modal-content{background-color:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-card);padding:28px;max-width:520px;width:100%;box-shadow:var(--shadow-lg);position:relative;z-index:100000;animation:scaleUp .15s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{transform:scale(.96);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slideInRight{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes scanLineSweep{0%{top:5%;opacity:.2}50%{opacity:1}to{top:92%;opacity:.2}}@keyframes indeterminateProgress{0%{left:-40%;width:40%}50%{left:20%;width:60%}to{left:100%;width:40%}}.sidebar-link{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:var(--radius-sm);font-size:13px;font-weight:600;color:var(--text-secondary);text-decoration:none;cursor:pointer;border:none;background:transparent;width:100%;text-align:left;transition:all .15s ease}.sidebar-link:hover{background-color:var(--bg-subtle);color:var(--text-primary)}.sidebar-link.active{background-color:var(--brand-pink-subtle);color:var(--brand-pink);border-left:3px solid var(--brand-pink);border-radius:0 var(--radius-sm) var(--radius-sm) 0}