:root{--bg: #f4f6f8;--panel: #ffffff;--ink: #1d2733;--muted: #5e6b78;--line: #dde3e9;--accent: #0b6fb8;--accent-ink: #ffffff;--accent-soft: #e6f1fa;--danger: #b42318;--danger-soft: #fdecea;--warn: #8a5a00;--warn-soft: #fff4dc;--ok: #1e7d43;--ok-soft: #e5f5ea;--radius: 8px;font-family:Segoe UI,system-ui,sans-serif;font-size:14px;color:var(--ink);background:var(--bg)}*{box-sizing:border-box}body{margin:0}h1,h2,h3{margin:0 0 12px}h1{font-size:22px}h2{font-size:18px}h3{font-size:15px}p{margin:0 0 12px;line-height:1.45}button{font:inherit;cursor:pointer;border-radius:var(--radius);border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);padding:8px 14px}button:disabled{opacity:.55;cursor:default}.btn-secondary{background:var(--panel);color:var(--accent)}.btn-danger{background:var(--panel);color:var(--danger);border-color:var(--danger)}.btn-ghost{background:transparent;border-color:transparent;color:var(--muted);padding:4px 8px}.btn-link{background:none;border:none;color:var(--accent);padding:0;text-decoration:underline}input,select,textarea{font:inherit;width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--ink)}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}input[type=checkbox]{width:auto}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}.field-label{font-weight:600;font-size:13px}.field-hint{color:var(--muted);font-size:12px}.check{display:flex;gap:8px;align-items:center;margin-bottom:8px}.alert{padding:10px 12px;border-radius:var(--radius);margin-bottom:12px}.alert-error{background:var(--danger-soft);color:var(--danger)}.alert-info{background:var(--accent-soft);color:#0a4f82}.alert-warn{background:var(--warn-soft);color:var(--warn)}.alert-ok{background:var(--ok-soft);color:var(--ok)}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;margin-right:4px}.badge-neutral{background:#eef1f4;color:var(--muted)}.badge-ok{background:var(--ok-soft);color:var(--ok)}.badge-warn{background:var(--warn-soft);color:var(--warn)}.badge-off{background:#eceff2;color:#8a96a3}.center-screen{min-height:calc(100vh - 32px);display:flex;align-items:center;justify-content:center;padding:24px}.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:28px;width:100%;max-width:420px}.card-wide{max-width:560px}.muted{color:var(--muted)}.row{display:flex;gap:8px;align-items:center}.row-between{display:flex;justify-content:space-between;align-items:center;gap:8px}.stack>*+*{margin-top:8px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 16px}.pin-dots{display:flex;gap:12px;justify-content:center;margin:16px 0}.pin-dot{width:16px;height:16px;border-radius:50%;border:2px solid var(--accent)}.pin-dot.filled{background:var(--accent)}.pin-pad{display:grid;grid-template-columns:repeat(3,72px);gap:10px;justify-content:center}.pin-pad button{height:56px;font-size:20px;background:var(--panel);color:var(--ink);border-color:var(--line)}.user-pick{display:flex;flex-direction:column;gap:8px}.user-pick button{text-align:left;background:var(--panel);color:var(--ink);border-color:var(--line)}.shell{display:grid;grid-template-columns:220px 1fr;grid-template-rows:52px 1fr;height:calc(100vh - 32px)}.topbar{grid-column:1 / 3;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:var(--panel);border-bottom:1px solid var(--line)}.topbar-title{font-weight:700;font-size:16px}.sidebar{background:var(--panel);border-right:1px solid var(--line);padding:12px 8px;overflow-y:auto}.sidebar button{display:block;width:100%;text-align:left;background:transparent;color:var(--ink);border:none;padding:9px 12px;margin-bottom:2px}.sidebar button.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.content{overflow-y:auto;padding:24px}.dev-banner{background:var(--warn-soft);color:var(--warn);text-align:center;font-size:12px;padding:4px}.tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px}.tabs button{background:transparent;color:var(--muted);border:none;border-bottom:2px solid transparent;border-radius:0;padding:8px 12px}.tabs button.active{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:16px}table{width:100%;border-collapse:collapse;background:var(--panel)}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}th{font-size:12px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.02em}tr.inactive td{color:#8a96a3}.actions{display:flex;gap:6px;flex-wrap:wrap}.actions button{padding:4px 10px;font-size:13px}.dialog-backdrop{position:fixed;inset:0;background:#141e2859;display:flex;align-items:center;justify-content:center;padding:24px;z-index:10}.dialog{background:var(--panel);border-radius:12px;padding:20px;width:100%;max-width:560px;max-height:90vh;overflow-y:auto}.dialog-head{display:flex;justify-content:space-between;align-items:center}.coming{max-width:560px}code{background:#eef1f4;padding:1px 6px;border-radius:4px}.app-footer{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:#5e6b78;padding:8px}.field:has(:required:not(:disabled))>.field-label:after{content:" *";color:#b42318;font-weight:700}form:has(.field :required:not(:disabled)):before{content:"* = required";display:block;text-align:right;font-size:11px;color:#5e6b78;margin-bottom:4px}form.form-incomplete button[type=submit],form.form-incomplete button:not([type]){opacity:.5;pointer-events:none;cursor:default}form[data-missing]:after{content:attr(data-missing);display:block;color:#b42318;font-size:12px;margin-top:6px}form.touched :is(input,select,textarea):invalid{border-color:#b42318}.field[data-error]:after{content:attr(data-error);color:#b42318;font-size:12px}