/* VVC DISCOVERY — Integr8 palette (matches the Leverage / Dyad apps) */
:root{ --teal:#0E5A5E; --teal2:#157077; --terra:#D89B76; --terra2:#A85A30; --ink:#142F2C; --muted:#6B6355; --cream:#F4EFE3; --cream2:#FBF8F1; --line:#DED6C4; --warn:#B85042; --ok:#2E7D5B; }
*{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
body{ font-family:'Segoe UI', Calibri, 'Helvetica Neue', Arial, sans-serif; color:var(--ink); background:var(--cream2); line-height:1.55; font-size:15.5px; }
h1,h2,h3{ font-family:Cambria, Georgia, 'Times New Roman', serif; color:var(--teal); line-height:1.25; }
h2{ font-size:24px; margin-bottom:10px; } h3{ font-size:17.5px; margin:18px 0 8px; }
p{ margin:0 0 12px; } ul{ margin:0 0 12px 22px; } li{ margin-bottom:5px; }
a{ color:var(--teal2); }
.kicker{ font-size:11px; letter-spacing:3px; text-transform:uppercase; color:var(--terra); font-weight:700; }
header.top{ background:var(--teal); color:#fff; padding:12px 20px; display:flex; align-items:center; gap:14px; position:sticky; top:0; z-index:10; }
header.top h1{ color:#fff; font-size:18px; }
header.top .save{ margin-left:auto; font-size:12px; color:#CFE3DD; text-align:right; white-space:nowrap; }
nav.tabs{ background:#fff; border-bottom:1px solid var(--line); position:sticky; top:52px; z-index:9; overflow-x:auto; white-space:nowrap; padding:0 12px; }
nav.tabs button{ background:none; border:none; border-bottom:3px solid transparent; padding:12px 12px 10px; font:inherit; font-size:14px; color:var(--muted); cursor:pointer; }
nav.tabs button.on{ color:var(--teal); border-bottom-color:var(--terra); font-weight:700; }
nav.tabs button .n{ display:inline-block; min-width:20px; font-size:11px; color:var(--muted); background:var(--cream); border-radius:10px; padding:0 6px; margin-left:4px; }
nav.tabs button .n.full{ background:var(--ok); color:#fff; }
.wrap{ max-width:900px; margin:0 auto; padding:20px 16px 80px; }
.card{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:22px 26px; margin:0 0 16px; box-shadow:0 2px 10px rgba(20,47,44,.05); }
.hint{ font-size:13px; color:var(--muted); }
.demo{ background:#FFF4D6; color:#7A5A00; padding:8px 16px; font-size:12.5px; text-align:center; }
.grp{ font-family:Cambria,Georgia,serif; color:var(--terra2); font-size:13px; letter-spacing:2px; text-transform:uppercase; margin:22px 0 8px; font-weight:700; }
.q{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:18px 22px; margin:0 0 14px; }
.q .qt{ font-weight:700; font-size:15.5px; margin-bottom:10px; }
.q .qt .num{ color:var(--terra2); margin-right:6px; }
.opts{ display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }
.opt{ display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:9px; padding:10px 12px; cursor:pointer; background:var(--cream2); font-size:15px; }
.opt:hover{ border-color:var(--teal2); }
.opt input{ width:18px; height:18px; accent-color:var(--teal); flex:none; }
.opt.sel{ background:#E7F1EF; border-color:var(--teal); }
.opt .other{ flex:1; border:none; border-bottom:1px solid var(--line); background:transparent; padding:2px 4px; font:inherit; }
.scale{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.pip{ width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:#fff; cursor:pointer; font-weight:700; color:var(--teal); font-size:16px; font-family:inherit; }
.pip.on{ background:var(--teal); color:#fff; border-color:var(--teal); }
.scale .lab{ font-size:12.5px; color:var(--muted); }
textarea, input[type=text], input[type=email]{ width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px; font:inherit; font-size:15px; color:var(--ink); background:#fff; }
textarea{ min-height:110px; resize:vertical; line-height:1.5; }
textarea.big{ min-height:150px; }
textarea:focus, input:focus{ outline:2px solid rgba(14,90,94,.3); border-color:var(--teal); }
.notes label{ display:block; font-size:12.5px; color:var(--muted); margin:2px 0 5px; }
.tools{ display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; align-items:center; }
.tbtn{ display:inline-flex; align-items:center; gap:6px; background:var(--cream); border:1px solid var(--line); border-radius:20px; padding:7px 13px; font:inherit; font-size:13.5px; color:var(--teal); cursor:pointer; }
.tbtn:hover{ border-color:var(--teal2); }
.tbtn.live{ background:var(--warn); color:#fff; border-color:var(--warn); animation:pulse 1.2s infinite; }
@keyframes pulse{ 50%{ opacity:.75; } }
.memos{ display:flex; flex-direction:column; gap:6px; margin-top:8px; }
.memo{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--muted); }
.memo audio{ height:32px; max-width:260px; }
.btn{ background:var(--terra); color:#2A1607; border:none; border-radius:8px; padding:11px 20px; font-weight:700; cursor:pointer; font-size:15px; font-family:inherit; }
.btn:hover{ background:#E3AC8A; }
.btn.ghost{ background:transparent; color:var(--teal); border:1px solid var(--teal); }
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.pager{ display:flex; justify-content:space-between; gap:10px; margin-top:20px; }
.tblwrap{ overflow-x:auto; margin:6px 0 12px; }
table.rows{ width:100%; border-collapse:collapse; font-size:13.5px; min-width:600px; }
table.rows th{ text-align:left; font-size:12px; color:var(--muted); padding:6px; border-bottom:2px solid var(--line); }
table.rows td{ padding:8px 6px; border-bottom:1px solid var(--cream); vertical-align:top; }
.submitted{ background:#E8F3EE; color:var(--ok); border-radius:8px; padding:12px 16px; font-weight:600; margin-top:12px; }
.err{ color:var(--warn); }
.center{ max-width:520px; margin:60px auto; text-align:center; }
footer{ text-align:center; font-size:12px; color:var(--muted); padding:20px; }
/* admin */
table.fac{ width:100%; border-collapse:collapse; font-size:14px; }
table.fac th{ text-align:left; font-size:12px; color:var(--muted); padding:6px; border-bottom:2px solid var(--line); }
table.fac td{ padding:8px 6px; border-bottom:1px solid var(--cream); vertical-align:top; }
.ans{ display:grid; grid-template-columns:38% 1fr; gap:12px; padding:8px 0; border-bottom:1px solid var(--cream); font-size:14px; }
.ans .l{ color:var(--muted); } .ans .v{ white-space:pre-wrap; }
.row{ display:flex; gap:10px; flex-wrap:wrap; align-items:end; }
.row > div{ flex:1; min-width:180px; }
@media (max-width:640px){ .card,.q{ padding:16px; } header.top h1{ font-size:15px; } .ans{ grid-template-columns:1fr; } nav.tabs{ top:48px; } }
@media print{ header.top, nav.tabs, .tools, .pager, .btn, .demo{ display:none !important; } body{ background:#fff; } .q,.card{ break-inside:avoid; box-shadow:none; } .sec{ display:block !important; } }