:root{--primary-blue: #3D7DCA;--primary-blue-dark: #2B5FA0;--primary-blue-light: #E8F0F9;--bg: #F8F9FC;--card: #FFFFFF;--text-primary: #1A1F36;--text-secondary: #697386;--border: #999999;--success: #0A7D4A;--error: #C5281C;--warning: #B45309}body.dark-mode{--bg: #252525;--card: #252525;--text-primary: #e0e0e0;--text-secondary: #aaa;--border: #555}*{box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}body{margin:0;background:var(--bg);color:var(--text-primary);line-height:1.6;transition:background-color .2s,color .2s}.app-container{max-width:900px;margin:0 auto;padding:24px}.header{background:var(--card);padding:32px;border-radius:8px;box-shadow:0 2px 8px #1a1f3614;margin-bottom:32px;border:1.5px solid #d0d0d0;border-left:3px solid var(--primary-blue)}body.dark-mode .header{border:1px solid #888888;border-left:3px solid var(--primary-blue)}.header h1{margin:0 0 8px;font-size:32px;font-weight:600;color:var(--text-primary)}.subtitle{color:var(--text-secondary);font-size:15px;margin:0}.card{background:var(--card);padding:32px;border-radius:8px;box-shadow:0 2px 8px #1a1f3614;margin-bottom:24px;border:1.5px solid #d0d0d0;border-left:3px solid var(--primary-blue)}body.dark-mode .card{border-top:1px solid #888888;border-right:1px solid #888888;border-bottom:1px solid #888888;border-left:4px solid var(--primary-blue)}.card h2,.card h3{margin-top:0;color:var(--text-primary);font-weight:600}.card h2{font-size:24px;margin-bottom:16px}.card h3{font-size:20px;margin-bottom:12px}.card.small{max-width:640px}.onboarding{max-width:640px;margin:48px auto}.onboarding ol{padding-left:24px;margin:20px 0}.onboarding li{margin-bottom:12px;color:var(--text-secondary)}.actions{display:flex;gap:12px;margin-top:24px}.row{display:flex;gap:12px;align-items:center;margin-top:12px}.btn-primary{background:var(--primary-blue);color:#fff;padding:6px 12px;border-radius:4px;border:none;cursor:pointer;font-weight:600;font-size:14px;transition:background .2s}.btn-primary:hover{background:var(--primary-blue-dark)}.btn-primary:disabled{background:var(--border);cursor:not-allowed}.btn-ghost{background:transparent;border:1.5px solid var(--border);padding:11px 20px;border-radius:6px;cursor:pointer;font-weight:500;font-size:15px;color:var(--text-secondary);transition:all .2s}.btn-ghost:hover{border-color:var(--primary-blue);color:var(--primary-blue)}.btn-ghost:disabled{opacity:.5;cursor:not-allowed}.muted{color:var(--text-secondary);font-size:14px}.small{font-size:13px}input,select,textarea{background:#fff;color:#1a1a1a;border:1px solid #d1d5db}input::placeholder,textarea::placeholder{color:#999}body.dark-mode input,body.dark-mode select,body.dark-mode textarea{background:#252525;color:#e0e0e0;border:.75px solid #555}body.dark-mode input::placeholder,body.dark-mode textarea::placeholder{color:#aaa}body.dark-mode option{background:#252525;color:#e0e0e0}body.dark-mode table{color:#e0e0e0}body.dark-mode table thead{background:#252525;border:.75px solid #555}body.dark-mode table tbody tr{border:.75px solid #555}.resources-list{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:12px}.resource{padding:20px;border-radius:6px;background:var(--primary-blue-light);border:1px solid rgba(61,125,202,.2);transition:all .2s}.resource:hover{box-shadow:0 4px 12px #3d7dca26;transform:translateY(-2px)}.resource strong{display:block;font-size:16px;margin-bottom:6px;color:var(--text-primary)}.center{min-height:60vh;display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--text-secondary)}label{display:block;margin-top:20px;margin-bottom:8px;font-weight:600;font-size:14px;color:var(--text-primary)}select,input[type=text],input:not([type=checkbox]){width:100%;padding:12px 16px;border-radius:6px;border:1.5px solid var(--border);font-size:15px;transition:border-color .2s;background:var(--card)}select:focus,input:focus{outline:none;border-color:var(--primary-blue)}input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:var(--primary-blue)}.tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:2px solid var(--border);margin-bottom:32px}.tab{background:transparent;border:none;padding:10px 14px;cursor:pointer;font-weight:500;font-size:13px;color:var(--text-secondary);border-bottom:3px solid transparent;border-radius:6px 6px 0 0;margin-bottom:-2px;transition:all .2s}.tab:hover{color:var(--primary-blue);background:#3d7dca14}.tab.active{color:#fff;background:var(--primary-blue);border-bottom-color:var(--primary-blue);font-weight:600}
