*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:400 var(--fs-base)/1.55 var(--font)}
h1,h2,h3{margin:0 0 var(--space-3);line-height:1.25;font-weight:600}
h1{font-size:var(--fs-xl)} h2{font-size:var(--fs-lg)} h3{font-size:var(--fs-base)}
p{margin:0 0 var(--space-3)} a{color:var(--accent)} .muted{color:var(--muted)} .small{font-size:var(--fs-sm)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* controls */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:38px;padding:0 var(--space-4);
  font:500 var(--fs-base) var(--font);border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);color:var(--text);cursor:pointer;text-decoration:none}
.btn:hover{background:var(--bg)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}
.btn-danger{color:var(--danger);border-color:#e9b8b3}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--space-4)}
.field label{font-size:var(--fs-sm);font-weight:500}
.input,.select,.textarea{width:100%;min-height:40px;padding:8px 12px;font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius)}
.input:focus,.select:focus,.textarea:focus{border-color:var(--accent);outline:2px solid var(--accent-soft)}

/* surfaces */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-5)}
.grid{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.alert{padding:var(--space-3) var(--space-4);border-radius:var(--radius);font-size:var(--fs-sm);border:1px solid}
.alert-error{background:var(--danger-soft);border-color:#f1c0bb;color:var(--danger)}
.alert-ok{background:var(--ok-soft);border-color:#bfe3cf;color:var(--ok)}
.alert-info{background:var(--accent-soft);border-color:#cdd6f6;color:var(--accent)}
.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:var(--fs-sm);background:var(--bg);border:1px solid var(--border);color:var(--muted)}
.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse;font-size:var(--fs-base)}
.table th,.table td{padding:10px var(--space-3);text-align:left;border-bottom:1px solid var(--border)}
.table th{font-size:var(--fs-sm);font-weight:600;color:var(--muted)}
.empty{padding:var(--space-6);text-align:center;color:var(--muted)}
.spinner{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.modal-backdrop{position:fixed;inset:0;background:rgba(20,24,33,.45);display:grid;place-items:center;padding:var(--space-4);z-index:50}
.modal{background:var(--surface);border-radius:var(--radius);padding:var(--space-5);width:min(480px,100%);border:1px solid var(--border)}

/* Phase 3 additions */
.toolbar{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}
.toolbar .group{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}
.toolbar .select,.toolbar .input{width:auto;min-width:150px}
.stat{padding:var(--space-4) var(--space-5)}
.stat .n{font-size:var(--fs-xl);font-weight:600;line-height:1.2}
.row-actions{display:flex;flex-wrap:wrap;gap:6px}
.row-actions .btn{min-height:30px;padding:0 10px;font-size:var(--fs-sm)}
.badge-ok{background:var(--ok-soft);border-color:#bfe3cf;color:var(--ok)}
.badge-off{background:var(--danger-soft);border-color:#f1c0bb;color:var(--danger)}
.modal-actions{display:flex;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-4)}
.modal{max-height:92vh;overflow-y:auto}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}
.checks{display:flex;flex-wrap:wrap;gap:6px 16px}.check{display:flex;gap:6px;align-items:center;font-size:var(--fs-base)}
.stack>*+*{margin-top:var(--space-4)}
@media (max-width:520px){.form-row{grid-template-columns:1fr}}

/* Phase 6 additions */
.q-row{display:flex;justify-content:space-between;gap:var(--space-4);align-items:flex-start;padding:var(--space-4) 0;border-bottom:1px solid var(--border)}
.q-row:last-child{border-bottom:0}.q-row .txt{min-width:0;white-space:pre-wrap;overflow-wrap:anywhere}
.opt-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}.opt-row .input{flex:1}
.thumb{display:inline-flex;flex-direction:column;gap:4px;align-items:flex-start;margin:0 8px 8px 0}.thumb img{height:64px;border:1px solid var(--border);border-radius:var(--radius)}
.modal.wide{width:min(680px,100%)}