:root{
  --blue:#0C5FEF;--blue-d:#0A4FCB;--blue-s:#EAF1FF;--navy:#0F1B2D;--slate:#5B6472;
  --line:#E3E8EF;--paper:#F1F4F9;--card:#fff;--soft:#FAFBFC;
  --green:#15803D;--green-t:#E8F6EC;--red:#B42318;--red-t:#FCE9E9;--amber:#B45309;--amber-t:#FEF3E2;
  --sw:250px;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--paper);color:var(--navy);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased;}
a{color:var(--blue);text-decoration:none;}
.app{display:flex;min-height:100vh;}
.sb{width:var(--sw);flex-shrink:0;background:var(--card);border-right:1px solid var(--line);position:fixed;top:0;left:0;bottom:0;display:flex;flex-direction:column;overflow:hidden;}
.sb-logo{padding:16px 18px;border-bottom:1px solid var(--line);}
.sb-logo img{height:38px;width:auto;display:block;}
.sb-scroll{flex:1;min-height:0;overflow-y:auto;padding:10px;display:flex;flex-direction:column;}
.cta{display:flex;align-items:center;justify-content:center;gap:8px;padding:11px;border-radius:9px;background:var(--blue);color:#fff;font-weight:700;font-size:.8rem;border:none;cursor:pointer;margin:6px 0 12px;font-family:inherit;}
.cta:hover{background:var(--blue-d);text-decoration:none;}
.sl{font-size:.62rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--slate);padding:6px 8px 3px;}
.nl{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:7px;font-size:.8rem;font-weight:500;color:var(--slate);}
.nl:hover{background:var(--paper);color:var(--navy);text-decoration:none;}
.nl.on{background:rgba(12,95,239,.12);color:var(--blue);font-weight:700;}
.sb-bot{margin-top:auto;}
.ma{margin-left:var(--sw);flex:1;min-width:0;}
.tb{height:56px;background:var(--card);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:20;}
.tb h1{font-size:.95rem;}
.pg{padding:22px;max-width:1080px;}
.wrap-narrow{max-width:560px;margin:0 auto;padding:22px;}

.hero{background:linear-gradient(135deg,#0C5FEF,#3B7BF5);color:#fff;border-radius:16px;padding:24px 26px;margin-bottom:20px;}
.hero h2{font-size:1.25rem;margin-bottom:4px;}
.hero p{font-size:.82rem;opacity:.9;}

.sg{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;}
@media(max-width:820px){.sg{grid-template-columns:repeat(2,1fr);}}
.stat{background:var(--card);border:1px solid var(--line);border-radius:11px;padding:15px;}
.stat .v{font-size:1.35rem;font-weight:800;}
.stat .l{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--slate);margin-top:4px;}

.pn{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:16px;}
.pn-t{font-size:.85rem;font-weight:700;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;}
.ph{margin-bottom:18px;}
.ph h2{font-size:1.05rem;}
.ph p{font-size:.78rem;color:var(--slate);margin-top:2px;}
.sect{font-size:.85rem;font-weight:800;margin-bottom:12px;display:flex;align-items:center;gap:7px;}

.btn{display:inline-flex;align-items:center;gap:6px;background:var(--blue);color:#fff;border:none;border-radius:8px;font-weight:700;font-size:.8rem;padding:9px 15px;cursor:pointer;font-family:inherit;}
.btn:hover{background:var(--blue-d);text-decoration:none;}
.btn.o{background:var(--card);border:1.5px solid var(--line);color:var(--navy);font-weight:600;}
.btn.o:hover{border-color:var(--blue);color:var(--blue);background:var(--soft);}
.btn.sm{padding:6px 11px;font-size:.74rem;}
.btn.danger{background:var(--card);border:1.5px solid #F3B4B4;color:var(--red);}
.btn.danger:hover{background:var(--red-t);}
.btn.block{width:100%;justify-content:center;padding:12px;}

label.fl{display:block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--slate);margin-bottom:5px;}
input[type=text],input[type=password],input[type=email],textarea,select{width:100%;font-family:inherit;font-size:.86rem;padding:9px 12px;border:1.5px solid var(--line);border-radius:8px;background:var(--card);color:var(--navy);outline:none;margin-bottom:14px;}
input:focus,textarea:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-s);}
textarea{resize:vertical;min-height:60px;}
.ro{background:var(--soft);}

