:root{
  --bg:#f4f2ed; --surface:#fff; --surface-2:#eef3f1; --text:#1e2927; --muted:#66736f;
  --primary:#355d57; --primary-2:#274843; --accent:#9d6e4b; --border:#d9dfdc; --danger:#9b2f2f;
  --ok:#2f6d4f; --warn:#8a641f; --shadow:0 8px 28px rgba(33,47,43,.08); --radius:18px;
}
*{box-sizing:border-box} html{background:var(--bg)} body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:var(--bg);min-height:100vh}
button,input,select,textarea{font:inherit} button{cursor:pointer}.hidden{display:none!important}
.shell{min-height:100vh}.topbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.topbar-inner{max-width:1100px;margin:auto;display:flex;align-items:center;gap:14px;padding:12px 18px}.brand{display:flex;align-items:center;gap:10px;font-weight:800}.brand img{width:34px;height:34px}.grow{flex:1}.nav{display:flex;gap:6px;flex-wrap:wrap}.nav button{border:0;background:transparent;padding:9px 11px;border-radius:10px;color:var(--muted)}.nav button.active,.nav button:hover{background:var(--surface-2);color:var(--primary)}
.userline{font-size:.85rem;color:var(--muted);max-width:180px;overflow:hidden;text-overflow:ellipsis}.container{max-width:1100px;margin:auto;padding:24px 18px 90px}.hero{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px}.hero h1{margin:0 0 6px;font-size:clamp(1.55rem,4vw,2.3rem)}.hero p{margin:0;color:var(--muted)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.grid{display:grid;gap:16px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.stat strong{display:block;font-size:2rem;color:var(--primary)}.stat span{color:var(--muted)}
.btn{border:1px solid transparent;border-radius:12px;padding:11px 15px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn-primary{background:var(--primary);color:white}.btn-primary:hover{background:var(--primary-2)}.btn-secondary{background:var(--surface);color:var(--primary);border-color:var(--border)}.btn-danger{background:#fff2f2;color:var(--danger);border-color:#edcccc}.btn:disabled{opacity:.5;cursor:not-allowed}
.quick{min-height:155px;text-align:left;display:flex;flex-direction:column;justify-content:space-between}.quick h3{margin:0 0 8px}.quick p{margin:0;color:var(--muted)}
.form-head{display:grid;grid-template-columns:1.3fr 1fr .8fr;gap:14px;margin-bottom:18px}.field{display:flex;flex-direction:column;gap:7px}.field label,.q-label{font-weight:700}.field input,.field select,.field textarea,.q textarea,.q input[type=number],.q input[type=text]{width:100%;border:1px solid var(--border);border-radius:11px;padding:11px 12px;background:#fff;color:var(--text)} textarea{min-height:105px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus,.q textarea:focus,.q input:focus{outline:3px solid rgba(53,93,87,.12);border-color:var(--primary)}
.section{margin:18px 0}.section-title{margin:0 0 12px;color:var(--primary);font-size:1.1rem}.q{padding:16px 0;border-top:1px solid #edf0ee}.q:first-of-type{border-top:0}.q-label{display:block;margin-bottom:10px}.options{display:grid;gap:8px}.option{display:flex;align-items:flex-start;gap:9px;padding:9px 10px;border:1px solid var(--border);border-radius:10px;background:#fff}.option input{margin-top:3px}.other-input{margin-top:8px}.sticky-actions{position:fixed;bottom:0;left:0;right:0;background:rgba(255,255,255,.96);border-top:1px solid var(--border);backdrop-filter:blur(12px);padding:10px 18px;z-index:30}.sticky-actions-inner{max-width:1100px;margin:auto;display:flex;justify-content:space-between;gap:10px;align-items:center}.action-group{display:flex;gap:8px;flex-wrap:wrap}
.audio-card{display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:var(--surface-2);border-radius:14px;padding:14px}.record-dot{width:10px;height:10px;border-radius:50%;background:#ba2e2e;display:inline-block}.recording .record-dot{animation:pulse 1s infinite}@keyframes pulse{50%{opacity:.25}}.timer{font-variant-numeric:tabular-nums;font-weight:800}.status{font-size:.88rem;color:var(--muted)}
.list{display:grid;gap:10px}.row{background:var(--surface);border:1px solid var(--border);border-radius:13px;padding:14px;display:grid;grid-template-columns:1fr auto;gap:10px}.row-title{font-weight:800}.row-meta{font-size:.9rem;color:var(--muted);margin-top:5px}.badge{display:inline-flex;padding:4px 8px;border-radius:999px;font-size:.78rem;font-weight:800;background:var(--surface-2);color:var(--primary)}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(430px,100%);padding:28px}.login-card h1{margin:12px 0 4px}.login-card p{color:var(--muted);margin-top:0}.login-logo{width:52px;height:52px}.login-form{display:grid;gap:14px;margin-top:22px}.helper{font-size:.86rem;color:var(--muted)}
.offline-banner{background:#fff5dc;color:#775519;border-bottom:1px solid #eedca9;padding:8px 18px;text-align:center;font-size:.9rem;font-weight:650}.toast{position:fixed;right:18px;bottom:82px;z-index:100;max-width:360px;background:#1f2b28;color:#fff;padding:12px 14px;border-radius:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}.empty{text-align:center;padding:38px;color:var(--muted)}
.attendee{display:grid;grid-template-columns:1.1fr 1fr .8fr 1.1fr auto;gap:8px;align-items:end}.small{font-size:.82rem}.muted{color:var(--muted)}
@media(max-width:760px){.topbar-inner{align-items:flex-start}.nav{display:none}.userline{display:none}.container{padding:18px 12px 92px}.hero{display:block}.hero .btn{margin-top:12px;width:100%}.grid-2,.grid-3,.form-head{grid-template-columns:1fr}.card{padding:16px}.sticky-actions-inner{align-items:stretch}.sticky-actions-inner,.action-group{flex-direction:column}.sticky-actions .btn{width:100%}.attendee{grid-template-columns:1fr}.row{grid-template-columns:1fr}.topbar .brand span{font-size:.95rem}}