:root{
  --bg:#f5f7fa;--panel:#ffffff;--ink:#182233;--muted:#697386;--line:#e5eaf1;--soft:#f8fafc;
  --primary:#1d4f91;--primary-2:#173f73;--accent:#0f766e;--danger:#b42318;--warning:#a15c07;--success:#087443;
  --shadow:0 12px 32px rgba(20,35,60,.08);--radius:18px;--radius-sm:12px;--focus:0 0 0 4px rgba(29,79,145,.14);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Sarabun","Noto Sans Thai",Tahoma,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;line-height:1.55}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}
.app-shell{display:flex;min-height:100vh}.side-panel{width:282px;background:#101828;color:#fff;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;padding:22px 18px}.brand-block{display:flex;gap:13px;align-items:center;padding:4px 6px 22px}.brand-mark{width:42px;height:42px;border-radius:14px;background:#fff;color:#101828;display:grid;place-items:center;font-size:26px;font-weight:800}.brand-name{font-size:22px;font-weight:800;letter-spacing:.2px}.brand-subtitle{font-size:12px;color:#cbd5e1}.side-nav{display:flex;flex-direction:column;gap:6px}.nav-item{display:flex;align-items:center;gap:10px;color:#d7dee9;padding:11px 12px;border-radius:12px;text-decoration:none;font-weight:650}.nav-item:hover{background:rgba(255,255,255,.08);text-decoration:none}.nav-item.active{background:#fff;color:#101828}.nav-dot{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.8}.side-footer{margin-top:auto;border-top:1px solid rgba(255,255,255,.12);padding:16px 8px 0}.mini-label{font-size:12px;color:#aab4c2}.user-mini{font-weight:800;margin:2px 0 7px}.text-link{font-size:13px;color:#dbeafe}.main-panel{flex:1;min-width:0}.top-bar{min-height:88px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:18px;justify-content:space-between;padding:18px 30px;position:sticky;top:0;z-index:10}.top-bar h1{margin:0;font-size:24px;line-height:1.25}.top-bar p{margin:3px 0 0;color:var(--muted);font-size:13px}.content-wrap{padding:28px 30px 50px;max-width:1440px}.role-pill,.badge{display:inline-flex;align-items:center;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:800;background:#eef2f7;color:#334155}.badge-success{background:#e8f7ef;color:var(--success)}.badge-danger{background:#fff0ee;color:var(--danger)}.badge-warning{background:#fff7e6;color:var(--warning)}.badge-info{background:#eaf3ff;color:var(--primary)}.badge-muted{background:#eef2f7;color:#475569}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}.card.compact{padding:16px}.card-title{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.card-title h2,.card-title h3{margin:0}.card-title p{margin:4px 0 0;color:var(--muted)}.grid{display:grid;gap:18px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.stat-card{background:linear-gradient(180deg,#fff,#fafcff);border:1px solid var(--line);border-radius:18px;padding:18px}.stat-number{font-size:32px;font-weight:900;line-height:1}.stat-label{color:var(--muted);font-size:13px;margin-top:6px}.toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}.toolbar-left,.toolbar-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.sticky-actions{position:sticky;bottom:0;background:rgba(245,247,250,.92);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:14px 0;margin-top:24px;z-index:8}.actions-row{display:flex;gap:10px;justify-content:flex-end;align-items:center;flex-wrap:wrap}
button,.btn{font-family:inherit;border:0;border-radius:12px;padding:10px 15px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:8px;text-decoration:none;line-height:1.2}.btn:hover{text-decoration:none}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-2)}.btn-secondary{background:#eef2f7;color:#1f2937}.btn-light{background:#fff;color:#1f2937;border:1px solid var(--line)}.btn-danger{background:var(--danger);color:#fff}.btn-success{background:var(--success);color:#fff}.btn-warning{background:#f59e0b;color:#111827}.btn-sm{padding:7px 10px;font-size:13px}.icon-button{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:#fff}.mobile-only{display:none}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.field{display:flex;flex-direction:column;gap:7px}.field label{font-weight:800;color:#243047}.req{color:var(--danger)}input,select,textarea{width:100%;border:1px solid #d9e1ec;background:#fff;color:var(--ink);border-radius:12px;padding:10px 12px;font-family:inherit;font-size:15px;outline:none}textarea{min-height:96px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:var(--focus)}.help{font-size:12px;color:var(--muted)}.error-text{color:var(--danger);font-size:13px}.checkline{display:flex;gap:9px;align-items:flex-start}.checkline input{width:auto;margin-top:5px}.divider{height:1px;background:var(--line);margin:18px 0}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px;background:#fff}table{width:100%;border-collapse:separate;border-spacing:0}th,td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{background:#f8fafc;color:#475569;font-size:13px;font-weight:900;white-space:nowrap}tr:last-child td{border-bottom:0}.muted{color:var(--muted)}.nowrap{white-space:nowrap}.alert{border-radius:14px;padding:13px 16px;margin:16px 30px 0;border:1px solid var(--line);background:#fff}.alert-success{background:#ecfdf3;border-color:#bbf7d0;color:#065f46}.alert-danger{background:#fff1f2;border-color:#fecdd3;color:#991b1b}.alert-warning{background:#fffbeb;border-color:#fde68a;color:#92400e}.alert-info{background:#eff6ff;border-color:#bfdbfe;color:#1e3a8a}
.builder-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;align-items:start}.builder-side{position:sticky;top:110px}.section-card{border:1px solid var(--line);border-radius:18px;background:#fff;margin-bottom:16px;overflow:hidden}.section-head{background:#f8fafc;padding:16px;border-bottom:1px solid var(--line)}.question-card{margin:14px;border:1px solid #e5eaf1;border-radius:16px;padding:16px;background:#fff}.question-card:hover{border-color:#cbd5e1}.question-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px}.question-actions{display:flex;justify-content:space-between;align-items:center;margin-top:12px}.drag-hint{font-size:12px;color:var(--muted)}.public-form{max-width:860px;margin:0 auto;padding:26px}.public-head{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:var(--shadow);margin-bottom:18px}.public-section{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;margin-bottom:16px}.question-block{padding:15px 0;border-bottom:1px solid #eef2f7}.question-block:last-child{border-bottom:0}.option-stack{display:grid;gap:8px;margin-top:8px}.qr-box{border:1px dashed #b8c3d3;border-radius:18px;padding:16px;text-align:center;background:#fbfdff}.qr-box img{max-width:220px;width:100%;height:auto}.kbd{font-family:ui-monospace,Consolas,monospace;background:#eef2f7;border-radius:7px;padding:2px 6px;font-size:12px}.empty{border:1px dashed #cbd5e1;background:#fff;border-radius:18px;padding:30px;text-align:center;color:var(--muted)}
.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#eef4ff,#f8fafc 45%,#edfdf9)}.auth-card{width:100%;max-width:460px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:30px}.auth-card h1{margin:0;font-size:28px}.auth-card p{color:var(--muted);margin:6px 0 22px}.install-card{max-width:880px}.install-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}.install-step{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:12px;font-size:13px}.hidden{display:none!important}
@media(max-width:1100px){.grid-4{grid-template-columns:repeat(2,1fr)}.builder-layout{grid-template-columns:1fr}.builder-side{position:static}.side-panel{position:fixed;left:-290px;z-index:30;transition:.2s}.side-panel.open{left:0}.mobile-only{display:inline-grid}.main-panel{width:100%}.top-bar{padding:14px 18px}.content-wrap{padding:20px 18px}.alert{margin-left:18px;margin-right:18px}}
@media(max-width:760px){.form-grid,.grid-2,.grid-3,.grid-4,.question-grid{grid-template-columns:1fr}.top-actions{display:none}.top-bar h1{font-size:20px}.public-form{padding:14px}.card{padding:16px}.install-steps{grid-template-columns:1fr}.actions-row{justify-content:stretch}.actions-row .btn{justify-content:center;flex:1}.toolbar{align-items:stretch}.toolbar-left,.toolbar-right{width:100%}.toolbar input,.toolbar select{min-width:0}}


/* UX refinement: friendlier survey builder and login visual */
.auth-survey-page{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 12%, rgba(29,79,145,.16), transparent 28%),
    radial-gradient(circle at 88% 84%, rgba(15,118,110,.13), transparent 28%),
    linear-gradient(135deg,#f3f7ff 0%,#fbfdff 48%,#effbf8 100%);
}
.auth-survey-page::before{
  content:"";
  position:fixed;
  inset:0;
  background-image:url('../img/login-survey-bg.svg');
  background-repeat:no-repeat;
  background-position:center;
  background-size:min(1080px,94vw) auto;
  opacity:.16;
  pointer-events:none;
}
.auth-card-modern{position:relative;z-index:1;max-width:480px;padding:34px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px)}
.auth-brand-row{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.auth-logo{width:48px;height:48px;border-radius:16px;background:var(--primary);color:#fff;display:grid;place-items:center;font-size:28px;font-weight:900;box-shadow:0 10px 24px rgba(29,79,145,.18)}
.auth-brand-row h1{font-size:27px;line-height:1;margin:0;text-transform:none}.auth-brand-row p{margin:5px 0 0;color:var(--muted);font-size:13px}
.auth-welcome{background:#f8fafc;border:1px solid var(--line);border-radius:18px;padding:16px 18px;margin-bottom:18px}.auth-welcome h2{margin:0;font-size:20px}.auth-welcome p{margin:5px 0 0;color:var(--muted)}
.auth-form label{font-size:14px}.auth-form input{padding:12px 14px}
.builder-friendly{display:grid;grid-template-columns:minmax(0,1fr) 318px;gap:18px;align-items:start}.builder-friendly .builder-main{min-width:0}.builder-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px;background:linear-gradient(180deg,#fff,#fbfdff)}.builder-hero h2{margin:0;font-size:24px}.builder-hero p{margin:6px 0 0;color:var(--muted)}.eyebrow{font-size:12px;font-weight:900;color:var(--primary);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.builder-hero-status{white-space:nowrap}.builder-steps{position:sticky;top:88px;z-index:9;display:flex;gap:8px;flex-wrap:wrap;background:rgba(245,247,250,.92);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:18px;padding:8px;margin-bottom:16px}.step-pill{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:8px 12px;color:#475569;background:#fff;border:1px solid var(--line);font-weight:850;font-size:13px;text-decoration:none}.step-pill:hover{text-decoration:none;background:#f8fafc}.step-pill span{width:22px;height:22px;border-radius:50%;background:#eaf3ff;color:var(--primary);display:grid;place-items:center;font-size:12px}.builder-block{scroll-margin-top:150px;margin-bottom:16px}.section-title-row,.question-area-head{display:flex;justify-content:space-between;align-items:center;gap:14px}.section-title-row h3,.question-area-head h3,.publish-card h3,.guide-card h3{margin:0}.section-title-row p,.question-area-head p{margin:4px 0 0;color:var(--muted)}.relaxed-grid{gap:18px}.field-wide{grid-column:1 / -1}.builder-sections{margin-top:14px}.friendly-section{box-shadow:var(--shadow);border-radius:20px;margin-bottom:18px}.friendly-section-head{background:#f8fafc;padding:18px}.section-number,.question-number{font-weight:900;color:#334155;background:#eef2f7;border-radius:999px;padding:4px 10px;font-size:12px;width:max-content;margin-bottom:12px}.friendly-question{border-color:#dfe7f1;background:#fff;padding:18px;margin:16px}.question-topline{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:12px}.friendly-question-grid{grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr)}.choice-box{display:flex;align-items:center;gap:9px;min-height:43px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fbfdff;font-weight:800}.choice-box input{width:auto}.question-more{margin-top:14px;border:1px solid var(--line);border-radius:14px;background:#fbfdff;overflow:hidden}.question-more summary{cursor:pointer;padding:12px 14px;font-weight:900;color:#334155;list-style:none}.question-more summary::-webkit-details-marker{display:none}.question-more summary::after{content:'+';float:right;font-weight:900}.question-more[open] summary{border-bottom:1px solid var(--line);background:#f8fafc}.question-more[open] summary::after{content:'–'}.more-grid{padding:14px}.section-actions{display:flex;gap:10px;justify-content:flex-end;align-items:center;padding:0 16px 16px}.setting-card-list{display:grid;gap:10px;margin-top:18px}.setting-card{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);background:#fbfdff;border-radius:16px;padding:14px}.setting-card input{width:auto;margin-top:4px}.setting-card strong{display:block;color:#243047}.setting-card em{display:block;color:var(--muted);font-style:normal;font-size:13px;margin-top:2px}.builder-sticky-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0}.sticky-hint{color:var(--muted);font-size:13px}.friendly-side{position:sticky;top:110px}.publish-card p{margin-top:6px}.simple-guide{margin:10px 0 0;padding-left:20px;color:#475569}.simple-guide li{margin:6px 0}
@media(max-width:1100px){.builder-friendly{grid-template-columns:1fr}.friendly-side{position:static}.builder-steps{top:76px}.builder-sticky-actions{align-items:stretch;flex-direction:column}.sticky-hint{text-align:center}}
@media(max-width:760px){.auth-card-modern{padding:24px}.builder-hero,.section-title-row,.question-area-head,.question-topline{align-items:flex-start;flex-direction:column}.builder-steps{position:static}.step-pill{flex:1;min-width:100%}.friendly-question-grid{grid-template-columns:1fr}.section-actions{align-items:stretch;flex-direction:column}.section-actions .btn{justify-content:center}.builder-sticky-actions .actions-row{width:100%}}

/* Login page: friendly survey background and clean official card */
.auth-login-refined{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 12%, rgba(29,79,145,.14), transparent 26%),
    radial-gradient(circle at 88% 84%, rgba(15,118,110,.12), transparent 26%),
    linear-gradient(135deg,#eef4fb 0%,#f7fafc 48%,#eef9f5 100%);
}
.auth-login-refined::before{
  content:"";
  position:fixed;
  inset:0;
  background-image:url('../img/login-survey-bg.png');
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  opacity:.38;
  filter:saturate(.94);
  pointer-events:none;
}
.auth-login-refined::after{
  content:"";
  position:fixed;
  inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.52) 28%, rgba(255,255,255,.40) 50%, rgba(255,255,255,.52) 72%, rgba(255,255,255,.72) 100%),
    radial-gradient(circle at center, rgba(255,255,255,.32), rgba(255,255,255,.10) 54%, transparent 74%);
  pointer-events:none;
}
.auth-card-elegant{
  position:relative;
  z-index:2;
  max-width:460px;
  padding:34px 32px 28px;
  border:1px solid rgba(255,255,255,.76);
  background:rgba(255,255,255,.90);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 20px 60px rgba(27,57,97,.13);
}
.auth-brand-refined{margin-bottom:22px}
.auth-logo-survey{
  position:relative;
  width:52px;height:52px;border-radius:18px;
  background:linear-gradient(180deg,#25589c,#1d4f91);
  box-shadow:0 12px 26px rgba(29,79,145,.22);
}
.auth-logo-box,.auth-logo-check{position:absolute;display:block}
.auth-logo-box{left:14px;top:12px;width:24px;height:28px;border-radius:7px;background:#fff}
.auth-logo-box::before,.auth-logo-box::after{content:"";position:absolute;left:6px;right:6px;height:2px;border-radius:999px;background:#d7e4f6}
.auth-logo-box::before{top:8px}.auth-logo-box::after{top:14px}
.auth-logo-check{left:20px;top:18px;width:12px;height:7px;border-left:3px solid #1d4f91;border-bottom:3px solid #1d4f91;transform:rotate(-45deg)}
.auth-form-refined label{font-size:14px;color:#243047}.auth-form-refined input{height:46px;background:rgba(255,255,255,.96)}
.auth-submit{width:100%;justify-content:center;margin-top:20px;height:48px;font-size:15px}.auth-alert{margin:0 0 16px}.auth-helptext{margin:12px 2px 0;text-align:center;color:#7a8494;font-size:13px}

/* WYSIWYG form builder: build on the same surface users will answer */
.wys-builder-shell{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px;align-items:start}.wys-builder-main{min-width:0}.wys-builder-side{position:sticky;top:110px}.wys-topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px;background:linear-gradient(180deg,#fff,#fbfdff)}.wys-topbar h2{margin:0;font-size:26px;line-height:1.2}.wys-topbar p{margin:6px 0 0;color:var(--muted)}.wys-top-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.survey-paper{background:#f7f9fc;border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:var(--shadow)}.wys-form-cover{position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;margin-bottom:18px;box-shadow:0 10px 26px rgba(20,35,60,.06);overflow:hidden}.paper-accent{position:absolute;inset:0 0 auto 0;height:7px;background:linear-gradient(90deg,var(--primary),var(--accent))}.field-label-large{display:block;font-size:15px;font-weight:900;color:#263246;margin-bottom:8px}.muted-label{margin-top:18px}.wys-form-title-input{border:0;border-bottom:1px solid #dfe7f1;border-radius:0;padding:8px 0 12px;font-size:30px;font-weight:900;color:#172033;background:transparent}.wys-form-title-input:focus{box-shadow:none;border-color:var(--primary)}.wys-form-desc-input{border:0;border-radius:0;padding:8px 0;background:transparent;min-height:78px;font-size:16px}.wys-form-desc-input:focus{box-shadow:none}.wys-form-code{display:inline-flex;margin-top:10px;border-radius:999px;background:#f2f6fb;color:#536176;padding:5px 11px;font-size:12px}.wys-section-list{display:grid;gap:18px}.wys-section-card{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 10px 26px rgba(20,35,60,.055);overflow:hidden}.wys-section-head{background:#fbfcfe;border-bottom:1px solid var(--line);padding:20px 22px}.section-number,.question-number{display:inline-flex;align-items:center;width:max-content;border-radius:999px;background:#eaf3ff;color:var(--primary);font-size:13px;font-weight:900;padding:5px 12px;margin-bottom:12px}.wys-section-title{border:0;border-radius:0;border-bottom:1px solid #dfe7f1;background:transparent;font-size:22px;font-weight:900;padding:6px 0 10px}.wys-section-title:focus{box-shadow:none}.wys-section-desc{border:0;border-radius:0;background:transparent;padding:8px 0;color:#5f6c7d}.wys-section-desc:focus{box-shadow:none}.wys-question-list{display:grid;gap:16px;padding:18px}.wys-question-card{border:1px solid #dfe7f1;border-radius:20px;background:#fff;padding:20px;transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease}.wys-question-card:hover{border-color:#bfd0e4;box-shadow:0 12px 28px rgba(20,35,60,.06);transform:translateY(-1px)}.wys-question-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}.wys-question-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.type-picker-label{font-size:12px;font-weight:900;color:#64748b}.wys-type-select{min-width:170px;height:40px;padding:8px 10px;font-size:14px}.wys-required-pill{display:inline-flex;align-items:center;gap:7px;min-height:40px;border:1px solid var(--line);background:#fbfdff;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:900;color:#334155}.wys-required-pill input{width:auto}.wys-question-title{border:0;border-radius:0;border-bottom:1px solid #dfe7f1;background:transparent;padding:6px 0 10px;min-height:48px;font-size:21px;font-weight:850;line-height:1.4;resize:none;overflow:hidden}.wys-question-title:focus{box-shadow:none;border-color:var(--primary)}.wys-question-help{border:0;border-radius:0;background:transparent;padding:8px 0 4px;color:#64748b}.wys-question-help:focus{box-shadow:none}.wys-answer-area{margin-top:14px;background:#fbfdff;border:1px solid #e7eef7;border-radius:18px;padding:16px}.wys-answer-preview{margin-bottom:10px}.answer-sample{height:44px;background:#fff;border-color:#dfe7f1;color:#94a3b8}.answer-sample:disabled{opacity:1}.file-sample{border:1px dashed #b8c6d8;border-radius:14px;background:#fff;padding:16px;color:#475569;display:flex;align-items:center;justify-content:space-between;gap:12px}.file-sample span{font-weight:900}.file-sample small{color:#7b8797}.rating-sample{display:flex;gap:8px}.rating-sample span,.scale-sample b{width:38px;height:38px;border:1px solid #dfe7f1;background:#fff;border-radius:50%;display:grid;place-items:center;font-weight:900;color:#526174}.scale-sample{display:flex;align-items:center;gap:14px;color:#64748b;font-size:13px}.scale-sample div{display:flex;gap:8px}.dropdown-sample{height:44px;border:1px solid #dfe7f1;background:#fff;border-radius:12px;padding:10px 13px;color:#64748b;display:flex;align-items:center;justify-content:space-between}.choice-help-sample{font-size:13px;color:#64748b}.wys-options-editor{display:none;gap:9px;margin-top:8px}.wys-options-editor.is-visible{display:grid}.wys-option-row{display:grid;grid-template-columns:24px minmax(0,1fr) 34px;gap:9px;align-items:center}.wys-option-symbol{width:18px;height:18px;border:2px solid #b7c4d6;display:inline-block}.wys-option-symbol.radio{border-radius:50%}.wys-option-symbol.checkbox{border-radius:5px}.wys-option-symbol.dropdown{border-radius:5px;position:relative}.wys-option-symbol.dropdown::after{content:"⌄";position:absolute;left:3px;top:-5px;font-size:17px;color:#7b8797}.wys-option-row input{height:40px;background:#fff}.option-remove{width:32px;height:32px;border-radius:10px;background:#f3f6fa;color:#64748b;font-size:20px;line-height:1;padding:0;display:grid;place-items:center}.option-remove:hover{background:#fff1f2;color:var(--danger)}.add-option-btn{justify-self:start;background:#fff;border:1px dashed #b8c6d8;color:var(--primary);border-radius:999px;padding:9px 13px;font-weight:900}.hidden-options-text{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.wys-advanced{margin-top:14px;border:1px solid var(--line);border-radius:16px;background:#fbfdff;overflow:hidden}.wys-advanced summary{cursor:pointer;padding:12px 14px;font-weight:900;color:#344154;list-style:none}.wys-advanced summary::-webkit-details-marker{display:none}.wys-advanced summary::after{content:'+';float:right}.wys-advanced[open] summary{background:#f7fafc;border-bottom:1px solid var(--line)}.wys-advanced[open] summary::after{content:'–'}.wys-section-actions{display:flex;gap:10px;justify-content:flex-end;padding:0 18px 18px}.wys-add-section-wrap{display:flex;justify-content:center;padding:20px 0 2px}.wys-add-section-wrap .btn,.wys-section-actions .btn{font-size:15px;padding:11px 16px}.wys-settings-card{margin-top:18px}.wys-sticky-actions{display:flex;justify-content:space-between;gap:14px;align-items:center}.simple-guide{margin:10px 0 0;padding-left:22px;color:#475569}.simple-guide li{margin:7px 0}.more-grid{padding:14px}.eyebrow{font-size:12px;font-weight:900;color:var(--primary);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
@media(max-width:1180px){.wys-builder-shell{grid-template-columns:1fr}.wys-builder-side{position:static}.wys-sticky-actions{align-items:stretch;flex-direction:column}.sticky-hint{text-align:center}}
@media(max-width:760px){.auth-login-refined::before{background-position:center top;opacity:.34}.auth-card-elegant{padding:24px 20px 22px}.auth-brand-refined{margin-bottom:18px}.wys-topbar,.wys-question-toolbar{flex-direction:column}.wys-question-tools{justify-content:flex-start;width:100%}.wys-type-select{width:100%}.survey-paper{padding:12px;border-radius:18px}.wys-form-cover,.wys-section-card,.wys-question-card{border-radius:16px}.wys-form-title-input{font-size:24px}.wys-section-title{font-size:20px}.wys-question-title{font-size:18px}.wys-section-actions{flex-direction:column}.wys-section-actions .btn{justify-content:center}.wys-option-row{grid-template-columns:24px minmax(0,1fr) 32px}.scale-sample{align-items:flex-start;flex-direction:column}.actions-row .btn{min-width:0}}

/* Login background visibility refinement */
.auth-login-refined::before{
  opacity:.58;
  filter:saturate(1.06) contrast(1.03);
}
.auth-login-refined::after{
  background:
    linear-gradient(90deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.34) 28%, rgba(255,255,255,.24) 50%, rgba(255,255,255,.34) 72%, rgba(255,255,255,.55) 100%),
    radial-gradient(circle at center, rgba(255,255,255,.12), rgba(255,255,255,.04) 54%, transparent 74%);
}
.auth-card-elegant{
  background:rgba(255,255,255,.87);
  box-shadow:0 24px 72px rgba(27,57,97,.16);
}

/* Respondent preview modal for WYSIWYG builder */
.preview-open{overflow:hidden}
.respondent-preview-backdrop[hidden]{display:none!important}
.respondent-preview-backdrop{
  position:fixed;
  inset:0;
  z-index:1000;
  background:rgba(15,23,42,.46);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  display:grid;
  place-items:center;
  padding:22px;
}
.respondent-preview-dialog{
  width:min(1040px,100%);
  max-height:calc(100vh - 44px);
  background:#f5f7fa;
  border:1px solid rgba(255,255,255,.72);
  border-radius:26px;
  box-shadow:0 30px 90px rgba(15,23,42,.28);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.respondent-preview-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  padding:20px 22px;
  background:rgba(255,255,255,.94);
  border-bottom:1px solid var(--line);
}
.respondent-preview-head h2{margin:0;font-size:23px;line-height:1.25}
.respondent-preview-head p{margin:4px 0 0;color:var(--muted)}
.respondent-preview-head .icon-button{font-size:26px;line-height:1;color:#334155;display:grid;place-items:center}
.respondent-preview-body{
  overflow:auto;
  padding:20px;
}
.preview-public-form{max-width:820px;margin:0 auto;padding:0}
.preview-public-head{margin-bottom:16px}
.preview-brand{margin-bottom:16px}
.preview-note{
  display:inline-flex;
  margin-top:10px;
  border-radius:999px;
  background:#eaf3ff;
  color:var(--primary);
  padding:5px 11px;
  font-size:12px;
  font-weight:900;
}
.preview-section{box-shadow:0 10px 26px rgba(20,35,60,.055)}
.preview-question-block label{font-size:16px}
.preview-submit-bar{margin-top:8px;border-radius:18px;padding:12px;background:rgba(245,247,250,.92)}
@media(max-width:760px){
  .auth-login-refined::before{opacity:.50;background-position:center top}
  .respondent-preview-backdrop{padding:10px}
  .respondent-preview-dialog{max-height:calc(100vh - 20px);border-radius:18px}
  .respondent-preview-head{padding:16px;align-items:flex-start}
  .respondent-preview-head h2{font-size:19px}
  .respondent-preview-body{padding:12px}
}

/* Login background visibility: clearer survey illustration */
.auth-login-refined::before{
  opacity:.82;
  filter:saturate(1.14) contrast(1.08);
}
.auth-login-refined::after{
  background:
    linear-gradient(90deg, rgba(255,255,255,.34) 0%, rgba(255,255,255,.18) 26%, rgba(255,255,255,.10) 50%, rgba(255,255,255,.18) 74%, rgba(255,255,255,.34) 100%),
    radial-gradient(circle at center, rgba(255,255,255,.06), rgba(255,255,255,.02) 54%, transparent 74%);
}
.auth-card-elegant{
  background:rgba(255,255,255,.92);
  border-color:rgba(255,255,255,.86);
  box-shadow:0 28px 78px rgba(18,45,84,.20);
}
@media(max-width:760px){
  .auth-login-refined::before{opacity:.72;background-position:center top}
  .auth-login-refined::after{
    background:linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,.10));
  }
}

/* Language switcher: TH/EN with flags */
.lang-switch{display:inline-flex;align-items:center;gap:5px;padding:4px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.82);box-shadow:0 8px 20px rgba(20,35,60,.06)}
.lang-btn{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 10px;color:#475569;font-size:12px;font-weight:900;text-decoration:none;line-height:1;border:1px solid transparent}
.lang-btn:hover{text-decoration:none;background:#f2f6fb;color:#1d4f91}.lang-btn.active{background:#101828;color:#fff;border-color:#101828}.lang-btn .flag{font-size:15px;line-height:1}.top-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.auth-lang-switch{position:fixed;top:20px;right:20px;z-index:3;background:rgba(255,255,255,.90);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.public-brand-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}.public-lang-switch{flex-shrink:0}.inline-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.inline-form{display:inline-flex;margin:0}.inline-form .btn{white-space:nowrap}

/* Login background: make survey illustration clearer while preserving readability */
.auth-login-refined::before{opacity:.92;filter:saturate(1.18) contrast(1.10)}
.auth-login-refined::after{background:linear-gradient(90deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.10) 25%,rgba(255,255,255,.04) 50%,rgba(255,255,255,.10) 75%,rgba(255,255,255,.26) 100%)}
.auth-card-elegant{background:rgba(255,255,255,.91);border-color:rgba(255,255,255,.88);box-shadow:0 28px 84px rgba(18,45,84,.22)}
@media(max-width:760px){.auth-lang-switch{top:12px;right:12px}.lang-btn{padding:6px 8px}.top-actions{gap:7px}.public-brand-row{align-items:flex-start;flex-direction:column}.auth-login-refined::before{opacity:.82}.auth-login-refined::after{background:linear-gradient(180deg,rgba(255,255,255,.20),rgba(255,255,255,.08))}}

/* System-wide alignment refinement: precise centering, consistent frames, polished actions */
button,.btn{align-items:center;justify-content:center;text-align:center;vertical-align:middle;min-height:40px}
.btn-sm{min-height:34px;padding-top:7px;padding-bottom:7px}
.icon-button{display:inline-grid!important;place-items:center!important;align-items:center!important;justify-content:center!important;padding:0!important;line-height:1!important;text-align:center;flex:0 0 auto;font-family:Arial,"Sarabun",sans-serif;font-weight:800}
.card-title{align-items:center}.card-title>div{min-width:0}.card-title h2,.card-title h3{line-height:1.25}.card-title p{line-height:1.45}
.actions-row,.inline-actions,.toolbar-left,.toolbar-right,.top-actions,.wys-top-actions,.wys-question-tools,.section-actions,.wys-section-actions,.qr-actions{align-items:center}
.actions-row>form,.inline-actions>form,.toolbar-left>form,.toolbar-right>form,.wys-top-actions>form{display:inline-flex;align-items:center;margin:0}.actions-row .btn,.inline-actions .btn,.toolbar .btn{white-space:nowrap}
.lang-switch{align-items:center;justify-content:center}.lang-btn{align-items:center;justify-content:center;min-height:30px}.lang-btn .flag{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px}
.role-pill,.badge{align-items:center;justify-content:center;line-height:1.15;min-height:26px}.field label{line-height:1.35}input,select,textarea{line-height:1.45}.table-wrap td{vertical-align:middle}.table-wrap th{vertical-align:middle}
.respondent-preview-head{align-items:center}.respondent-preview-head .icon-button{width:42px;height:42px;border-radius:14px;font-size:24px;background:#fff;border-color:#dce4ef;color:#243047}.respondent-preview-head .icon-button:hover{background:#f8fafc;border-color:#b9c7d8}.respondent-preview-dialog{border:1px solid rgba(203,213,225,.95)}

/* QR Code reliability: larger, high-contrast, centered, and phone-scan friendly */
.share-grid{align-items:stretch}.share-link-card,.qr-card{height:100%}.share-actions{justify-content:flex-start;gap:10px}.qr-card-title{margin-bottom:14px}.qr-box-readable{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;padding:22px;min-height:360px;border-style:solid;background:linear-gradient(180deg,#ffffff,#fbfdff)}
.qr-frame{width:min(292px,100%);aspect-ratio:1/1;display:grid;place-items:center;background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:16px;box-shadow:0 14px 34px rgba(15,23,42,.08)}
.qr-frame img{display:block;width:100%;height:auto;max-width:none;image-rendering:pixelated}.qr-url{width:100%;max-width:420px;text-align:center;word-break:break-all;color:#475569;font-size:13px;line-height:1.45;background:#f8fafc;border:1px solid #e5eaf1;border-radius:12px;padding:9px 11px}.qr-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}.qr-actions .btn{min-width:124px}.qr-box-readable .help{text-align:center;max-width:420px;line-height:1.45}
@media(max-width:760px){.card-title{align-items:flex-start}.share-actions,.qr-actions{align-items:stretch}.share-actions .btn,.share-actions form,.share-actions form .btn,.qr-actions .btn{width:100%}.qr-box-readable{min-height:0;padding:18px}.qr-frame{width:min(260px,100%)}}

/* Admin edit/delete safeguards for forms with no responses */
.response-count-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  min-height:28px;
  border-radius:999px;
  padding:4px 10px;
  font-weight:900;
  font-size:13px;
  line-height:1;
  border:1px solid var(--line);
  background:#f8fafc;
  color:#334155;
}
.response-count-pill.no-response{background:#ecfdf3;border-color:#bbf7d0;color:#087443}
.response-count-pill.has-response{background:#eff6ff;border-color:#bfdbfe;color:#1d4f91}
.action-note{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  border-radius:999px;
  padding:6px 10px;
  background:#f1f5f9;
  color:#64748b;
  font-size:12px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}
.form-row-actions{gap:8px;align-items:center}
.form-row-actions .btn-danger{box-shadow:none}
.wys-top-actions .response-count-pill{min-height:34px}
@media(max-width:760px){
  .form-row-actions{align-items:stretch}
  .form-row-actions .btn,.form-row-actions form,.form-row-actions form .btn,.form-row-actions .action-note{width:100%}
}

/* Public link access mode and logo consistency */
.brand-mark-survey{
  position:relative;
  background:linear-gradient(180deg,#25589c,#173f73)!important;
  color:transparent!important;
  overflow:hidden;
  flex:0 0 auto;
  box-shadow:0 10px 24px rgba(29,79,145,.18);
}
.brand-mark-survey .survey-logo-box{
  position:absolute;
  left:29%;top:23%;width:44%;height:54%;border-radius:18%;
  background:#fff;
}
.brand-mark-survey .survey-logo-box::before,
.brand-mark-survey .survey-logo-box::after{
  content:"";position:absolute;left:29%;right:16%;height:7%;border-radius:999px;background:#d7e4f6;
}
.brand-mark-survey .survey-logo-box::before{top:22%}
.brand-mark-survey .survey-logo-box::after{top:43%}
.brand-mark-survey .survey-logo-check{
  position:absolute;left:39%;top:39%;width:24%;height:14%;
  border-left:3px solid #1d4f91;border-bottom:3px solid #1d4f91;
  transform:rotate(-45deg);
}
.access-choice-inline{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.setting-card.access-mode-card{
  cursor:pointer;
  min-height:86px;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.setting-card.access-mode-card:hover{
  border-color:#b6c8df;
  background:#ffffff;
  box-shadow:0 8px 24px rgba(20,35,60,.06);
}
.setting-card.access-mode-card input[type="radio"]{
  width:18px;height:18px;accent-color:var(--primary);
}
.setting-card.access-mode-card:has(input:checked){
  border-color:rgba(29,79,145,.45);
  background:#f3f8ff;
  box-shadow:0 0 0 4px rgba(29,79,145,.08);
}
.share-access-choice{margin-top:8px}
.access-mode-panel{
  padding:14px;
  border:1px solid var(--line);
  background:#fbfdff;
  border-radius:16px;
}
.access-mode-current{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:32px;padding:5px 10px;border-radius:999px;
  font-size:12px;font-weight:900;
}
.access-mode-current.is-public{background:#e8f7ef;color:var(--success)}
.access-mode-current.is-login{background:#eaf3ff;color:var(--primary)}
.create-form-card .access-choice-inline{margin-top:14px}
@media(max-width:760px){
  .access-choice-inline{grid-template-columns:1fr}
  .setting-card.access-mode-card{min-height:auto}
}

/* Public response flow: public links should feel anonymous and frictionless */
.public-meta-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}
.public-sticky-actions{
  margin-top:26px;
}
.public-action-row{
  justify-content:flex-end;
}
.public-action-row .public-submit-btn{
  min-width:160px;
}
.thankyou-page{
  background:
    radial-gradient(circle at 12% 12%, rgba(29,79,145,.12), transparent 28%),
    radial-gradient(circle at 88% 84%, rgba(15,118,110,.10), transparent 28%),
    linear-gradient(135deg,#f3f7ff 0%,#fbfdff 48%,#effbf8 100%);
}
.thankyou-card{
  max-width:540px;
}
.thankyou-brand{
  margin-bottom:22px;
}
.thankyou-summary{
  margin-top:18px;
  border-radius:16px;
  background:#fbfdff;
}
.thankyou-note{
  margin:18px 0 0;
  line-height:1.55;
}
.thankyou-actions{
  justify-content:center;
}
@media(max-width:760px){
  .public-meta-row{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
  .public-sticky-actions{
    padding-left:0;
    padding-right:0;
  }
  .public-action-row{
    width:100%;
    align-items:stretch;
    justify-content:stretch;
  }
  .public-action-row .public-submit-btn,
  .public-action-row .btn{
    width:100%;
    min-height:52px;
    font-size:16px;
  }
  .thankyou-card{
    padding:24px 20px;
  }
  .thankyou-actions,
  .thankyou-actions .btn{
    width:100%;
  }
}


/* Public form badges: consistent sizing and anonymous indicator */
.public-meta-row > .badge,
.public-meta-row > .access-mode-current,
.public-meta-row > .public-identity-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  height:32px;
  min-width:112px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid transparent;
  box-sizing:border-box;
  font-size:12px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
  vertical-align:middle;
}
.public-meta-row > .badge{margin:0}
.public-meta-row > .access-mode-current{margin:0}
.public-identity-badge.is-anonymous{
  background:#fff7ed;
  color:#c2410c;
  border-color:#fed7aa;
}
.public-meta-row .public-period-text{
  display:inline-flex;
  align-items:center;
  min-height:32px;
}
@media(max-width:760px){
  .public-meta-row{
    align-items:flex-start;
    flex-direction:row;
    gap:8px;
  }
  .public-meta-row > .badge,
  .public-meta-row > .access-mode-current,
  .public-meta-row > .public-identity-badge{
    min-width:112px;
  }
}

/* Public form section refinement: make sections quiet and keep real questions prominent */
.public-section-compact{
  padding:0;
  overflow:hidden;
}
.public-section-compact.no-section-intro{
  padding-top:0;
}
.public-section-intro{
  padding:18px 24px 14px;
  background:linear-gradient(180deg,#fbfdff,#ffffff);
  border-bottom:1px solid #eef2f7;
}
.public-section-intro h2{
  margin:0;
  font-size:20px;
  line-height:1.35;
  font-weight:900;
  color:#172033;
}
.public-section-intro p{
  margin:6px 0 0;
  color:#64748b;
  font-size:14px;
  line-height:1.65;
}
.public-section-eyebrow{
  margin-bottom:5px;
  color:#64748b;
  font-size:12px;
  font-weight:900;
  letter-spacing:.02em;
}
.public-section-questions{
  display:block;
}
.public-question-block{
  padding:22px 24px;
  border-bottom:1px solid #eef2f7;
}
.public-question-block:last-child{
  border-bottom:0;
}
.public-question-label{
  display:block;
  margin:0 0 10px;
  font-size:16px;
  line-height:1.55;
  font-weight:900;
  color:#172033;
}
.public-question-label span:first-child{
  font-weight:900;
}
.public-question-help{
  margin:-4px 0 12px;
  font-size:13px;
  line-height:1.55;
}
.public-answer-area{
  margin-top:8px;
}
.public-answer-area .option-stack{
  gap:10px;
}
.public-answer-area .checkline{
  align-items:center;
  min-height:34px;
  gap:10px;
}
.public-answer-area .checkline input[type="radio"],
.public-answer-area .checkline input[type="checkbox"]{
  margin-top:0;
  flex:0 0 auto;
}
@media(max-width:760px){
  .public-section-intro{
    padding:14px 18px 10px;
  }
  .public-section-intro h2{
    font-size:17px;
  }
  .public-question-block{
    padding:20px 18px;
  }
  .public-question-label{
    font-size:15px;
    margin-bottom:8px;
  }
}


/* Creator identity mode option: make anonymous mode visible and understandable */
.creator-option-group{
  margin-top:16px;
  padding-top:2px;
}
.creator-option-title,
.builder-setting-subtitle{
  font-size:13px;
  font-weight:900;
  color:#334155;
  margin:0 0 8px;
}
.builder-setting-subtitle{
  grid-column:1 / -1;
  margin-top:4px;
}
.identity-setting-title,
.response-setting-title{
  margin-top:14px;
}
.identity-choice-inline,
.access-mode-list{
  align-items:stretch;
}
.identity-mode-card{
  position:relative;
}
.identity-mode-card.is-anonymous-choice:has(input:checked){
  border-color:#fdba74;
  background:#fff7ed;
  box-shadow:0 0 0 4px rgba(249,115,22,.10);
}
.identity-mode-card.is-anonymous-choice strong{
  color:#c2410c;
}
.identity-mode-card.is-anonymous-choice:has(input:checked)::after{
  content:"Anonymous";
  position:absolute;
  top:10px;
  right:12px;
  border-radius:999px;
  padding:4px 8px;
  background:#fed7aa;
  color:#9a3412;
  font-size:11px;
  font-weight:900;
}
.form-access-badges{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.badge-anonymous{
  background:#fff7ed;
  color:#c2410c;
  border:1px solid #fed7aa;
}
@media(max-width:760px){
  .identity-mode-card.is-anonymous-choice:has(input:checked)::after{
    position:static;
    margin-left:auto;
    align-self:flex-start;
  }
  .creator-option-title,
  .builder-setting-subtitle{font-size:14px}
}

/* Public form and respondent preview: clear section hierarchy and question numbering */
.public-question-label{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:start;
  gap:12px;
}
.public-question-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:54px;
  min-height:32px;
  padding:5px 12px;
  border-radius:999px;
  background:#edf4ff;
  color:#1d4f91;
  font-size:13px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}
.public-question-text{
  display:block;
  min-width:0;
  padding-top:2px;
  font-weight:900;
}
.public-section-compact.no-section-intro .public-section-questions{
  padding-top:0;
}
.preview-section h2{
  margin:0;
}
.preview-meta-row{
  margin-top:12px;
}
.preview-section.public-section-compact{
  box-shadow:0 10px 26px rgba(20,35,60,.055);
}
.preview-question-block .public-answer-area{
  margin-top:10px;
}
.respondent-preview-body .public-section-intro h2{
  font-size:18px;
}
@media(max-width:760px){
  .public-question-label{
    grid-template-columns:1fr;
    gap:8px;
  }
  .public-question-number{
    min-width:0;
    width:max-content;
    min-height:29px;
    padding:5px 10px;
    font-size:12px;
  }
  .public-question-text{
    padding-top:0;
  }
}


/* Standardized response mode: avoid contradictory access/identity settings */
.response-mode-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
}
.response-mode-card{
  min-height:118px;
  position:relative;
}
.response-mode-card strong{
  font-size:15px;
}
.response-mode-card em{
  line-height:1.45;
}
.response-mode-card.is-public-anonymous:has(input:checked){
  border-color:#fdba74;
  background:#fff7ed;
  box-shadow:0 0 0 4px rgba(249,115,22,.10);
}
.response-mode-card.is-public-anonymous:has(input:checked) strong{color:#c2410c}
.response-mode-card.is-login-identified:has(input:checked){
  border-color:rgba(29,79,145,.45);
  background:#f3f8ff;
  box-shadow:0 0 0 4px rgba(29,79,145,.08);
}
.mode-guidance{
  margin:2px 0 10px;
  color:#64748b;
  font-size:13px;
}
.mode-guidance-card{
  border:1px solid #e5eaf1;
  background:#fbfdff;
  border-radius:14px;
  padding:11px 13px;
  margin-bottom:10px;
}
.mode-note{
  margin-top:10px;
  border-radius:14px;
  padding:10px 12px;
  background:#fffdf5;
  border:1px solid #fde68a;
  color:#7c4a03;
  font-size:13px;
  line-height:1.5;
}
.login-only-setting.is-muted-setting{
  opacity:.62;
}
.login-only-setting.is-muted-setting input{
  background:#f8fafc;
}
.public-identity-badge.is-identified{
  background:#eef2f7;
  color:#334155;
  border:1px solid #d9e1ec;
}
@media(max-width:760px){
  .response-mode-grid{grid-template-columns:1fr}
  .response-mode-card{min-height:auto}
}

/* UI consistency pass: buttons, controls, dialogs, and responsive navigation */
:root{
  --control-h:42px;
  --control-h-sm:36px;
  --control-pad-x:14px;
}
button,.btn,.icon-button,.lang-btn,.role-pill,.badge,.access-mode-current,.public-identity-badge,.response-count-pill,.action-note{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  vertical-align:middle;
  box-sizing:border-box;
}
.btn,button.btn{
  min-height:var(--control-h);
  padding:0 var(--control-pad-x);
  border-radius:12px;
  line-height:1;
  white-space:nowrap;
  text-align:center;
}
.btn-sm,button.btn-sm,.action-btn.btn-sm{
  min-height:var(--control-h-sm);
  padding:0 12px;
  border-radius:10px;
  font-size:13px;
}
.btn-danger-soft{
  color:var(--danger);
  background:#fff6f5;
  border:1px solid #ffd4cf;
}
.btn-danger-soft:hover{
  background:#fff0ee;
  color:#991b1b;
}
.action-btn{gap:7px;min-width:82px}
.inline-actions,.form-row-actions,.actions-row,.toolbar-left,.toolbar-right,.top-actions,.wys-top-actions,.wys-question-tools,.wys-section-actions,.qr-actions{
  align-items:center;
}
.inline-actions,.form-row-actions{gap:8px;flex-wrap:wrap}
.inline-form{display:inline-flex;align-items:center;margin:0}
.icon-button,.modal-close-button{
  width:42px;height:42px;min-width:42px;min-height:42px;
  padding:0;border-radius:13px;font-size:22px;line-height:1;
}
.modal-close-button{font-size:26px;color:#536176;background:#fff}
.modal-close-button:hover{color:var(--danger);background:#fff5f5;border-color:#ffd4cf}
.wys-question-toolbar{align-items:center}
.wys-question-tools{min-height:44px}
.wys-question-tools .type-picker-label{height:var(--control-h);display:inline-flex;align-items:center;margin:0}
.wys-type-select{height:var(--control-h);min-height:var(--control-h)}
.wys-required-pill,.control-chip{
  min-height:var(--control-h);
  height:var(--control-h);
  padding:0 13px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0;
  line-height:1;
}
.wys-required-pill input,.control-chip input{width:16px;height:16px;margin:0;flex:0 0 auto}
.required-control span{line-height:1;font-weight:900}
.wys-question-tools .btn,.wys-question-tools .wys-required-pill{height:var(--control-h);min-height:var(--control-h)}
.wys-section-actions .btn,.wys-add-section-wrap .btn{min-height:44px}
.add-option-btn{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  line-height:1;
}
.option-remove{
  width:36px;height:36px;min-width:36px;min-height:36px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:20px;line-height:1;padding:0;margin:0;
}
.wys-option-row{align-items:center}
.table-wrap .btn,.table-wrap button.btn{min-height:var(--control-h-sm)}
.card-title{align-items:center}
.top-actions{min-height:44px}
.lang-switch{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:4px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 22px rgba(20,35,60,.06)}
.lang-btn{height:34px;min-width:72px;padding:0 12px;border-radius:999px;text-decoration:none;font-weight:900;color:#4b5870;gap:7px}
.lang-btn.active{background:#111827;color:#fff;box-shadow:0 8px 18px rgba(17,24,39,.14)}
.lang-btn:hover{text-decoration:none;background:#f5f8fb}
.lang-btn.active:hover{background:#111827;color:#fff}
.lang-btn .flag{font-size:17px;line-height:1}
.brand-name,.auth-brand-row h1{letter-spacing:.1px}
.mobile-menu-button{display:none!important}
.side-backdrop{display:none}

.es-confirm-backdrop{
  position:fixed;inset:0;z-index:1000;
  background:rgba(15,23,42,.42);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
  padding:20px;
}
.es-confirm-backdrop.show{opacity:1;pointer-events:auto}
.es-confirm-dialog{
  width:min(440px,calc(100vw - 40px));
  margin:13vh auto 0;
  background:#fff;
  border:1px solid rgba(226,232,240,.95);
  border-radius:24px;
  box-shadow:0 28px 80px rgba(15,23,42,.24);
  padding:24px;
  transform:translateY(14px) scale(.96);
  opacity:.5;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .22s ease;
}
.es-confirm-backdrop.show .es-confirm-dialog{transform:translateY(0) scale(1);opacity:1}
.es-confirm-icon{
  width:52px;height:52px;border-radius:18px;
  display:grid;place-items:center;
  font-size:28px;font-weight:900;margin:0 0 14px;
}
.es-confirm-icon.is-danger{background:#fff0ee;color:var(--danger)}
.es-confirm-icon.is-warning{background:#fffbeb;color:#92400e}
.es-confirm-content h2{margin:0;font-size:22px;line-height:1.28;color:#172033}
.es-confirm-content p{margin:8px 0 0;color:#64748b;line-height:1.6}
.es-confirm-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}
.es-confirm-open{overflow:hidden}

.side-panel{will-change:transform}
@media(min-width:1101px){
  .side-panel{left:auto!important;transform:none!important}
  .mobile-menu-button{display:none!important}
  .side-backdrop{display:none!important}
  body.sidebar-open{overflow:auto}
}
@media(max-width:1100px){
  .app-shell{display:block}
  .mobile-menu-button{display:inline-flex!important}
  .side-panel{
    position:fixed;top:0;left:0;bottom:0;height:100vh;
    transform:translateX(-104%);
    transition:transform .22s cubic-bezier(.2,.8,.2,1);
    box-shadow:24px 0 55px rgba(15,23,42,.22);
    z-index:950;
  }
  .side-panel.open{transform:translateX(0);left:0}
  .side-backdrop{
    display:block;position:fixed;inset:0;z-index:930;
    border:0;background:rgba(15,23,42,.36);opacity:0;pointer-events:none;
    transition:opacity .18s ease;
  }
  body.sidebar-open .side-backdrop{opacity:1;pointer-events:auto}
  body.sidebar-open{overflow:hidden}
  .top-bar{grid-template-columns:auto minmax(0,1fr) auto;display:grid;align-items:center}
  .top-bar>div:first-of-type{min-width:0}
  .top-bar h1,.top-bar p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .top-actions{justify-content:flex-end;gap:8px}
}
@media(max-width:760px){
  .top-bar{padding:12px 14px;gap:10px;min-height:72px}
  .top-actions .role-pill{display:none}
  .lang-btn{min-width:62px;padding:0 10px}
  .wys-question-toolbar{align-items:stretch;gap:12px}
  .wys-question-tools{display:grid;grid-template-columns:1fr;align-items:stretch;width:100%;gap:9px}
  .wys-question-tools .type-picker-label{height:auto;min-height:0}
  .wys-question-tools .btn,.wys-question-tools .wys-required-pill,.wys-type-select{width:100%;justify-content:center}
  .wys-required-pill{border-radius:12px}
  .wys-section-actions{align-items:stretch}
  .wys-section-actions .btn{width:100%;justify-content:center}
  .inline-actions,.form-row-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;white-space:normal}
  .inline-actions .btn,.inline-actions form,.inline-actions button{width:100%;justify-content:center}
  .action-btn{min-width:0}
  .es-confirm-dialog{margin:18vh auto 0;padding:22px;border-radius:22px}
  .es-confirm-actions{display:grid;grid-template-columns:1fr;gap:9px}
  .es-confirm-actions .btn{width:100%;justify-content:center}
}


/* Status explanation and safer form lifecycle actions */
.status-help-strip{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:0 0 14px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  color:#475569;
  font-size:13px;
}
.status-help-strip strong{color:#1e293b;white-space:nowrap}
.status-help-strip span{line-height:1.5}
@media(max-width:760px){.status-help-strip{display:block}.status-help-strip strong{display:block;margin-bottom:4px;white-space:normal}}