:root {
    --primary:#0d3b6e; --accent:#d4a017; --light:#f0f4fa;
    --correct:#145a32; --wrong:#922b21; --orange:#d35400;
    --border:#c5cfe0; --white:#ffffff; --shadow:rgba(0,0,0,0.15);
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  body{font-family:'Segoe UI',Tahoma,sans-serif;background:var(--light);color:#1a1a2e;line-height:1.6;}

  
  #splash{
    min-height:100vh;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(145deg,#0d3b6e 0%,#1a5276 50%,#154360 100%);
    padding:16px;
  }
  .splash-box{
    background:var(--white);border-radius:18px;padding:42px 50px;
    max-width:540px;width:100%;box-shadow:0 16px 48px rgba(0,0,0,0.35);
    text-align:center;
  }
  .splash-icon{font-size:54px;margin-bottom:12px;}
  .splash-box h1{color:var(--primary);font-size:1.55rem;line-height:1.35;margin-bottom:6px;}
  .splash-box h2{color:var(--accent);font-size:1.05rem;font-weight:600;margin-bottom:22px;}
  .meta-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:10px;
    margin-bottom:22px;text-align:left;
  }
  .meta-cell{
    background:#edf2f9;border-radius:8px;padding:10px 13px;
    font-size:.84rem;border-left:3px solid var(--accent);
  }
  .meta-cell b{display:block;color:var(--primary);margin-bottom:2px;font-size:.82rem;}
  .splash-box input[type=text]{
    width:100%;padding:13px 16px;border:2px solid #bbc8dc;
    border-radius:9px;font-size:1rem;margin-bottom:6px;
    transition:border-color .2s;outline:none;
  }
  .splash-box input[type=text]:focus{border-color:var(--primary);}
  #splashErr{color:var(--wrong);font-size:.88rem;margin-bottom:10px;display:none;}
  .splash-box button{
    width:100%;padding:14px;background:var(--primary);color:#fff;
    border:none;border-radius:9px;font-size:1.06rem;font-weight:700;
    cursor:pointer;letter-spacing:.5px;transition:background .2s,transform .1s;
  }
  .splash-box button:hover{background:#1a5276;transform:translateY(-1px);}
  .disclaimer{font-size:.75rem;color:#888;margin-top:14px;}

  
  #examWrap{display:none;}
  #stickyBar{
    position:fixed;top:0;left:0;right:0;z-index:900;
    background:var(--primary);color:#fff;
    box-shadow:0 3px 10px rgba(0,0,0,0.3);
  }
  #barTitle{
    text-align:center;font-size:.88rem;font-weight:700;
    background:var(--accent);color:#111;padding:5px 10px;
    letter-spacing:.4px;
  }
  #barStats{
    display:flex;flex-wrap:wrap;justify-content:space-around;
    padding:7px 16px;gap:5px;
  }
  .bstat{text-align:center;font-size:.75rem;padding:0 8px;}
  .bstat .bval{display:block;font-size:1.05rem;font-weight:800;color:#ffe066;}
  #timerVal.flash{animation:flashRed 1s step-start infinite;}
  @keyframes flashRed{50%{color:#ff4444;}}

  #examContent{
    max-width:920px;margin:0 auto;
    padding:20px 16px 60px;margin-top:108px;
  }

  .part-hd{
    background:var(--primary);color:#fff;
    padding:11px 20px;border-radius:10px;
    margin:26px 0 14px;font-size:1rem;font-weight:700;
    display:flex;align-items:center;gap:10px;
  }
  .sec-hd{
    background:#dce8f5;color:var(--primary);
    padding:8px 15px;border-radius:0 7px 7px 0;
    border-left:4px solid var(--accent);
    margin:14px 0 10px;font-size:.9rem;font-weight:600;
  }
  .qcard{
    background:var(--white);border-radius:10px;
    padding:16px 20px;margin-bottom:13px;
    box-shadow:0 2px 8px var(--shadow);
    border-left:4px solid transparent;transition:border-color .2s;
  }
  .qcard:hover{border-left-color:var(--accent);}
  .qtop{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px;}
  .qbadge{
    min-width:28px;height:28px;background:var(--primary);color:#fff;
    border-radius:50%;display:flex;align-items:center;justify-content:center;
    font-size:.78rem;font-weight:800;flex-shrink:0;margin-top:1px;
  }
  .qtext{font-size:.93rem;line-height:1.65;}
  .qpts{font-size:.72rem;color:#999;margin-left:6px;white-space:nowrap;}
  .opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  @media(max-width:580px){.opts{grid-template-columns:1fr;}}
  .olabel{
    display:flex;align-items:flex-start;gap:9px;
    padding:9px 13px;border:2px solid #d5deee;
    border-radius:8px;cursor:pointer;font-size:.86rem;
    line-height:1.5;transition:all .15s;min-height:48px;
  }
  .olabel:hover{border-color:var(--primary);background:#eaf0fb;}
  .olabel input{margin-top:2px;accent-color:var(--primary);flex-shrink:0;}
  .okey{font-weight:800;color:var(--primary);flex-shrink:0;min-width:16px;}

  #footArea{text-align:center;margin:28px 0 50px;}
  #btnSubmit{
    padding:13px 48px;background:#922b21;color:#fff;
    border:none;border-radius:9px;font-size:1.05rem;
    font-weight:700;cursor:pointer;
    box-shadow:0 4px 14px rgba(146,43,33,.35);
    transition:background .2s;
  }
  #btnSubmit:hover{background:#7b241c;}
  #autoMsg{display:none;color:var(--wrong);font-weight:700;margin-top:10px;font-size:.95rem;}

  
  #resultWrap{display:none;max-width:960px;margin:0 auto;padding:18px 16px 70px;}
  #rHeader{
    background:var(--primary);color:#fff;
    border-radius:14px;padding:26px 28px;
    text-align:center;margin-bottom:22px;
  }
  #rHeader h2{font-size:1.45rem;margin-bottom:6px;}
  .r-name{font-size:1.1rem;color:#ffe066;margin-bottom:18px;}
  .sboxes{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;}
  .sbox{
    background:rgba(255,255,255,.13);border-radius:10px;
    padding:12px 22px;text-align:center;min-width:110px;
  }
  .sbox .sv{font-size:1.85rem;font-weight:900;color:#ffe066;}
  .sbox .sl{font-size:.72rem;color:#bbd;margin-top:2px;}

  .rcard{
    background:var(--white);border-radius:10px;
    padding:16px 20px;margin-bottom:13px;
    box-shadow:0 2px 8px var(--shadow);
    border-left:5px solid #ccc;
  }
  .rcard.rc{border-left-color:var(--correct);}
  .rcard.rw{border-left-color:var(--wrong);}
  .rcard.rs{border-left-color:var(--orange);}
  .rq{font-size:.93rem;font-weight:700;margin-bottom:10px;line-height:1.65;}
  .ropts{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px;}
  @media(max-width:580px){.ropts{grid-template-columns:1fr;}}
  .ropt{
    padding:7px 12px;border-radius:7px;font-size:.84rem;
    border:2px solid #dce4f0;background:#f7f9fc;
    display:flex;align-items:center;gap:7px;
  }
  .ropt.rok{background:#d5f5e3;border-color:var(--correct);color:var(--correct);font-weight:700;}
  .ropt.rbad{background:#fadbd8;border-color:var(--wrong);color:var(--wrong);}
  .rmeta{font-size:.8rem;margin-bottom:8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
  .tag{display:inline-block;padding:2px 9px;border-radius:20px;font-size:.74rem;font-weight:700;}
  .tg-ok{background:#d5f5e3;color:var(--correct);}
  .tg-bad{background:#fadbd8;color:var(--wrong);}
  .tg-skip{background:#fdebd0;color:var(--orange);}
  .tg-mark{background:#eaf0fb;color:var(--primary);}
  .rexp{
    background:#eaf4ff;border-radius:7px;padding:10px 14px;
    font-size:.83rem;line-height:1.72;color:#1a2a3a;
    border-left:3px solid #2980b9;
  }
  .rexp strong{color:var(--primary);}
  .r-part-hd{
    background:var(--primary);color:#fff;
    padding:9px 18px;border-radius:8px;
    margin:18px 0 10px;font-size:.95rem;font-weight:700;
  }
  .progress-bar-wrap{background:#dde;border-radius:20px;height:10px;margin:10px 0 18px;overflow:hidden;}
  .progress-bar{height:10px;border-radius:20px;background:linear-gradient(90deg,#1a7a3c,#27ae60);transition:width 1s;}