@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Saira+Condensed:ital,wght@1,700;1,800&display=swap');

*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(120% 120% at 50% 0%,#12224f 0%,#070f26 60%);font-family:'Archivo',system-ui,sans-serif;padding:24px}
.device{width:390px;height:844px;border-radius:46px;padding:11px;background:#000;box-shadow:0 40px 90px rgba(0,0,0,.55),0 0 0 2px rgba(255,255,255,.05)}
.scr{position:relative;height:100%;border-radius:36px;overflow:hidden;background:#0a1631;color:#fff;display:flex;flex-direction:column}
.hl{font-family:'Saira Condensed',sans-serif;font-style:italic;font-weight:800;text-transform:uppercase;line-height:.92;letter-spacing:.005em;margin:0}
.sb{display:flex;justify-content:space-between;align-items:center;height:44px;padding:0 22px 0 26px;font:600 13px 'Archivo';flex:none;z-index:2}
.sbdots{display:flex;gap:5px;align-items:center}
.sbdots i{width:6px;height:6px;border-radius:50%;display:inline-block}
.scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
.scroll::-webkit-scrollbar{width:0}
.nav{position:absolute;left:0;right:0;bottom:0;height:74px;display:flex;justify-content:space-around;align-items:flex-start;padding:9px 4px 0;background:rgba(6,13,34,.92);backdrop-filter:blur(12px);border-top:1px solid rgba(255,255,255,.07);z-index:5}
.nav a{display:flex;flex-direction:column;align-items:center;gap:4px;font:600 9px 'Archivo';text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;border:none;background:none}
.nav svg{width:22px;height:22px;fill:none;stroke-width:1.7}
.chip{display:inline-flex;align-items:center;gap:5px;font:700 9.5px 'Archivo';text-transform:uppercase;letter-spacing:.06em;padding:4px 9px;border-radius:999px;white-space:nowrap;flex:none}
.lock{width:11px;height:11px;fill:none;stroke-width:2}
.tile{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s,background .12s;border:none;color:inherit;text-align:left;width:100%}
.tile:active{transform:scale(.97)}
.ov{position:absolute;inset:0;z-index:20;background:#0a1631;display:flex;flex-direction:column;animation:slideIn .22s ease}
@keyframes slideIn{from{transform:translateX(30px);opacity:0}to{transform:translateX(0);opacity:1}}
.send{width:36px;height:36px;flex:none;border:none;border-radius:50%;background:var(--acc,#ffc400);display:flex;align-items:center;justify-content:center;cursor:pointer}
.cmp{display:flex;align-items:center;gap:9px;background:#12224f;border-radius:999px;padding:7px 7px 7px 16px;margin:0 14px 12px}
.cin{flex:1;background:none;border:none;outline:none;color:#fff;font:500 13px 'Archivo'}
.cin::placeholder{color:rgba(255,255,255,.4)}
.toast{position:absolute;left:18px;right:18px;bottom:88px;z-index:40;background:#12224f;border:1px solid rgba(255,196,0,.4);border-radius:14px;padding:13px 15px;display:flex;align-items:center;gap:10px;font:600 12px 'Archivo';color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.4);animation:slideIn .2s ease}
.opt{position:relative;border-radius:11px;overflow:hidden;height:44px;display:flex;align-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
.bar{position:absolute;left:0;top:0;bottom:0;transition:width .5s cubic-bezier(.2,.8,.2,1)}
.hidden{display:none!important}
.doc-progress-wrap{margin:0 18px 18px;background:#12224f;border-radius:14px;padding:14px 16px}
.doc-progress-head{display:flex;justify-content:space-between;align-items:center;font:700 11px 'Archivo';text-transform:uppercase;letter-spacing:.04em;color:rgba(255,255,255,.65);margin-bottom:10px}
.doc-progress-pct{color:#4ade80;font:800 13px 'Archivo'}
.doc-progress-track{height:8px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden}
.doc-progress-bar{height:100%;border-radius:999px;background:linear-gradient(90deg,#22c55e,#4ade80);transition:width .45s ease}
.doc-section{margin:0 18px 16px}
.doc-section-head{font:800 13px 'Saira Condensed';font-style:italic;text-transform:uppercase;color:#ffc400;margin:0 0 4px}
.doc-section-sub{font:500 10px 'Archivo';color:rgba(255,255,255,.45);margin:0 0 10px}
.doc-slot{display:flex;align-items:center;gap:10px;padding:12px 13px;background:#12224f;border-radius:12px;margin-bottom:8px;border:1px solid rgba(255,255,255,.06)}
.doc-slot.done{border-color:rgba(74,222,128,.25);background:rgba(34,197,94,.08)}
.doc-slot-label{flex:1;min-width:0;font:600 11.5px 'Archivo';line-height:1.35}
.doc-slot-btn{flex:none;font:700 10px 'Archivo';text-transform:uppercase;letter-spacing:.04em;padding:8px 12px;border-radius:9px;border:none;background:#ffc400;color:#0a1631;cursor:pointer}
.doc-slot-btn:disabled{opacity:.45}
.doc-slot-dl{flex:none;font:700 10px 'Archivo';color:#4ade80;background:none;border:none;cursor:pointer;text-decoration:underline}
.doc-slot-help{flex:none;width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);color:#ffc400;font:800 12px 'Archivo';cursor:pointer;line-height:1}
.help-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center;padding:0 12px 24px}
.help-backdrop{position:absolute;inset:0;background:rgba(4,10,24,.75)}
.help-panel{position:relative;width:min(420px,100%);background:#12224f;border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:16px 18px 20px;max-height:70vh;overflow:auto}
.help-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}
.help-title{font:700 14px 'Archivo';line-height:1.3;flex:1}
.help-close{width:32px;height:32px;border:none;border-radius:8px;background:rgba(255,255,255,.08);color:#fff;font-size:20px;cursor:pointer;line-height:1}
.help-lang{display:flex;gap:8px;margin-bottom:14px}
.help-lang-btn{font:700 10px 'Archivo';text-transform:uppercase;letter-spacing:.04em;padding:7px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:transparent;color:rgba(255,255,255,.6);cursor:pointer}
.help-lang-btn.active{background:#ffc400;color:#0a1631;border-color:#ffc400}
.help-body{font:500 12.5px/1.55 'Archivo';color:rgba(255,255,255,.88)}
.help-loading{color:rgba(255,255,255,.5);font-style:italic}
.panel{flex:1;min-height:0;display:flex;flex-direction:column}
.panel-scroll{padding-bottom:86px}
.forum-panel{padding-bottom:74px}

/* Join screen */
.join-wrap{position:fixed;inset:0;z-index:100;background:radial-gradient(120% 120% at 50% 0%,#12224f 0%,#070f26 60%);display:flex;align-items:center;justify-content:center;padding:24px}
.join-card{width:100%;max-width:360px;background:#0a1631;border-radius:24px;padding:32px 28px;box-shadow:0 24px 60px rgba(0,0,0,.4)}
.join-brand{display:flex;align-items:center;gap:10px;margin-bottom:24px}
.join-brand-icon{width:40px;height:40px;border-radius:10px;background:#ffc400;display:flex;align-items:center;justify-content:center;font-size:22px}
.join-title{font:800 22px 'Saira Condensed';font-style:italic;text-transform:uppercase;margin:0 0 8px}
.join-sub{font:500 13px 'Archivo';color:rgba(255,255,255,.55);margin:0 0 24px;line-height:1.5}
.field{display:block;margin-bottom:16px}
.field-label{display:block;font:600 11px 'Archivo';text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.5);margin-bottom:6px}
.input{width:100%;background:#12224f;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px 14px;color:#fff;font:500 14px 'Archivo';outline:none}
.input:focus{border-color:rgba(255,196,0,.5)}
.btn-primary{width:100%;background:#ffc400;color:#0a1631;border:none;border-radius:12px;padding:14px;font:700 14px 'Archivo';cursor:pointer;margin-top:8px}
.btn-primary:disabled{opacity:.5;cursor:not-allowed}
.error{font:600 12px 'Archivo';color:#ff8a80;margin-top:12px}
.join-footnote{position:fixed;bottom:20px;left:20px;right:20px;text-align:center;font:500 11px 'Archivo';color:rgba(255,255,255,.35)}
.file-link{color:inherit;text-decoration:none}
.file-row{cursor:pointer}