:root { color-scheme:dark; --ink:#f7f2ff; --muted:#b8afc5; --muted-2:#81778e; --accent:#a879ff; --accent-dark:#7046d9; --cta:#27cbb8; --cta-dark:#0d7f73; --line:rgba(225,210,255,.14); --line-strong:rgba(225,210,255,.24); --bg:#0d0913; --surface:#17111f; --surface-2:#21182c; --card:rgba(23,17,31,.96); --card-2:#21182c; --card-3:#120d1a; --danger:#ff7896; }
* { box-sizing:border-box; }
body { min-height:100vh; margin:0; color:var(--ink); background:radial-gradient(circle at 92% 0,rgba(168,121,255,.2),transparent 25rem),radial-gradient(circle at -8% 44%,rgba(83,52,130,.18),transparent 28rem),linear-gradient(180deg,#1a1125 0%,#120c1a 44%,var(--bg) 100%); font-family:Montserrat,Arial,sans-serif; }
body::before { position:fixed; inset:0; z-index:0; pointer-events:none; background-image:linear-gradient(rgba(225,210,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(225,210,255,.022) 1px,transparent 1px); background-size:38px 38px; content:""; mask-image:linear-gradient(to bottom,black,transparent 82%); }
body::after { position:fixed; inset:8vh -2vw; z-index:0; pointer-events:none; color:rgba(199,169,255,.025); content:"✓  ·────·  ✓\A       │\A       ✓       ·────· ✓"; white-space:pre; font-family:Furore,"Russo One",sans-serif; font-size:clamp(42px,9vw,90px); line-height:1.8; transform:rotate(-5deg); }
button,select,input,textarea { font:inherit; }
button { color:inherit; cursor:pointer; }
.shell { position:relative; z-index:1; width:min(940px,100%); margin:auto; padding:calc(18px + env(safe-area-inset-top)) 16px 80px; }
header { display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px; margin-bottom:24px; }
h1,h2,p { margin:0; }
h1 { font-family:Furore,"Russo One",sans-serif; font-size:clamp(34px,9vw,52px); font-weight:400; line-height:1; letter-spacing:.025em; text-shadow:0 0 28px rgba(168,121,255,.34); }
h2 { font-size:20px; }
.eyebrow { margin-bottom:5px; color:#c7a9ff; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.back { display:inline-block; margin-bottom:8px; color:#c7a9ff; text-decoration:none; font-size:9px; font-weight:750; }
.subtitle { margin-top:8px; color:var(--muted); font-size:10px; }
.primary,.soft,.danger,.action-tab,.variant-tab,.icon-button { border:0; border-radius:12px; padding:11px 15px; font-weight:700; }
.primary { color:white; background:linear-gradient(145deg,var(--accent),var(--accent-dark)); box-shadow:0 10px 28px rgba(112,70,217,.28); }
.primary:disabled { opacity:.55; }
.soft,.variant-tab,.action-tab { color:#e6d8ff; background:rgba(168,121,255,.12); }
.danger { color:var(--danger); background:rgba(255,120,150,.12); }
.toolbar,.variant-bar,.panel,.history-panel { border:1px solid var(--line); border-radius:20px; background:linear-gradient(145deg,rgba(33,24,44,.97),rgba(18,13,26,.98)); box-shadow:0 18px 48px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.025); backdrop-filter:blur(16px); }
.toolbar { display:flex; align-items:end; justify-content:space-between; gap:16px; padding:16px; }
.toolbar label { display:grid; min-width:min(360px,100%); gap:7px; font-size:12px; font-weight:700; }
select,input,textarea { width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:11px; color:var(--ink); background:var(--card-2); }
select option { color:var(--ink); background:var(--card-2); }
textarea { min-height:46px; resize:vertical; }
.actions { display:flex; gap:7px; }
.action-tab.active,.variant-tab.active { color:white; background:linear-gradient(145deg,var(--accent),var(--accent-dark)); box-shadow:0 8px 22px rgba(112,70,217,.24); }
.variant-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; margin:14px 0; }
.variant-tabs { display:flex; flex-wrap:wrap; gap:7px; }
.variant-tab { min-width:43px; }
.panel { padding:18px; margin-top:14px; }
.panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.item-list { display:grid; gap:10px; }
.empty { padding:16px; border:1px dashed var(--line); border-radius:12px; color:var(--muted); text-align:center; }
.edit-row { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:9px; }
.edit-row.question { grid-template-columns:34px minmax(0,1fr) 130px auto; }
.question-fields { display:grid; gap:8px; }
.question-fields textarea:last-child { border-color:rgba(168,121,255,.3); background:rgba(168,121,255,.07); }
.number { display:grid; width:30px; height:30px; place-items:center; border-radius:50%; color:#c7a9ff; background:rgba(168,121,255,.14); font-weight:800; }
.row-actions { display:flex; gap:4px; }
.icon-button { padding:7px 9px; color:var(--ink); background:rgba(168,121,255,.12); }
.icon-button.remove { color:var(--danger); }
.bottom-actions { display:flex; justify-content:space-between; margin:16px 0; }
.history-panel { padding:18px; }
.history-panel summary { cursor:pointer; font-weight:800; }
.hint { margin:10px 0; color:var(--muted); font-size:12px; }
.history-list { display:grid; gap:8px; }
.history-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-top:1px solid var(--line); }
.history-row small { display:block; margin-top:3px; color:var(--muted); }
.notice { padding:13px 16px; margin-bottom:14px; border-radius:13px; color:#87f2bc; background:rgba(110,242,178,.13); font-weight:600; }
.notice.error { color:var(--danger); background:rgba(255,120,150,.13); }
dialog { width:min(560px,calc(100% - 28px)); padding:20px; border:1px solid var(--line); border-radius:20px; color:var(--ink); background:#17111f; box-shadow:0 20px 80px rgba(0,0,0,.52); }
dialog::backdrop { background:rgba(0,13,17,.76); backdrop-filter:blur(6px); }
.dialog-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.preview-block { margin-top:18px; }
.preview-block h3 { margin-bottom:8px; }
.preview-block li { margin:7px 0; }
@media(max-width:680px) {
  .shell { padding:18px 12px 60px; }
  header { grid-template-columns:1fr; }
  header .primary { width:100%; }
  .toolbar { align-items:stretch; flex-direction:column; }
  .actions button { flex:1; }
  .edit-row.question { grid-template-columns:30px minmax(0,1fr); }
  .edit-row.question select,.edit-row.question .row-actions { grid-column:2; }
  .edit-row:not(.question) { grid-template-columns:30px minmax(0,1fr); }
  .edit-row:not(.question) .row-actions { grid-column:2; }
}