.ch{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:100px;font-size:.68rem;font-weight:700;}
.ch.gray{background:var(--paper);color:var(--slate);}
.ch.green{background:var(--green-t);color:var(--green);}
.ch.red{background:var(--red-t);color:var(--red);}
.ch.amber{background:var(--amber-t);color:var(--amber);}

.srow{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:15px 17px;margin-bottom:11px;flex-wrap:wrap;}
.srow h3{font-size:.92rem;}
.srow .meta{font-size:.74rem;color:var(--slate);margin-top:4px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.srow .meta .d{width:3px;height:3px;border-radius:50%;background:var(--line);}
.srow .act{display:flex;gap:6px;flex-wrap:wrap;}

.tbl{width:100%;border-collapse:collapse;}
.tbl th{text-align:left;font-size:.64rem;text-transform:uppercase;letter-spacing:.04em;color:var(--slate);font-weight:700;padding:0 12px 10px;border-bottom:1px solid var(--line);}
.tbl td{padding:11px 12px;border-bottom:1px solid var(--line);font-size:.82rem;}
.tbl tr:last-child td{border-bottom:none;}

.abar{height:9px;background:var(--paper);border-radius:100px;overflow:hidden;}
.abar>i{display:block;height:100%;background:var(--blue);border-radius:100px;}
.arow{margin-bottom:11px;}
.ahead{display:flex;justify-content:space-between;font-size:.82rem;margin-bottom:5px;}
.ahead .c{color:var(--slate);font-family:monospace;font-size:.72rem;}
.alist{max-height:280px;overflow:auto;display:flex;flex-direction:column;gap:8px;}
.alist .a{background:var(--paper);border-left:3px solid var(--blue);border-radius:8px;padding:9px 12px;font-size:.82rem;}

.linkbox{display:flex;gap:8px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:8px 10px;flex-wrap:wrap;}
.linkbox input{border:none;background:none;padding:0;margin:0;font-family:monospace;font-size:.78rem;color:var(--blue);flex:1;box-shadow:none;}
.note{background:var(--blue-s);border:1px solid #CFE0FD;color:var(--blue-d);border-radius:9px;padding:11px 14px;font-size:.8rem;margin-bottom:16px;}
.idopt{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line);}
.idopt:first-of-type{border-top:none;padding-top:2px;}
.idopt .t{font-size:.84rem;font-weight:600;}
.idopt .d{font-size:.72rem;color:var(--slate);}
.idopt input[type=checkbox]{width:18px;height:18px;accent-color:var(--blue);margin:0;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media(max-width:520px){.grid2{grid-template-columns:1fr;}}
.empty{text-align:center;padding:40px;color:var(--slate);}
.cbox{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.cinfo{background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:6px 11px;font-size:.78rem;}
.qcard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:12px;}
.qcard.err{border-color:#F3B4B4;box-shadow:0 0 0 3px var(--red-t);}
.opt{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:9px;padding:10px 13px;margin-bottom:8px;cursor:pointer;font-size:.85rem;}
.prog{height:6px;background:var(--line);border-radius:100px;overflow:hidden;margin:6px 0 18px;}
.prog>i{display:block;height:100%;background:var(--blue);border-radius:100px;}
.err-text{color:var(--red);font-size:.72rem;margin-top:6px;font-weight:600;}

/* builder question editor */
.qedit{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:12px;display:flex;gap:12px;}
.qedit .handle{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--slate);}
.qedit .handle button{background:none;border:none;color:var(--slate);cursor:pointer;font-size:1rem;line-height:1;}
.qedit .body{flex:1;min-width:0;}
.qchip{display:inline-block;background:var(--blue-s);color:var(--blue);font-size:.7rem;font-weight:700;padding:3px 10px;border-radius:100px;margin-bottom:8px;}
.optrow{display:flex;gap:8px;align-items:center;margin-bottom:7px;}
.optrow input{margin:0;}
.optrow button{background:none;border:none;color:var(--slate);cursor:pointer;}
.typebar{display:flex;flex-wrap:wrap;gap:8px;}
.typebar button{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:.78rem;font-weight:600;cursor:pointer;color:var(--navy);font-family:inherit;}
.typebar button:hover{border-color:var(--blue);color:var(--blue);}
.chk{display:flex;align-items:center;gap:7px;font-size:.8rem;color:var(--slate);cursor:pointer;}
.chk input{width:auto;margin:0;}
.qfoot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);}