:root{
  --bg:#ffffff;--ink:#111111;--muted:#777;--line:#e8e8e8;--soft:#f8f8f8;
  --accent:#151515;--ok:#13b981;--warn:#f59e0b;--danger:#ef476f;--blue:#12a7e4;
  --radius:18px;--shadow:0 10px 30px rgba(0,0,0,.04)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Estedad,Tahoma,"Segoe UI",Arial,sans-serif;line-height:1.8}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid #eee}
.topbar-inner{max-width:1060px;margin:auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:10px;direction:ltr}.brand strong{font-size:20px;letter-spacing:.5px}.brand span{font-size:12px;color:#666;letter-spacing:1px}
.lang-switch{display:flex;direction:ltr;border:1px solid #ddd;border-radius:999px;padding:3px;background:#fff}
.lang-switch button{border:0;background:transparent;border-radius:999px;padding:6px 14px;color:#666}
.lang-switch button.active{background:#151515;color:#fff}
.progress-wrap{max-width:1060px;margin:auto;padding:0 24px 10px}.progress-meta{font-size:12px;color:#777;margin-bottom:5px}
.progress{height:5px;background:#f0f0f0;border-radius:10px;overflow:hidden}.progress span{display:block;width:0;height:100%;background:#151515;transition:width .25s ease}
.page-shell{max-width:850px;margin:0 auto;padding:46px 24px 70px}
.intro{text-align:center;max-width:720px}.intro-icon{width:48px;height:48px;border-radius:14px;background:#151515;color:#fff;display:grid;place-items:center;margin:0 auto 18px;font-size:24px}
h1,h2,h3,p{margin-top:0}.intro h1{font-size:34px;margin-bottom:4px}.lead{font-size:18px;color:#666}.muted{color:#888}
.guide-card{border:1px solid #ddd;border-radius:18px;padding:22px;text-align:right;margin:28px auto 20px;box-shadow:var(--shadow)}
.guide-card h3{font-size:15px;margin-bottom:6px}.guide-card p{font-size:14px;color:#666;margin-bottom:14px}
.scale-preview{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;direction:ltr}.scale-preview span{border:1px solid #ddd;border-radius:9px;padding:8px;text-align:center;font-weight:700}.guide-card small{display:block;color:#888;margin-top:12px}
.notice{background:#fff9e9;border:1px solid #fff0c7;color:#9b6400;border-radius:14px;padding:12px 18px;margin:20px 0;font-size:13px}
.primary-btn,.secondary-btn{border-radius:999px;padding:11px 24px;border:1px solid #161616;font-weight:700}
.primary-btn{background:#161616;color:white}.secondary-btn{background:#fff;color:#161616}
.section-head{margin-bottom:28px}.section-kicker{font-size:12px;color:#888;margin-bottom:4px}.section-head h2{font-size:28px;margin-bottom:8px}.section-head p{color:#888}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.field.full{grid-column:1/-1}
.field label{display:block;font-weight:700;font-size:14px;margin-bottom:7px}.req{color:#e33}
.field input,.field textarea,.field select{width:100%;border:1px solid #ddd;border-radius:10px;background:#fff;padding:12px 13px;outline:none;transition:.2s}
.field textarea{min-height:92px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:#111;box-shadow:0 0 0 3px rgba(0,0,0,.05)}
.subgroup{background:#fafafa;border-radius:12px;padding:10px 14px;font-weight:800;margin:26px 0 12px}
.question-list{display:grid;gap:14px}.question-card{border:1px solid #e1e1e1;border-radius:16px;padding:18px 20px;background:white;box-shadow:0 2px 10px rgba(0,0,0,.018)}
.question-text{font-weight:700;font-size:15px}.question-number{color:#999;margin-inline-end:7px}
.rating-row{display:flex;gap:8px;direction:ltr;margin-top:12px;flex-wrap:wrap}.rating-row button{min-width:48px;height:42px;background:#fff;border:1px solid #ddd;border-radius:9px;font-weight:800}.rating-row button.selected{background:#151515;color:#fff;border-color:#151515}
.rating-caption{font-size:12px;color:#777;margin-top:6px;min-height:18px}
.nav-row{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:28px}
.error-box{background:#fff1f3;border:1px solid #ffd0d9;color:#a51d3a;padding:12px 14px;border-radius:12px;margin:14px 0}
.save-note{font-size:12px;color:#999;text-align:center;margin-top:14px}
.result-shell{max-width:900px}.result-hero{background:linear-gradient(135deg,#131313,#383838);color:white;border-radius:18px;padding:26px 30px;display:grid;grid-template-columns:1fr auto;gap:25px;align-items:center}
.result-score{font-size:54px;font-weight:900;line-height:1}.result-score small{font-size:12px;font-weight:400;display:block;color:#ddd;margin-bottom:6px}.stage{font-size:25px;font-weight:800}.result-tag{color:#ddd;font-size:13px}
.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}.summary-card{border:1px solid #e2e2e2;border-radius:15px;padding:16px}.summary-card .eyebrow{font-size:12px;color:#888}.summary-card strong{display:block;margin-top:4px}
.flags{border:1px solid #eee;border-radius:16px;padding:18px;margin-top:18px}.flag-list{display:flex;gap:8px;flex-wrap:wrap}.flag{background:#fff0f3;color:#d22f55;border-radius:999px;padding:6px 10px;font-size:12px}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}.rank-card{border:1px solid #eee;border-radius:16px;padding:18px}.rank-card ol{margin:10px 0 0;padding-inline-start:22px}
.dimension-box{border:1px solid #e7e7e7;border-radius:18px;padding:20px;margin-top:18px}.dimension-title{display:flex;justify-content:space-between;gap:12px;align-items:center}.dimension-title strong{font-size:16px}.status-pill{font-size:11px;border-radius:999px;background:#f1f1f1;padding:4px 9px}
.bar{height:7px;background:#f2f2f2;border-radius:12px;overflow:hidden;margin:10px 0 8px}.bar span{height:100%;display:block;background:#15a6df;border-radius:12px}.dimension-meta{font-size:12px;color:#888}
.dimension-analysis{margin-top:14px;background:#fafafa;border-radius:12px;padding:14px;font-size:13px}.dimension-analysis b{display:block;margin-bottom:4px}.dimension-actions{margin:8px 0 0;padding-inline-start:20px}
.review-note{margin-top:20px;background:#fafafa;border:1px solid #eee;border-radius:15px;padding:17px;color:#666;font-size:13px;text-align:center}
.result-actions{display:flex;justify-content:center;gap:10px;margin-top:22px;flex-wrap:wrap}
.saving{text-align:center;padding:70px 20px}.spinner{width:42px;height:42px;border:4px solid #eee;border-top-color:#111;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 16px}@keyframes spin{to{transform:rotate(360deg)}}
.offline-warning{background:#fff8e8;border:1px solid #ffe2a7;color:#8b5c00;padding:12px;border-radius:12px;margin-top:16px}
@media(max-width:760px){
  .topbar-inner{padding:12px 16px}.brand span{display:none}.page-shell{padding:30px 15px 60px}.intro h1{font-size:28px}
  .form-grid,.summary-grid,.twocol{grid-template-columns:1fr}.field.full{grid-column:auto}
  .question-card{padding:15px}.question-text{font-size:14px}.rating-row button{flex:1;min-width:40px}
  .result-hero{grid-template-columns:1fr;text-align:center}.result-score{font-size:48px}
  .dimension-title{align-items:flex-start;flex-direction:column}
}
[dir="ltr"] .question-number{margin-right:7px;margin-left:0}