:root{
    /* Liftoff Asia brand palette */
    --navy:#0E1B3D; --navy-soft:#1A2950; --ink:#14213D;
    --cream:#F7F2E8; --cream-warm:#EFE7D4; --rule:#E4DCC8;
    --gold:#C9A961; --gold-deep:#9A7320; --muted:#5C6481;
    --serif:'Newsreader','EB Garamond',Georgia,'Times New Roman',serif;
    --sans:'Inter',-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif;

    /* component tokens (remapped from the old space theme) */
    --bg:#0a1430;                      /* deep-navy space behind canvas + loader */
    --accent:var(--gold); --accent2:var(--gold);
    --panel:rgba(247,242,232,0.92);    /* cream glass for floating chips */
    --panel2:#F7F2E8;                  /* solid cream panel */
    --panel-border:var(--rule);
    --text:var(--ink); --card:#FCFAF3;
    --gov:#2F5D8A; --priv:#9A7320; --ok:#2F7D4F; --fail:#B33A2B;
  }
  *{box-sizing:border-box}
  html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);
    font-family:var(--sans);}
  #scene{position:fixed;inset:0;}
  canvas{display:block;}
  button{font-family:inherit;}
  a{color:var(--navy);}

  /* ---- top bar (cream newsletter header) ---- */
  #topbar{position:fixed;top:0;left:0;right:0;z-index:8;display:flex;align-items:center;
    justify-content:space-between;gap:12px;padding:13px 22px;
    background:rgba(247,242,232,0.9);backdrop-filter:saturate(180%) blur(10px);
    border-bottom:1px solid var(--rule);}
  #brand h1{margin:0;font-family:var(--serif);font-size:clamp(18px,2.4vw,24px);font-weight:600;
    letter-spacing:0;color:var(--navy);}
  #brand small{color:var(--muted);font-size:12px;}
  #brand small a{color:var(--navy);border-bottom:1px solid var(--rule);text-decoration:none;}
  #brand small a:hover{border-bottom-color:var(--navy);}
  #nav{display:flex;gap:4px;flex-wrap:wrap;background:transparent;border:none;padding:0;}
  .navbtn{background:transparent;border:none;color:var(--muted);padding:7px 13px;border-radius:22px;
    cursor:pointer;font-size:13px;font-weight:600;transition:.15s;display:flex;align-items:center;gap:6px;}
  .navbtn:hover{color:var(--navy);}
  .navbtn.active{background:var(--navy);color:var(--cream);}
  @media(max-width:760px){.navbtn span{display:none}.navbtn{padding:8px 11px;font-size:15px}}

  /* ---- hint / prompts ---- */
  #hint{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:5;
    background:rgba(247,242,232,0.94);border:1px solid var(--rule);backdrop-filter:blur(8px);color:var(--navy);
    padding:10px 18px;border-radius:40px;font-size:13.5px;box-shadow:0 8px 30px rgba(14,27,61,.18);
    transition:opacity .5s;display:flex;align-items:center;gap:10px;}
  #hint .pulse{width:9px;height:9px;border-radius:50%;background:var(--gold);
    animation:pulse 1.8s infinite;}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(201,169,97,.6)}70%{box-shadow:0 0 0 12px rgba(201,169,97,0)}100%{box-shadow:0 0 0 0 rgba(201,169,97,0)}}

  #backBtn{position:fixed;top:64px;left:18px;z-index:6;display:none;align-items:center;gap:8px;
    background:rgba(247,242,232,0.94);border:1px solid var(--rule);color:var(--navy);
    padding:8px 15px;border-radius:30px;cursor:pointer;font-size:13px;backdrop-filter:blur(8px);}
  #backBtn:hover{border-color:var(--gold);}

  /* ---- globe country markers ---- */
  .marker{position:fixed;z-index:4;transform:translate(-50%,-50%);cursor:pointer;
    pointer-events:auto;display:none;will-change:left,top;}
  .marker .dot{width:13px;height:13px;border-radius:50%;background:var(--gold);margin:0 auto;
    box-shadow:0 0 0 4px rgba(201,169,97,.25),0 0 16px rgba(201,169,97,.7);
    border:2px solid #fff;transition:transform .15s;}
  .marker .lbl{margin-top:5px;font-size:12px;font-weight:600;white-space:nowrap;color:var(--navy);
    background:var(--cream);padding:3px 9px;border-radius:20px;border:1px solid var(--rule);
    box-shadow:0 4px 14px rgba(14,27,61,.28);
    transform:translateX(-50%);position:relative;left:50%;}
  .marker .cnt{font-size:10px;color:var(--gold-deep);font-weight:700;}
  .marker:hover .dot{transform:scale(1.4);}
  .marker:hover .lbl{border-color:var(--gold);}

  /* ---- right country panel ---- */
  #panel{position:fixed;top:0;right:0;height:100%;width:min(440px,93vw);z-index:9;
    background:var(--cream);border-left:1px solid var(--rule);
    transform:translateX(105%);transition:transform .45s cubic-bezier(.5,0,.2,1);
    display:flex;flex-direction:column;box-shadow:-10px 0 40px rgba(14,27,61,.2);}
  #panel.open{transform:translateX(0);}
  #panelHead{padding:22px 22px 16px;border-bottom:1px solid var(--rule);position:relative;}
  #panelHead .flag{font-size:34px;}
  #panelHead h2{margin:6px 0 2px;font-family:var(--serif);font-weight:600;font-size:25px;color:var(--navy);}
  #panelHead .sub{color:var(--muted);font-size:13px;}
  .xbtn{position:absolute;top:18px;right:18px;width:32px;height:32px;border-radius:50%;
    border:1px solid var(--rule);background:var(--cream-warm);color:var(--navy);
    cursor:pointer;font-size:16px;line-height:1;transition:.15s;}
  .xbtn:hover{background:var(--navy);border-color:var(--navy);color:var(--cream);}
  #launches{overflow-y:auto;padding:16px 18px 30px;flex:1;}
  ::-webkit-scrollbar{width:9px;height:9px}
  ::-webkit-scrollbar-thumb{background:rgba(201,169,97,.5);border-radius:8px}

  /* ---- launch card ---- */
  .launch{border:1px solid var(--rule);border-radius:14px;padding:14px 15px;margin-bottom:13px;
    background:var(--card);transition:.18s;scroll-margin-top:90px;}
  .launch:hover{border-color:var(--gold);background:#fff;}
  .launch.flash{animation:flash 1.6s ease;}
  @keyframes flash{0%,100%{box-shadow:none}30%{box-shadow:0 0 0 2px var(--gold),0 0 26px rgba(201,169,97,.5)}}
  .launch .row1{display:flex;justify-content:space-between;align-items:baseline;gap:8px;}
  .launch .veh{font-weight:700;font-size:15.5px;color:var(--navy);}
  .launch .date{font-size:11.5px;color:var(--muted);white-space:nowrap;}
  .launch .ctry{font-size:11.5px;color:var(--muted);}
  .launch .org{font-size:12.5px;margin:3px 0 8px;color:var(--gold-deep);font-weight:600;}
  .launch .pay{font-size:13px;margin-bottom:7px;color:var(--ink);}
  .launch .note{font-size:12.5px;color:var(--muted);line-height:1.5;}
  .tags{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap;align-items:center;}
  .tag{font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:20px;}
  .tag.gov{background:rgba(47,93,138,.12);color:var(--gov);border:1px solid rgba(47,93,138,.38);}
  .tag.priv{background:rgba(154,115,32,.14);color:var(--priv);border:1px solid rgba(154,115,32,.38);}
  .tag.ok{background:rgba(47,125,79,.13);color:var(--ok);border:1px solid rgba(47,125,79,.38);}
  .tag.fail{background:rgba(179,58,43,.12);color:var(--fail);border:1px solid rgba(179,58,43,.38);}
  .sharebtn{margin-left:auto;background:transparent;border:1px solid var(--rule);color:var(--muted);
    border-radius:20px;padding:3px 10px;font-size:11px;cursor:pointer;transition:.15s;}
  .sharebtn:hover{border-color:var(--gold);color:var(--gold-deep);}

  /* ---- overlay modes (cream reading pages) ---- */
  #overlay{position:fixed;inset:0;z-index:7;display:none;overflow-y:auto;background:var(--cream);}
  #overlay.show{display:block;}
  .wrap{max-width:1080px;margin:0 auto;padding:88px 22px 60px;}
  .modehead{display:flex;align-items:center;gap:12px;margin-bottom:6px;}
  .modehead h2{margin:0;font-family:var(--serif);font-weight:600;color:var(--navy);font-size:28px;}
  .modesub{color:var(--muted);font-size:14px;margin:0 0 22px;line-height:1.55;}

  /* filters */
  .filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px;align-items:center;}
  .filters input,.filters select{background:#fff;border:1px solid var(--rule);
    color:var(--ink);border-radius:24px;padding:9px 15px;font-size:13.5px;outline:none;}
  .filters input{min-width:220px;flex:1;}
  .filters input:focus,.filters select:focus{border-color:var(--gold);}
  #countN{color:var(--muted);font-size:12.5px;}
  .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;}

  /* compare */
  .cmpPick{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;}
  .chip{background:#fff;border:1px solid var(--rule);color:var(--muted);
    border-radius:24px;padding:8px 14px;cursor:pointer;font-size:13px;font-weight:600;transition:.15s;}
  .chip.on{background:var(--navy);color:var(--cream);border-color:var(--navy);}
  .cmpGrid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));}
  .cmpCard{border:1px solid var(--rule);border-radius:16px;padding:20px;background:var(--card);}
  .cmpCard h3{margin:0 0 2px;font-family:var(--serif);font-weight:600;font-size:21px;color:var(--navy);}
  .cmpCard .role{color:var(--muted);font-size:12px;margin-bottom:14px;}
  .stat{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--rule);
    font-size:13.5px;color:var(--ink);}
  .stat .v{font-weight:800;color:var(--navy);}
  .bar{height:7px;border-radius:6px;background:var(--cream-warm);overflow:hidden;margin-top:5px;}
  .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--ok),var(--gold));}

  /* quiz */
  .quizbox{max-width:680px;margin:0 auto;border:1px solid var(--rule);border-radius:18px;
    background:var(--card);padding:26px;}
  .qprog{color:var(--muted);font-size:12.5px;margin-bottom:6px;display:flex;justify-content:space-between;}
  .qtext{font-size:18px;font-weight:600;line-height:1.5;margin:8px 0 18px;color:var(--navy);}
  .opt{display:block;width:100%;text-align:left;background:var(--cream);
    border:1px solid var(--rule);color:var(--ink);border-radius:12px;padding:13px 16px;
    margin-bottom:10px;cursor:pointer;font-size:14.5px;transition:.15s;}
  .opt:hover{border-color:var(--gold);}
  .opt.correct{border-color:var(--ok);background:rgba(47,125,79,.1);}
  .opt.wrong{border-color:var(--fail);background:rgba(179,58,43,.1);}
  .opt:disabled{cursor:default;}
  .qexpl{font-size:13px;color:var(--muted);margin-top:6px;line-height:1.55;min-height:20px;}
  .qbtn{margin-top:16px;background:var(--navy);border:none;color:var(--cream);
    font-weight:700;padding:11px 22px;border-radius:26px;cursor:pointer;font-size:14px;transition:.15s;}
  .qbtn:hover:not(:disabled){background:var(--navy-soft);}
  .qbtn:disabled{opacity:.4;cursor:default;}
  .scorebig{font-size:48px;font-weight:600;text-align:center;font-family:var(--serif);color:var(--navy);}

  /* assistant */
  .chatbox{max-width:760px;margin:0 auto;display:flex;flex-direction:column;height:calc(100vh - 200px);
    min-height:380px;border:1px solid var(--rule);border-radius:18px;background:var(--card);overflow:hidden;}
  #chatlog{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;}
  .msg{max-width:88%;padding:11px 15px;border-radius:14px;font-size:13.8px;line-height:1.55;}
  .msg.user{align-self:flex-end;background:var(--navy);color:var(--cream);border:1px solid var(--navy);}
  .msg.bot{align-self:flex-start;background:var(--cream);border:1px solid var(--rule);color:var(--ink);}
  .msg.bot b{color:var(--gold-deep);}
  .msg.user b{color:#fff;}
  .msg .mini{font-size:12px;color:var(--muted);margin-top:6px;padding-top:6px;border-top:1px solid var(--rule);}
  .suggest{display:flex;gap:8px;flex-wrap:wrap;padding:0 18px 12px;}
  .suggest button{background:var(--cream);border:1px solid var(--rule);color:var(--muted);
    border-radius:18px;padding:6px 12px;font-size:12px;cursor:pointer;transition:.15s;}
  .suggest button:hover{border-color:var(--gold);color:var(--navy);}
  .chatin{display:flex;gap:8px;padding:12px;border-top:1px solid var(--rule);}
  .chatin input{flex:1;background:#fff;border:1px solid var(--rule);color:var(--ink);
    border-radius:24px;padding:11px 16px;font-size:14px;outline:none;}
  .chatin input:focus{border-color:var(--gold);}
  .chatin button{background:var(--navy);border:none;color:var(--cream);font-weight:700;border-radius:24px;
    padding:0 20px;cursor:pointer;transition:.15s;}
  .chatin button:hover{background:var(--navy-soft);}

  /* about */
  .about p{color:var(--ink);line-height:1.7;font-size:14.5px;max-width:760px;}
  .about h3{margin:22px 0 6px;font-family:var(--serif);font-weight:600;font-size:18px;color:var(--navy);}
  .legendrow{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;font-size:13px;color:var(--muted);}
  .legendrow span{display:flex;align-items:center;gap:7px;}
  .legendrow i{width:12px;height:12px;border-radius:3px;display:inline-block;}

  /* toast */
  #toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);z-index:30;
    background:var(--navy);color:var(--cream);font-weight:700;padding:10px 18px;border-radius:24px;
    font-size:13px;opacity:0;transition:.3s;pointer-events:none;}
  #toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

  /* loader */
  #loader{position:fixed;inset:0;z-index:40;background:var(--bg);display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:18px;transition:opacity .8s;}
  #loader .ring{width:54px;height:54px;border:3px solid rgba(201,169,97,.25);border-top-color:var(--gold);
    border-radius:50%;animation:spin 1s linear infinite;}
  @keyframes spin{to{transform:rotate(360deg)}}
  #loader p{color:rgba(247,242,232,.7);font-size:14px;}
