:root {
  color-scheme: light;
  --bg: #F7FBFE;
  --bg-2: #EEF8FD;
  --primary: #009FE3;
  --primary-strong: #007DB5;
  --primary-soft: #6DCAF3;
  --primary-pale: #C9E8FB;
  --neutral: #768692;
  --text: #173042;
  --text-strong: #0C2536;
  --muted: #687D8B;
  --surface: rgba(255,255,255,.90);
  --surface-strong: #FFFFFF;
  --border: rgba(0,159,227,.16);
  --border-strong: rgba(0,159,227,.30);
  --danger: #C94A55;
  --ok: #2D956C;
  --shadow: 0 24px 70px rgba(17,76,108,.12);
  --shadow-soft: 0 12px 34px rgba(17,76,108,.08);
  --radius: 30px;
  --blur: 18px;
  font-family: 'Lato', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

* { box-sizing: border-box; }
html { min-height:100%; background:var(--bg); }
body { min-height:100%; margin:0; color:var(--text); background:var(--bg); overflow-x:hidden; }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed; opacity:.45; }
a { color:inherit; }
::selection { background:rgba(0,159,227,.18); color:var(--text-strong); }

/* AUSAPE light visual language: white canvas + cyan isotipo circles */
.ambient {
  position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:-3;
  background:
    radial-gradient(circle at 16% 18%, rgba(109,202,243,.22), transparent 27%),
    radial-gradient(circle at 83% 22%, rgba(201,232,251,.45), transparent 24%),
    radial-gradient(circle at 78% 82%, rgba(0,159,227,.07), transparent 30%),
    linear-gradient(145deg,#FFFFFF 0%,#F8FCFF 43%,#EEF8FD 100%);
}
.ambient::before,
.ambient::after { content:''; position:absolute; border-radius:50%; }
.ambient::before {
  width:360px; height:360px; left:-180px; top:13%;
  background:rgba(0,159,227,.08);
  box-shadow:
    280px -105px 0 -118px rgba(109,202,243,.42),
    340px -55px 0 -150px rgba(118,134,146,.16),
    205px 310px 0 -132px rgba(118,134,146,.11),
    350px 275px 0 -158px rgba(201,232,251,.78);
}
.ambient::after {
  width:500px; height:500px; right:-300px; bottom:-220px;
  background:rgba(0,159,227,.055);
  box-shadow:
    -260px -170px 0 -150px rgba(109,202,243,.13),
    -125px -350px 0 -210px rgba(201,232,251,.42);
}

.shell { min-height:100vh; display:grid; place-items:center; padding:34px 18px; }
.container { width:min(1220px,100%); margin-inline:auto; }
.feedback-wrap { width:min(650px,100%); margin-inline:auto; }

.glass {
  background:linear-gradient(155deg,rgba(255,255,255,.96),rgba(255,255,255,.84));
  border:1px solid var(--border);
  border-radius:var(--radius);
  backdrop-filter:blur(var(--blur)) saturate(120%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(120%);
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.95);
}

.feedback-card { position:relative; overflow:hidden; padding:clamp(25px,5vw,44px); isolation:isolate; }
.feedback-card::before {
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(125deg,rgba(255,255,255,.55),transparent 38%),
    radial-gradient(circle at 103% -4%,rgba(0,159,227,.11),transparent 30%);
}
.feedback-card::after {
  content:''; position:absolute; width:190px; height:190px; right:-108px; bottom:-120px; z-index:-1;
  border-radius:50%; background:rgba(0,159,227,.09); box-shadow:-137px 62px 0 -58px rgba(109,202,243,.16);
}

.brand-row { display:flex; align-items:center; gap:16px; min-height:54px; margin-bottom:25px; }
.brand-logo { width:164px; max-width:45vw; height:auto; display:block; object-fit:contain; }
.brand-logo.compact { width:118px; }
.brand-logo.small { width:104px; }
.brand-copy { padding-left:14px; border-left:1px solid rgba(0,159,227,.16); }
.brand-copy small { display:block; color:var(--primary); text-transform:uppercase; letter-spacing:.17em; font-size:9px; font-weight:900; }
.brand-copy strong { display:block; margin-top:4px; color:var(--text-strong); font-size:14px; font-weight:800; }
.brand-mark { width:44px; height:44px; border-radius:50%; background:var(--primary); color:#fff; display:grid; place-items:center; font-weight:900; }

.eyebrow { color:var(--primary); text-transform:uppercase; letter-spacing:.2em; font-size:10px; font-weight:900; }
.feedback-title { margin:10px 0 12px; color:var(--text-strong); font-size:clamp(31px,6vw,50px); line-height:1.02; letter-spacing:-.035em; font-weight:900; }
.feedback-subtitle { margin:0; max-width:50ch; color:var(--muted); line-height:1.6; font-size:15px; }

.progress { margin:29px 0 8px; display:flex; align-items:center; gap:7px; }
.progress-dot { height:5px; flex:1; max-width:38px; border-radius:99px; background:#E5F3FA; transition:.35s ease; }
.progress-dot.done,.progress-dot.active { background:linear-gradient(90deg,var(--primary),var(--primary-soft)); box-shadow:0 5px 16px rgba(0,159,227,.18); }
.progress-label { margin-left:auto; color:var(--neutral); font-size:11px; white-space:nowrap; }

.question { animation:questionIn .42s cubic-bezier(.2,.8,.2,1); transform-origin:center; }
@keyframes questionIn { from { opacity:0; transform:translateY(13px) scale(.992); filter:blur(5px); } to { opacity:1; transform:none; filter:none; } }
.question-index { color:var(--primary); font-size:10px; font-weight:900; letter-spacing:.16em; margin-top:25px; }
.question h2 { color:var(--text-strong); font-size:clamp(24px,5vw,35px); line-height:1.14; letter-spacing:-.025em; margin:10px 0; font-weight:900; }
.question-help { color:var(--muted); font-size:13px; line-height:1.55; margin-bottom:23px; }
.required { color:var(--primary-strong); }

.rating-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
.score-btn {
  min-height:60px; border:1px solid rgba(0,159,227,.22); border-radius:50%; aspect-ratio:1/1; max-width:62px; justify-self:center; width:100%;
  color:var(--text-strong); background:linear-gradient(145deg,#FFFFFF,#F2FAFE);
  box-shadow:0 8px 20px rgba(27,92,126,.07), inset 0 1px 0 rgba(255,255,255,.9); transition:.2s ease; font-weight:900; font-size:16px;
}
.score-btn:hover { transform:translateY(-2px); border-color:rgba(0,159,227,.55); background:#F4FBFF; box-shadow:0 12px 24px rgba(0,159,227,.10); }
.score-btn.selected { color:#fff; background:linear-gradient(145deg,var(--primary-soft),var(--primary)); border-color:var(--primary); box-shadow:0 0 0 5px rgba(0,159,227,.08),0 14px 30px rgba(0,159,227,.20); transform:translateY(-2px) scale(1.04); }
.scale-labels { display:flex; justify-content:space-between; gap:20px; color:var(--muted); font-size:11px; margin-top:11px; }

.options { display:grid; gap:10px; }
.option-btn {
  width:100%; text-align:left; padding:15px 17px; border-radius:18px; border:1px solid rgba(0,159,227,.15);
  background:rgba(255,255,255,.86); color:var(--text); transition:.18s ease; display:flex; align-items:center; justify-content:space-between; gap:12px;
  box-shadow:0 7px 18px rgba(23,78,107,.04);
}
.option-btn:hover { border-color:rgba(0,159,227,.40); transform:translateY(-1px); background:#F9FDFF; }
.option-btn.selected { border-color:rgba(0,159,227,.55); background:#EBF8FE; box-shadow:inset 0 0 0 1px rgba(0,159,227,.05),0 10px 22px rgba(0,159,227,.08); }
.option-indicator { width:21px; height:21px; flex:0 0 auto; border-radius:8px; border:1px solid rgba(0,159,227,.24); display:grid; place-items:center; font-size:12px; color:#fff; background:#fff; }
.option-btn.selected .option-indicator { background:var(--primary); border-color:transparent; color:#fff; }
.chips { display:flex; flex-wrap:wrap; gap:9px; }
.chip { width:auto; padding:12px 14px; border-radius:999px; }

.textarea,.input,.select {
  width:100%; border:1px solid rgba(0,159,227,.16); background:rgba(255,255,255,.95); color:var(--text-strong); border-radius:17px; padding:15px 16px; outline:none; transition:.18s ease;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
.textarea { min-height:140px; resize:vertical; line-height:1.55; }
.textarea::placeholder,.input::placeholder { color:#93A6B3; }
.textarea:focus,.input:focus,.select:focus { border-color:rgba(0,159,227,.68); box-shadow:0 0 0 4px rgba(0,159,227,.08),0 12px 28px rgba(0,159,227,.06); }
.char-count { text-align:right; color:var(--muted); font-size:11px; margin-top:7px; }

.nav-row { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:28px; }
.btn { border:0; border-radius:16px; min-height:48px; padding:0 18px; font-weight:900; transition:.18s ease; display:inline-flex; align-items:center; justify-content:center; gap:8px; text-decoration:none; }
.btn-primary { background:linear-gradient(135deg,#16AFE9,var(--primary)); color:#fff; box-shadow:0 12px 26px rgba(0,159,227,.18); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(0,159,227,.24); }
.btn-ghost { color:var(--text-strong); background:#FFFFFF; border:1px solid rgba(0,159,227,.16); box-shadow:0 6px 16px rgba(17,76,108,.04); }
.btn-ghost:hover { border-color:rgba(0,159,227,.35); background:#F6FBFE; }
.btn-danger { color:#A4333D; background:#FFF6F6; border:1px solid rgba(201,74,85,.18); }
.btn-sm { min-height:38px; border-radius:12px; padding:0 13px; font-size:12px; }

.thankyou { text-align:center; padding-block:22px 8px; animation:questionIn .55s ease; }
.thankyou-badge { width:88px; height:88px; border-radius:50%; display:grid; place-items:center; margin:0 auto 21px; color:#fff; font-size:34px; background:linear-gradient(145deg,var(--primary-soft),var(--primary)); box-shadow:0 0 0 10px rgba(0,159,227,.07),0 18px 38px rgba(0,159,227,.22); }
.thankyou h2 { color:var(--text-strong); font-size:clamp(28px,5vw,40px); margin:0 0 12px; font-weight:900; }
.thankyou p { color:var(--muted); line-height:1.65; }

/* Admin */
.admin-shell { min-height:100vh; background:linear-gradient(145deg,#FFFFFF,#F8FCFF 42%,#EEF8FD); color:var(--text); }
.admin-topbar { position:sticky; top:0; z-index:10; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:13px clamp(18px,4vw,38px); border-bottom:1px solid rgba(0,159,227,.10); background:rgba(255,255,255,.88); backdrop-filter:blur(20px); box-shadow:0 8px 28px rgba(17,76,108,.05); }
.admin-brand { display:flex; align-items:center; gap:14px; font-weight:900; color:var(--text-strong); }
.admin-brand span { color:var(--primary); }
.admin-main { width:min(1320px,100%); margin:0 auto; padding:34px clamp(18px,4vw,38px) 70px; }
.admin-head { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; margin-bottom:28px; flex-wrap:wrap; }
.admin-head h1 { color:var(--text-strong); font-size:clamp(28px,4vw,43px); margin:0 0 6px; letter-spacing:-.035em; font-weight:900; }
.admin-head p { color:var(--muted); margin:0; }
.admin-actions { display:flex; gap:9px; flex-wrap:wrap; align-items:center; }

.kpi-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px; }
.kpi { padding:20px; border:1px solid rgba(0,159,227,.10); border-radius:22px; background:linear-gradient(180deg,#FFFFFF,#F8FCFF); box-shadow:var(--shadow-soft); }
.kpi small { display:block; color:var(--muted); text-transform:uppercase; letter-spacing:.14em; font-size:9px; margin-bottom:10px; font-weight:900; }
.kpi strong { color:var(--text-strong); font-size:30px; line-height:1; font-weight:900; }
.kpi .accent { color:var(--primary); text-shadow:none; }

.toolbar { display:flex; gap:10px; align-items:center; margin-bottom:14px; }
.search { max-width:360px; }
.event-list { display:grid; gap:12px; }
.event-card { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 19px; border:1px solid rgba(0,159,227,.10); border-radius:22px; background:linear-gradient(155deg,#FFFFFF,#F9FDFF); transition:.18s ease; box-shadow:0 8px 24px rgba(17,76,108,.05); }
.event-card:hover { transform:translateY(-1px); border-color:rgba(0,159,227,.26); box-shadow:0 15px 36px rgba(17,76,108,.08); }
.event-card h3 { margin:0 0 7px; color:var(--text-strong); font-size:18px; }
.event-meta { display:flex; gap:10px; flex-wrap:wrap; align-items:center; color:var(--muted); font-size:12px; }
.event-card-actions { display:flex; gap:8px; flex-wrap:wrap; }
.badge { display:inline-flex; align-items:center; min-height:25px; padding:0 9px; border-radius:999px; font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.09em; background:#F1F5F7; border:1px solid rgba(118,134,146,.18); color:#60727F; }
.badge.active { color:#1E7C58; border-color:rgba(45,149,108,.22); background:#EFFAF5; }
.badge.draft { color:#007DB5; border-color:rgba(0,159,227,.20); background:#EAF8FE; }
.badge.closed,.badge.archived { color:#667985; background:#F3F6F8; }

.editor-grid { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:18px; align-items:start; }
.panel,.preview-card,.result-card { border:1px solid rgba(0,159,227,.10); background:linear-gradient(160deg,#FFFFFF,#F9FDFF); border-radius:24px; padding:20px; box-shadow:0 10px 28px rgba(17,76,108,.06); }
.preview-card { position:sticky; top:92px; overflow:hidden; }
.preview-card::after { content:''; position:absolute; width:145px; height:145px; border-radius:50%; right:-80px; top:-60px; background:rgba(0,159,227,.08); pointer-events:none; }
.preview-mini { margin-top:16px; padding:22px; border-radius:23px; border:1px solid rgba(0,159,227,.14); background:linear-gradient(160deg,#FFFFFF,#EEF9FE); box-shadow:inset 0 1px 0 #fff; }
.mini-score { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
.mini-score span { display:grid; place-items:center; min-height:36px; border-radius:50%; border:1px solid rgba(0,159,227,.22); background:#FFFFFF; color:var(--text-strong); }

.question-list { display:grid; gap:10px; }
.q-admin { padding:14px; border:1px solid rgba(0,159,227,.10); border-radius:18px; background:#FFFFFF; box-shadow:0 5px 15px rgba(17,76,108,.035); }
.q-admin.dragging { opacity:.55; border-color:var(--primary); }
.q-admin-head { display:flex; align-items:center; gap:12px; }
.drag { color:var(--primary); cursor:grab; font-weight:900; user-select:none; }
.q-admin-title { flex:1; min-width:0; }
.q-admin-title strong { display:block; color:var(--text-strong); font-size:14px; }
.q-admin-title small { display:block; color:var(--muted); margin-top:4px; }
.toggle-row { display:flex; align-items:center; gap:8px; }
.toggle { appearance:none; width:38px; height:22px; border-radius:99px; background:#DDE7EC; position:relative; transition:.2s; vertical-align:middle; }
.toggle::after { content:''; position:absolute; width:16px; height:16px; border-radius:50%; background:#fff; left:3px; top:3px; transition:.2s; box-shadow:0 2px 5px rgba(25,75,103,.12); }
.toggle:checked { background:var(--primary); box-shadow:0 6px 15px rgba(0,159,227,.16); }
.toggle:checked::after { left:19px; }

.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.form-group.full,.full { grid-column:1/-1; }
.label { display:block; margin-bottom:7px; color:var(--muted); font-size:11px; font-weight:900; letter-spacing:.06em; }
.option-editor { display:grid; gap:8px; }
.option-editor-row { display:grid; grid-template-columns:1fr 1fr auto; gap:8px; }

.results-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.result-card h3 { margin:0 0 14px; color:var(--text-strong); font-size:16px; }
.result-card.wide { grid-column:span 2; }
.big-number { color:var(--primary); font-size:44px; line-height:1; font-weight:900; text-shadow:none; }
.bar-row { display:grid; grid-template-columns:minmax(90px,1.2fr) 2fr 34px; align-items:center; gap:10px; margin:9px 0; font-size:12px; }
.bar { height:8px; border-radius:99px; background:#E7F3F9; overflow:hidden; }
.bar > span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--primary),var(--primary-soft)); }
.comment { padding:13px 0; border-bottom:1px solid rgba(0,159,227,.08); color:#385265; line-height:1.55; }

.login-wrap { min-height:100vh; display:grid; place-items:center; padding:24px; background:linear-gradient(145deg,#FFFFFF,#F7FBFE 50%,#EAF7FD); }
.login-card { width:min(440px,100%); padding:34px; position:relative; overflow:hidden; }
.login-card h1 { margin:10px 0 8px; color:var(--text-strong); font-size:36px; }
.login-card p { color:var(--muted); line-height:1.55; }

.modal-backdrop { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:18px; background:rgba(20,52,70,.18); backdrop-filter:blur(10px); }
.modal { width:min(650px,100%); border:1px solid rgba(0,159,227,.14); border-radius:25px; padding:23px; background:#FFFFFF; box-shadow:0 30px 90px rgba(25,75,103,.18); }
.modal h2 { margin:0 0 18px; color:var(--text-strong); }
.modal-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:18px; }
.qr-canvas { display:inline-block; padding:14px; background:#fff; border:1px solid rgba(0,159,227,.10); border-radius:18px; margin:5px auto 17px; box-shadow:0 10px 25px rgba(17,76,108,.06); }
.empty { color:var(--muted); padding:22px; text-align:center; border:1px dashed rgba(0,159,227,.18); border-radius:18px; background:rgba(255,255,255,.58); }
.loader { width:28px; height:28px; border-radius:50%; border:2px solid #DDEFF8; border-top-color:var(--primary); animation:spin .8s linear infinite; margin:18px auto; box-shadow:0 0 18px rgba(0,159,227,.10); }
@keyframes spin { to { transform:rotate(360deg); } }
.toast { position:fixed; z-index:99; right:18px; bottom:18px; max-width:min(390px,calc(100vw - 36px)); padding:13px 15px; border-radius:15px; background:#FFFFFF; border:1px solid rgba(0,159,227,.18); color:var(--text-strong); box-shadow:0 18px 48px rgba(25,75,103,.16); animation:questionIn .25s ease; }
.toast.error { border-color:rgba(201,74,85,.24); color:#A4333D; background:#FFF9F9; }

@media (max-width:900px) {
  .kpi-grid { grid-template-columns:repeat(2,1fr); }
  .editor-grid { grid-template-columns:1fr; }
  .preview-card { position:relative; top:auto; }
}
@media (max-width:650px) {
  .shell { padding:14px; align-items:stretch; }
  .feedback-wrap { align-self:center; }
  .feedback-card { border-radius:27px; padding:23px 20px 26px; }
  .brand-row { margin-bottom:20px; }
  .brand-logo { width:148px; }
  .brand-copy { display:none; }
  .feedback-title { font-size:35px; }
  .question h2 { font-size:27px; }
  .score-btn { min-height:52px; max-width:54px; }
  .nav-row { position:sticky; bottom:0; padding-top:12px; background:linear-gradient(transparent,rgba(247,251,254,.97) 43%); }
  .nav-row .btn-primary { flex:1; }
  .admin-topbar { padding:11px 14px; }
  .admin-main { padding:24px 14px 50px; }
  .admin-brand .brand-logo { width:105px; }
  .kpi-grid { grid-template-columns:1fr 1fr; gap:10px; }
  .kpi { padding:16px; }
  .kpi strong { font-size:25px; }
  .event-card { align-items:flex-start; flex-direction:column; }
  .form-grid { grid-template-columns:1fr; }
  .form-group.full { grid-column:auto; }
  .results-grid { grid-template-columns:1fr; }
  .result-card.wide { grid-column:auto; }
  .bar-row { grid-template-columns:1fr; gap:5px; }
  .bar { width:100%; }
  .option-editor-row { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; transition-duration:.01ms!important; }
}
@media print {
  .admin-topbar,.admin-actions,.toolbar { display:none!important; }
  .admin-shell { background:#fff; color:#111; }
  .admin-main { width:100%; padding:0; }
  .kpi,.result-card { color:#111; background:#fff; border-color:#ddd; box-shadow:none; break-inside:avoid; }
  .eyebrow,.big-number,.kpi .accent { color:#007DB4!important; text-shadow:none; }
  .question-help,.admin-head p,.kpi small { color:#555!important; }
}