:root{
  --red:#ce272e;--red-dark:#b01f25;--red-soft:#fbeaea;--ink:#13172b;--navy:#2e2d5a;--navy-deep:#232247;
  --grey:#5d5d5d;--muted:#7a7a86;--bg:#fcfafa;--white:#fff;--beige:#e7ded9;--beige-soft:#f5f0ed;--sand:#faf6f3;
  --line:#ece6e2;--field:#c9c7ce;--ok:#1f7a4d;--ok-soft:#e8f4ee;--amber:#fff3cd;--wa:#1fa855;
  --font:"Jost","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;--display:"Fraunces",Georgia,"Times New Roman",serif;
  --r:12px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--grey);font:400 16px/1.6 var(--font);-webkit-font-smoothing:antialiased}
h1,h2,h3{margin:0;color:var(--ink);font-weight:600;line-height:1.25}
a{color:var(--navy)}
img{max-width:100%}
[hidden]{display:none!important}
.wrap{max-width:720px;margin:0 auto;padding:0 16px}
.small{font-size:13px;color:var(--muted)}

/* header */
.hdr{position:sticky;top:0;z-index:50;background:var(--white);border-bottom:1px solid var(--line)}
.hrow{display:flex;align-items:center;justify-content:space-between;height:64px;gap:12px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.logo img{height:44px;width:auto;display:block}
.logo .lt{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.logo .lt b{color:var(--navy);font-size:16px;font-weight:600;white-space:nowrap}
.logo .lt small{color:var(--muted);font-size:12px;white-space:nowrap}
.pill{border:1px solid var(--line);border-radius:20px;padding:7px 14px;font-size:14px;text-decoration:none;color:var(--navy);white-space:nowrap}
.pill.wa{border-color:var(--wa);color:var(--wa)}
.main{min-height:60vh}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:500 15.5px/1.2 var(--font);padding:13px 20px;border-radius:40px 40px 0 40px;border:1.5px solid transparent;text-decoration:none;cursor:pointer;background:none;color:var(--ink);min-height:48px}
.btn.red{background:var(--red);border-color:var(--red);color:#fff}
.btn.red:hover{background:var(--red-dark)}
.btn.red:disabled{opacity:.6}
.btn.ghost{border-color:var(--navy);color:var(--navy);background:#fff}
.btn.wa{background:var(--wa);border-color:var(--wa);color:#fff}
.btn.wide{display:flex;width:100%;margin-top:18px}
.btn.sm{min-height:42px;padding:9px 12px;font-size:14.5px;flex:1}
.btns{display:grid;gap:10px;margin-top:18px}
.linkbtn,.addlink,.rmlink{background:none;border:0;padding:0;font:inherit;color:var(--navy);cursor:pointer;text-align:left}
.addlink{font-weight:600;margin-top:10px;font-size:15px}
.rmlink{color:var(--red);font-size:14px}
.linkbtn{text-decoration:underline;font-size:14px}

/* hero / info page */
.hero{background:linear-gradient(120deg,#2e2d5a 0%,#3b3a75 100%);color:#fff;padding:26px 0 30px}
.crumb{font-size:13px;color:#d7d6ec;margin-bottom:8px}
.crumb a{color:#d7d6ec;text-decoration:none}
.hero h1{color:#fff;font-family:var(--display);font-size:28px;line-height:1.2;margin-bottom:8px}
.hero p{color:#e6e5f3;margin:0}
.hero .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75)}
.sec{padding:18px 0}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-top:14px}
.card h2{font-size:18px;margin-bottom:6px}
.frow{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:15px}
.frow:last-of-type{border-bottom:0}
.frow b{color:var(--ink);text-align:right;white-space:nowrap}
.note-box{background:var(--amber);border-radius:10px;padding:11px 13px;font-size:14.5px;color:var(--ink)}
.note-box.warn{margin-bottom:10px}
.note-box.okb{background:var(--ok-soft)}
details.acc{background:#fff;border:1px solid var(--line);border-radius:var(--r);margin-top:10px;overflow:hidden}
details.acc summary{list-style:none;cursor:pointer;padding:14px 16px;font-weight:600;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:16px}
details.acc summary::-webkit-details-marker{display:none}
details.acc summary:after{content:"+";color:var(--muted);font-weight:400;font-size:20px;line-height:1}
details.acc[open] summary{background:var(--sand)}
details.acc[open] summary:after{content:"–"}
.acc-body{padding:4px 16px 14px;font-size:15px;color:var(--ink)}
.acc-body h3{font-size:15.5px;margin:14px 0 4px}
.acc-body ul,.acc-body ol{padding-left:20px;margin:6px 0}
.acc-body li{margin:4px 0}
.acc-body p{margin:8px 0}
.tbl{width:100%;border-collapse:collapse;font-size:14px;margin:8px 0}
.tbl th,.tbl td{border:1px solid var(--line);padding:7px 8px;text-align:left;vertical-align:top}
.tbl th{background:var(--sand);color:var(--ink)}
.photo-tpl{display:block;margin:8px auto;max-width:320px;border:1px solid var(--line);border-radius:8px}

/* forms (shared) */
.form-wrap{max-width:640px;margin:0 auto;padding:16px 16px 120px}
.form-head{margin-bottom:6px}
.steplink{background:none;border:0;padding:0;color:var(--muted);font:500 13.5px var(--font);cursor:pointer}
.prog{height:6px;background:var(--line);border-radius:3px;margin:8px 0 4px;overflow:hidden}
.prog i{display:block;height:6px;background:var(--navy);border-radius:3px}
.ftitle{font-size:24px;margin-top:6px;font-family:var(--display)}
.sub{color:var(--muted);font-size:15px;margin:6px 0 0}
.savestate{font-size:12.5px;margin-top:2px}
.savestate.ok{color:var(--ok)}.savestate.saving{color:var(--muted)}.savestate.err{color:var(--red)}
.field{margin-top:16px}
.field.half{display:inline-block;width:calc(50% - 6px);vertical-align:top}
.field.half+.field.half{margin-left:8px}
.field.heading{margin-top:24px;padding-top:12px;border-top:1px solid var(--line)}
.field.heading h3{font-size:17px}
.lbl{display:block;font-size:14.5px;font-weight:600;color:var(--ink);margin-bottom:6px}
.lbl em{color:var(--red);font-style:normal}
.input{display:block;width:100%;border:1.5px solid var(--field);border-radius:10px;padding:12px;font:400 16px/1.4 var(--font);color:var(--ink);background:#fff;min-height:48px;appearance:none;-webkit-appearance:none}
select.input{background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 21px,calc(100% - 13px) 21px;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px}
textarea.input{min-height:84px;resize:vertical}
.input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(46,45,90,.12)}
.input:disabled{background:var(--beige-soft)}
.has-err .input{border-color:var(--red)}
.err{color:var(--red);font-size:13.5px;margin-top:5px}
.err:empty{display:none}
.help{font-size:13px;color:var(--muted);margin-top:5px}
.help.top{margin:-2px 0 8px}
.counter{font-size:12.5px;color:var(--muted);text-align:right;margin-top:3px}
.dk{display:inline-flex;align-items:center;gap:6px;font-size:14px;margin-top:8px;color:var(--ink)}
.dk input{width:18px;height:18px}
.opts{display:grid;gap:8px}
.opt{display:flex;gap:11px;align-items:flex-start;text-align:left;border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:12px;font:400 15.5px/1.35 var(--font);color:var(--ink);cursor:pointer}
.opt small{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.opt .dot{width:20px;height:20px;border-radius:50%;border:2px solid #b7b7c6;flex:none;margin-top:1px}
.opt.sel{border-color:var(--navy);background:#f3f3fa}
.opt.sel .dot{border:6px solid var(--navy)}
.has-err .opt{border-color:#f0b7ba}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1.5px solid var(--line);background:#fff;border-radius:22px;padding:9px 16px;font:400 15px var(--font);color:var(--ink);cursor:pointer}
.chip.sel{background:var(--navy);border-color:var(--navy);color:#fff}
.tagbox{margin:4px 0 8px}.tagbox .chip{cursor:default;padding:7px 8px 7px 14px}.tagx{background:none;border:0;color:#fff;font-size:18px;line-height:1;cursor:pointer;padding:0 4px}.tagrow{display:flex;gap:8px}.tagrow .input{flex:1;min-width:0}
.yn{display:flex;gap:8px}
.ynb{flex:1;max-width:140px;border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:11px;font:500 15.5px var(--font);color:var(--ink);cursor:pointer}
.ynb.sel{background:var(--navy);border-color:var(--navy);color:#fff}
.explain{margin-top:8px}
.switch{display:flex;width:100%;justify-content:space-between;align-items:center;gap:12px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px;font:400 15.5px var(--font);color:var(--ink);text-align:left;cursor:pointer}
.switch i{width:44px;height:26px;border-radius:13px;background:#cfcfda;position:relative;flex:none;transition:background .15s}
.switch i:after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .15s}
.switch.on i{background:var(--navy)}
.switch.on i:after{left:21px}
.checkrow{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--ink);cursor:pointer;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px}
.checkrow input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--navy)}
.rep-item{border:1px solid var(--line);border-radius:10px;padding:12px;margin-top:10px;background:#fff}
.rep-item .field:first-of-type{margin-top:6px}
.rep-head{display:flex;justify-content:space-between;align-items:center;color:var(--ink)}
.t-upload{border:1px solid var(--line);border-radius:var(--r);padding:12px;background:#fff}
.up-head{display:flex;justify-content:space-between;gap:10px;color:var(--ink);font-size:15.5px}
.up-head span{font-size:12.5px;color:var(--muted);white-space:nowrap}
.up-acts{display:flex;gap:8px;margin-top:10px}
.up-row{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:14.5px}
.up-row .tick{color:var(--ok);font-weight:700}
.up-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.up-name small{color:var(--muted)}
.up-msg{font-size:13.5px;color:var(--muted);margin-top:8px}
.up-msg:empty{display:none}
.up-msg.bad{color:var(--red)}
.bar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--line);padding:10px 16px calc(12px + env(safe-area-inset-bottom));display:flex;gap:10px;justify-content:center}
.bar .btn{flex:1;max-width:300px;padding:10px 12px;font-size:15px;white-space:nowrap}
.bar .btn.back{flex:0 0 52px;padding:0;font-size:24px;border-radius:40px 40px 0 40px}
.sheet-ov{position:fixed;inset:0;background:rgba(19,23,43,.45);z-index:100;display:flex;align-items:flex-end;justify-content:center}
.sheet{background:#fff;width:100%;max-width:520px;border-radius:16px 16px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));max-height:85vh;overflow:auto}
.sheet h3{font-size:18px;margin-bottom:10px}
.sheet .btn{width:100%;margin-top:12px}
.sheet-body p{margin:8px 0;color:var(--ink)}
.sheet-item{display:flex;justify-content:space-between;width:100%;background:none;border:0;border-bottom:1px solid var(--line);padding:12px 4px;font:400 15.5px var(--font);color:var(--ink);text-align:left;cursor:pointer}
.sheet-item.cur{font-weight:600;color:var(--navy)}
.sheet-item:disabled{color:#b8b8c2}
.sheet-item small{color:var(--ok);font-size:15px}

/* review */
.route h2,.sum h2,.errs h2{font-size:17px}
.rl{margin:8px 0;padding-left:22px;position:relative;color:var(--ink);font-size:15px}
.rl:before{content:"•";position:absolute;left:6px;color:var(--navy)}
.rl.ok:before{content:"✓";left:3px;color:var(--ok)}
.rl.warn:before{content:"!";left:7px;color:var(--red);font-weight:700}
.errs{border-color:#f0b7ba;background:var(--red-soft)}
.errs ul{padding-left:18px;margin:6px 0}
.errs li{margin:6px 0}
.sum-head{display:flex;justify-content:space-between;align-items:center}
.sum dl{margin:8px 0 0;font-size:14.5px}
.sum dt{color:var(--muted);margin-top:8px}
.sum dd{margin:0;color:var(--ink);word-break:break-word}

/* small forms (start / continue / pin) */
.box{max-width:480px;margin:0 auto;padding:22px 16px 40px}
.box h1{font-family:var(--display);font-size:26px;margin-bottom:6px}
.alert{border-radius:10px;padding:11px 13px;font-size:14.5px;margin-top:14px}
.alert.bad{background:var(--red-soft);color:var(--red-dark)}
.alert.good{background:var(--ok-soft);color:var(--ok)}
.pin{letter-spacing:8px;font-size:22px;text-align:center}

/* status */
.steps-list{list-style:none;padding:0;margin:8px 0 0}
.steps-list li{display:flex;gap:10px;align-items:center;padding:8px 0;color:var(--muted);font-size:15px}
.steps-list li i{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);flex:none;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:12px}
.steps-list li.done{color:var(--ink)}
.steps-list li.done i{background:var(--ok);border-color:var(--ok);color:#fff}
.steps-list li.now{color:var(--ink);font-weight:600}
.steps-list li.now i{border-color:var(--navy);background:var(--navy);color:#fff}

/* footer */
.ftr{background:var(--navy);color:#d7d6ec;padding:26px 0 30px;font-size:14px;margin-top:30px}
.ftr a{color:#fff}
.ftr p{margin:6px 0}
.ftr-brand{font-family:var(--display);font-size:20px;color:#fff}
.ftr .small{color:#b9b8d6}
.form-page .ftr{display:none}

@media (min-width:700px){
  .hero h1{font-size:34px}
  .btns{grid-template-columns:1fr 1fr}
}

/* admin */
.admin .main{background:var(--bg)}
.cbar{background:#232147;overflow-x:auto}
.cbar .wrap{display:flex;gap:6px;align-items:center;max-width:1100px;white-space:nowrap;padding-top:7px;padding-bottom:7px}
.cbar .clabel{color:#9d9bc4;font-size:12px;text-transform:uppercase;letter-spacing:.06em;margin-right:4px}
.ctile{display:inline-flex;align-items:center;gap:6px;color:#d7d6ec;text-decoration:none;font-size:13.5px;padding:5px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.18)}
.ctile .flag{font-size:15px;line-height:1}
.ctile small{font-size:11px;color:#9d9bc4}
.ctile.on{background:#fff;color:var(--navy);border-color:#fff;font-weight:600}
.ctile.on small{color:var(--grey)}
.card.soon p{margin:8px 0}
.anav{background:var(--navy);overflow-x:auto}
.anav .wrap{display:flex;gap:4px;max-width:1100px;white-space:nowrap}
.anav a{color:#d7d6ec;text-decoration:none;padding:11px 10px;font-size:14.5px;border-bottom:3px solid transparent}
.anav a.on{color:#fff;border-bottom-color:var(--red)}
.anav2{background:#3a3970;border-top:1px solid rgba(255,255,255,.08)}
.anav2 .wrap{display:flex;flex-wrap:wrap;gap:2px 4px;max-width:1100px}
.anav2 a{color:#e4e3f3;text-decoration:none;padding:8px 10px;font-size:14px;border-bottom:3px solid transparent}
.anav2 a.on{color:#fff;border-bottom-color:var(--red)}
.admin-wrap{max-width:1100px;padding-top:16px;padding-bottom:40px}
.admin h1{font-size:24px}
.ahead{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.ahead-r{display:flex;gap:8px}
.ahead-r .btn{flex:none}
.filters{display:flex;gap:8px;margin:14px 0;flex-wrap:wrap}
.filters .input{flex:1;min-width:180px}
.filters .btn{flex:none}
.flist{display:grid;gap:10px}
.fcard{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;text-decoration:none;color:var(--grey)}
.fcard:hover{border-color:var(--navy)}
.fc-top{display:flex;justify-content:space-between;gap:10px;color:var(--ink)}
.fc-badges{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.badge{display:inline-block;font-size:12.5px;padding:3px 9px;border-radius:12px;background:var(--beige-soft);color:var(--ink);white-space:nowrap}
.badge.ok{background:var(--ok-soft);color:var(--ok)}
.badge.warn{background:var(--amber);color:#7a5a00}
.badge.red{background:var(--red-soft);color:var(--red-dark)}
.badge.navy{background:var(--navy);color:#fff}
.agrid{display:grid;gap:14px;margin-top:4px}
@media (min-width:900px){.agrid{grid-template-columns:400px 1fr;align-items:start}}
.copyrow{display:flex;gap:8px;margin-top:10px}
.copyrow .input{flex:1;font-size:13.5px;min-height:42px}
.cbtn{flex:none;border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 10px;font:500 13px var(--font);color:var(--navy);cursor:pointer}
.cbtn.copied{background:var(--ok-soft);color:var(--ok);border-color:var(--ok-soft)}
.ans{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:9px 0;border-bottom:1px solid var(--line)}
.ans-l{grid-column:1;font-size:13px;color:var(--muted)}
.ans-v{grid-column:1;color:var(--ink);font-size:15px;word-break:break-word}
.ans .cbtn{grid-column:2;grid-row:1 / span 2;align-self:center}
.ans-sec{font-size:16px;margin:18px 0 4px;padding-top:6px;color:var(--navy)}
.ans-sub{font-size:14px;margin:12px 0 2px;color:var(--red)}
.doc-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:8px 0;border-bottom:1px solid var(--line)}
.doc-row a{font-weight:600}
.doc-row form{margin-left:auto}
.ev{font-size:14px;padding:5px 0;border-bottom:1px solid var(--line);color:var(--ink)}
.card.danger{border-color:#f0b7ba}
.admin .btns form{margin:0}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.grid2 .field.half{display:block;width:auto;margin-left:0}
.admin .hdr .wrap{max-width:1100px}

.needs{background:var(--sand)}
.needs-list{list-style:none;padding:0;margin:10px 0 0}
.needs-list li{padding:8px 0 8px 26px;border-top:1px solid var(--line);position:relative;font-size:14.5px;color:var(--ink)}
.needs-list li:before{content:"☐";position:absolute;left:2px;top:7px;color:var(--navy);font-size:16px}
.needs-list b{display:block;font-weight:600}
.needs-list span{color:var(--grey)}
.needs-link{display:block;margin-top:6px;font-size:13.5px}
.note-box.bad{background:var(--red-soft);color:var(--red-dark)}

.tabs{display:flex;gap:6px;background:var(--beige-soft);border-radius:12px;padding:4px;margin:14px 0 6px}
.tab{flex:1;text-align:center;padding:9px;border-radius:9px;text-decoration:none;color:var(--grey);font-weight:500;font-size:15px}
.tab.on{background:#fff;color:var(--navy);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.input.ro{background:var(--beige-soft);color:var(--grey)}
/* icon buttons (copy, show, download) */
.ic{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--navy);font:500 15px var(--font);cursor:pointer;text-decoration:none;flex:none}
.ic.copied{background:var(--ok-soft);color:var(--ok);border-color:var(--ok-soft)}
.ic.del{color:var(--red)}
.kv{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--line)}
.kv:last-child{border-bottom:0}
.kv .t{flex:1;min-width:0}
.kv .k{font-size:12.5px;color:var(--muted)}
.kv .v{font-size:15px;color:var(--ink);font-weight:600;word-break:break-word}
.kv .v.norm{font-weight:400}
.mask{letter-spacing:3px}
.tag{display:inline-block;font-size:11.5px;padding:2px 8px;border-radius:10px;white-space:nowrap;margin-top:3px}
.tag.carry{background:var(--red-soft);color:var(--red-dark)}
.tag.review{background:#eef0fb;color:var(--navy)}
.tag.confirm{background:#fff4e0;color:#8a5a00}
.tag.keep{background:var(--ok-soft);color:var(--ok)}
.lock{font-size:12.5px;color:var(--muted);background:var(--sand);border-radius:8px;padding:8px 10px;margin-top:8px}
.appt{border:1px solid var(--line);border-radius:10px;padding:12px;margin-top:10px;background:#fff;color:var(--grey)}
.appt b{color:var(--ink)}
.appt ul{margin:6px 0 0;padding-left:18px;font-size:14.5px;color:var(--ink)}
.paid{background:var(--ok-soft);color:var(--ok);border-radius:12px;padding:14px;margin-top:14px;font-weight:600;display:flex;gap:12px;align-items:center}
.paid i{width:28px;height:28px;border-radius:50%;background:var(--ok);color:#fff;font-style:normal;display:flex;align-items:center;justify-content:center;flex:none}
.paid small{font-weight:400}
.btn.sm2{min-height:38px;padding:7px 12px;font-size:14px}
.subcard{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-top:10px}
.subcard h3{font-size:15px;margin-bottom:4px}

.cheer{display:inline-block;margin-top:8px;font-size:13px;font-weight:600;color:var(--ok);background:var(--ok-soft);border-radius:12px;padding:3px 10px}
.helpbox{margin-top:10px;background:#fff3cd;border-radius:10px;padding:10px 12px;font-size:14px;color:var(--ink);line-height:1.45}
.helpbox b{font-weight:700}
.helpbox a{font-weight:700;color:var(--navy)}
.headlinks{display:flex;flex-wrap:wrap;gap:4px 16px}
.helpme{display:flex;gap:8px;align-items:center;font-size:13.5px;color:var(--navy);margin-top:6px;cursor:pointer}
.helpme input{width:18px;height:18px;flex:none;accent-color:var(--navy)}
.needhelp .input{background:var(--beige-soft)}
.game h3{margin-bottom:2px}
.ggrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0}
.gcard{aspect-ratio:1;border:0;border-radius:10px;background:var(--navy);cursor:pointer;font-size:30px;display:flex;align-items:center;justify-content:center;padding:0}
.gcard span{visibility:hidden}
.gcard.up,.gcard.done{background:var(--sand);border:1.5px solid var(--line)}
.gcard.up span,.gcard.done span{visibility:visible}
.gcard.done{opacity:.55}
.agrid>div{min-width:0}
.card{min-width:0;overflow-wrap:anywhere}
.anav{max-width:100vw}

.update{display:flex;gap:10px;align-items:flex-start;background:#eef0fb;border-radius:12px;padding:12px 14px;margin-top:14px;color:var(--ink);font-size:15px}
.update b{color:var(--navy)}
.update .dot{width:10px;height:10px;border-radius:50%;background:var(--red);flex:none;margin-top:7px}

/* ===== Travel-journey theme ===== */
body{background:var(--sand)}
.card,details.acc,.t-upload,.rep-item{border-color:#efe8e3;box-shadow:0 4px 14px rgba(46,45,90,.06)}
.icn{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px;flex:none}
.icb{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--red-soft);color:var(--red);flex:none}
.icb .icn{width:18px;height:18px}
.icb.navy{background:#eceaf7;color:var(--navy)}
.icb.green{background:var(--ok-soft);color:var(--ok)}
.icb.white{background:#fff;color:var(--red)}
.ch{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.ch h2{margin:0}
/* form hero */
.fhero{background:linear-gradient(120deg,#2e2d5a 0%,#3b3a75 100%);color:#fff;margin:4px 0 14px;padding:14px 16px 16px;border-radius:20px;box-shadow:0 8px 22px rgba(46,45,90,.18)}
.fhero .steplink{color:#d7d6ec}
.fhero .ftitle{color:#fff;display:flex;align-items:center;gap:10px;margin-top:8px}
.fhero .icb{background:#fff;color:var(--red);width:40px;height:40px}
.fhero .savestate.ok{color:#9fe1cb}
.fhero .savestate.saving{color:#d7d6ec}
.fhero .cheer{background:rgba(255,255,255,.14);color:#fff}
.flight{position:relative;height:34px;margin:12px 4px 0}
.flight .line{position:absolute;left:10px;right:10px;top:16px;border-top:2px dashed rgba(255,255,255,.35)}
.flight .done{position:absolute;left:10px;top:15px;height:4px;background:#f2a516;border-radius:2px;transition:width .5s}
.flight .plane{position:absolute;top:4px;width:26px;height:26px;margin-left:-3px;color:#fff;transition:left .5s}
.flight .plane svg{width:26px;height:26px;fill:#fff;stroke:none;transform:rotate(90deg)}
.flight .end{position:absolute;top:22px;font-size:11px;color:#d7d6ec}
.flight .end.a{left:0}.flight .end.b{right:0}
.form-head .sub{margin-top:0}
.toast{position:fixed;left:50%;top:76px;transform:translateX(-50%);background:var(--navy);color:#fff;padding:10px 18px;border-radius:24px;font-weight:600;z-index:120;box-shadow:0 8px 24px rgba(0,0,0,.2);animation:pop .3s ease}
@keyframes pop{from{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%,0)}}
@media (prefers-reduced-motion:reduce){.toast{animation:none}.flight .done,.flight .plane{transition:none}}
/* info page */
.feats{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.feat{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);color:#fff;border-radius:20px;padding:6px 12px;font-size:13.5px}
.feat .icn{width:16px;height:16px}
details.acc summary{justify-content:flex-start}
details.acc summary .sl{flex:1}
details.acc summary .icb{width:32px;height:32px}
/* status journey */
.shero{background:linear-gradient(120deg,#2e2d5a 0%,#3b3a75 100%);color:#fff;margin:4px 0 14px;padding:18px 16px 20px;border-radius:20px;box-shadow:0 8px 22px rgba(46,45,90,.18)}
.shero h1{color:#fff}
.shero .k{color:#d7d6ec}
.shero .v{color:#fff}
.shero .ic{background:rgba(255,255,255,.12);border-color:transparent;color:#fff}
.journey{list-style:none;padding:0;margin:10px 0 0;position:relative}
.journey li{display:flex;gap:12px;align-items:flex-start;padding:0 0 16px;position:relative;color:var(--muted)}
.journey li:not(:last-child):before{content:"";position:absolute;left:17px;top:38px;bottom:2px;border-left:2px dashed #e2dbd5}
.journey li.done:not(:last-child):before{border-left:2px solid var(--ok)}
.journey .icb{background:#f1eeea;color:#a9a6ae;z-index:1}
.journey li.done .icb{background:var(--ok);color:#fff}
.journey li.now .icb{background:var(--red);color:#fff;box-shadow:0 0 0 5px var(--red-soft)}
.journey li b{display:block;color:var(--ink);font-weight:600;font-size:15.5px;margin-top:6px}
.journey li:not(.done):not(.now) b{color:var(--muted);font-weight:500}
.journey small{font-size:13px}
.ask{background:linear-gradient(120deg,#fff3cd,#fbeaea);border:0}
.ask .btns{grid-template-columns:1fr}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn.navy{background:var(--navy);border-color:var(--navy);color:#fff}
.card.center{text-align:center}
.card.center .icb{width:56px;height:56px;margin:4px auto 6px}
.card.center .icb .icn{width:26px;height:26px}
.card.center .ftitle{justify-content:center}
.big-emoji{font-size:54px;line-height:1;margin:6px 0}
.pick-big{font-size:22px;font-weight:600;color:var(--navy);margin:4px 0 14px}
.ask .ch h2{margin:0}
.note-box.good{background:var(--ok-soft)}
.sguide{margin-top:8px}
.howto{background:#eceaf7;border-radius:12px;padding:10px 12px}
.howto summary{cursor:pointer;font-weight:600;color:var(--navy);font-size:14.5px}
.howto ol{margin:8px 0;padding-left:20px;font-size:14.5px}
.howto ol li{margin:3px 0}
.howto .btn{margin:4px 0 6px}
.howto p{margin:4px 0 0}
/* ===== Admin dashboard ===== */
.dhero{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;background:linear-gradient(120deg,#2e2d5a 0%,#3b3a75 100%);color:#fff;border-radius:20px;padding:18px 18px 16px;margin:4px 0 14px;box-shadow:0 8px 22px rgba(46,45,90,.18)}
.dhero h1{color:#fff;margin:2px 0 4px;font-size:24px}
.dhero p{margin:0;color:#d7d6ec;font-size:14.5px}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:14px}
@media (min-width:860px){.tiles{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tile{display:flex;flex-direction:column;gap:2px;background:#fff;border:1px solid #efe8e3;border-radius:16px;padding:14px;color:var(--ink);text-decoration:none;box-shadow:0 4px 14px rgba(46,45,90,.06);min-width:0}
.tile:hover{border-color:var(--navy)}
.tile .icb{margin-bottom:6px}
.tile b{font-size:26px;font-family:var(--display);line-height:1.1;overflow-wrap:anywhere}
.tile span{font-weight:600;font-size:14px}
.tile small{color:var(--muted);font-size:12.5px}
.dgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:0 14px}
@media (min-width:860px){.dgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.arow{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line);color:var(--ink);text-decoration:none}
.arow:first-of-type{border-top:0}
.arow:hover .atxt b{color:var(--red)}
.adate{display:flex;flex-direction:column;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:#eceaf7;color:var(--navy);font-size:11px;text-transform:uppercase;flex:none;line-height:1.1}
.adate b{font-size:17px}
.adate.soon{background:var(--red);color:#fff}
.atxt{flex:1;min-width:0;display:flex;flex-direction:column}
.atxt b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.atxt small{color:var(--muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aleft{font-size:12.5px;color:var(--muted);white-space:nowrap}
.hbars{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.hbar{display:grid;grid-template-columns:118px 1fr 32px;align-items:center;gap:8px;color:var(--ink);text-decoration:none;font-size:14px}
.hbar .ht{height:14px;background:#f1eeea;border-radius:7px;overflow:hidden}
.hbar .ht i{display:block;height:14px;background:var(--navy);border-radius:0 4px 4px 0}
.hbar:hover .ht i{background:var(--red)}
.hbar .hn{text-align:right;font-weight:600}
.vbars{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;height:170px;align-items:end;margin-top:6px}
.vb{display:flex;flex-direction:column;align-items:center;height:100%;min-width:0}
.vb .vt{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;border-bottom:1px solid var(--line)}
.vb .vt i{display:block;width:62%;max-width:36px;background:var(--navy);border-radius:4px 4px 0 0}
.vbars.money .vb .vt i{background:var(--ok)}
.vb:hover .vt i{opacity:.8}
.vb .vn{font-size:12px;font-weight:600;height:18px;color:var(--ink)}
.vb .vl{font-size:12px;color:var(--muted);margin-top:4px}
.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ptbl{min-width:560px;margin:0}
.ptbl th,.ptbl td{padding:10px 12px;vertical-align:top}
.ptbl .r{text-align:right;white-space:nowrap}
.ptbl thead th{background:#faf6f3;font-size:12.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.tiles .tile:only-child{grid-column:1/-1}
.dhero .btn{flex:none;width:auto;padding-left:22px;padding-right:22px}
.dgrid{align-items:start}

/* family strip */
.famwrap{padding-bottom:0}
.famwrap + .form-wrap{padding-top:4px}
.fambar{margin-top:2px}
.fam-h{display:flex;align-items:center;gap:8px;color:var(--ink);margin:2px 0 8px}
.fam-h .icn{width:18px;height:18px;color:var(--navy)}
.fam-h .small{margin-left:auto}
.fam-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.fam-tabs::-webkit-scrollbar{display:none}
.fam-tab{flex:none;display:flex;align-items:center;gap:9px;min-width:132px;padding:9px 12px 9px 9px;border:1.5px solid var(--line);border-radius:14px;background:#fff;text-decoration:none;color:var(--ink);font:400 15px var(--font);cursor:pointer;text-align:left}
.fam-tab.on{border-color:var(--navy);background:#f3f3fa;box-shadow:0 2px 8px rgba(46,45,90,.12)}
.fam-av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--beige-soft);color:var(--navy);font-weight:600;flex:none}
.fam-tab.on .fam-av{background:var(--navy);color:#fff}
.fam-tab.done .fam-av{background:var(--ok-soft);color:var(--ok)}
.fam-tab.on.done .fam-av{background:var(--ok);color:#fff}
.fam-t{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.fam-t b{font-weight:600;white-space:nowrap}
.fam-t small{font-size:12.5px;color:var(--muted);white-space:nowrap}
.fam-tab.done small{color:var(--ok)}
.fam-tab.add{border-style:dashed;border-color:#c9c7ce;min-width:120px}
.fam-tab.add .fam-av{background:var(--red-soft);color:var(--red);font-size:20px}
.fam-solo{display:flex;align-items:center;gap:12px;background:#fff;border:1px dashed #d9d2cd;border-radius:var(--r);padding:12px 14px;color:var(--ink);line-height:1.35}
.fam-solo>div{flex:1;min-width:0}
.fam-solo .btn{flex:none}
.fam-add .ch{margin-bottom:6px}
.opts.two{grid-template-columns:1fr 1fr}
label.opt{position:relative}
label.opt input{position:absolute;opacity:0;pointer-events:none}
label.opt:has(input:checked){border-color:var(--navy);background:#f3f3fa}
label.opt:has(input:checked) .dot{border:6px solid var(--navy)}
label.opt:has(input:focus-visible){box-shadow:0 0 0 3px rgba(46,45,90,.18)}
@media (max-width:380px){.opts.two{grid-template-columns:1fr}}

/* admin: family box */
.famlist{display:grid;gap:6px;margin-top:6px}
.famrow{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:9px 11px;text-decoration:none;color:var(--ink)}
.famrow.me{border-color:var(--navy);background:#f6f6fb}
.famrow .fr-n{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.famrow .fr-n small,.famrow .fr-p small{color:var(--muted);font-size:12.5px}
.famrow .fr-s{grid-column:1;display:flex;gap:4px;flex-wrap:wrap}
.famrow .fr-p{grid-column:2;grid-row:1/3;text-align:right;display:flex;flex-direction:column;font-weight:600;font-variant-numeric:tabular-nums}
.famtot{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;background:var(--sand);border-radius:10px;padding:10px 12px}
.famtot div{display:flex;flex-direction:column}
.famtot span{font-size:12.5px;color:var(--muted)}
.famtot b{color:var(--ink);font-size:16px;font-variant-numeric:tabular-nums}
.famtot b.ok{color:var(--ok)}
.famtot b.due{color:var(--red-dark)}
.fc-fam{font-size:12.5px;color:var(--navy)}
.fcard.fam{border-left:3px solid var(--navy)}
.fc-fam .icn{width:14px;height:14px;vertical-align:-2px}
.fam-pay{margin:2px 0 0;color:var(--ok)}
.fam-pay .icn{width:14px;height:14px;vertical-align:-2px}

/* ---------- Round 4 ---------- */
/* login button as strong as Start */
.btn.white{background:#fff;border-color:#fff;color:var(--navy);font-weight:600}
.btn.white:hover{background:#f1f0f8}
.hero-note{font-size:13.5px;margin-top:10px!important;color:#d9d8ee!important}
.vtypes{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 12px}
.vtype{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.35);border-radius:20px;padding:5px 12px;font-size:13.5px;color:#fff}
.vtype.on{background:#fff;color:var(--navy);border-color:#fff;font-weight:600}
.vtype .icn{width:15px;height:15px}
/* important notes: amber box with a gold line (red is only for mistakes) */
.imp{background:#fff8e6;border:1px solid #f1dfae;border-left:5px solid #d9a21b;border-radius:10px;padding:11px 14px;margin:12px 0;color:var(--ink);font-size:15px}
.imp p{margin:4px 0}
.imp ul{margin:6px 0 2px;padding-left:20px}
.imp .imp-h{display:flex;align-items:center;gap:6px;color:#8a5a00;font-size:13.5px;letter-spacing:.02em;text-transform:uppercase}
.imp .imp-h .icn{width:16px;height:16px}
.imp .btn{margin-top:8px}
/* mobile number with country code */
.phone{display:flex;gap:8px}
.phone .cc{flex:0 0 112px;padding-right:6px}
.phone input{flex:1;min-width:0}
/* PIN boxes that hide the digits without being "password" boxes (so browsers do not autofill saved logins) */
.masked{-webkit-text-security:disc;text-security:disc}
.file-hide{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none}
.up-acts label.btn{cursor:pointer;user-select:none}
.up-msg.good{color:var(--ok)}
.inapp{flex-basis:100%;margin:6px 0 0;background:var(--amber);border-radius:8px;padding:8px 10px;color:var(--ink)}
.helpme.pp{color:var(--navy)}
.field.frompp input,.field.frompp select{background:#f1f0f8}
.field.frompp .opts .opt{opacity:.5}
.helpme.later{margin-top:10px}
.up-acts{flex-wrap:wrap}
/* "Keep These Ready": line icons in pale pink squares, like the website */
.needs-list li{display:flex;gap:12px;align-items:flex-start;padding:10px 0}
.needs-list li:before{content:none!important;display:none!important}
.needs-list li>div{flex:1;min-width:0}
.nicn{flex:0 0 34px;width:34px;height:34px;border-radius:9px;background:var(--red-soft);display:inline-flex;align-items:center;justify-content:center}
.nicn .icn{width:18px;height:18px;stroke:var(--red);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* 1-minute break: a tab on the right edge */
.gametab{position:fixed;right:0;top:46%;z-index:60;display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--navy);color:#fff;border:0;border-radius:12px 0 0 12px;padding:10px 7px 12px;box-shadow:-2px 4px 14px rgba(0,0,0,.18);cursor:pointer;font:500 12px/1.1 var(--font)}
.gametab .gt-i{font-size:20px}
.gametab .gt-t{writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.04em}
.gametab:hover{background:var(--navy-deep)}
.pinask .pa-row{display:flex;gap:8px}
.ic.wa{color:var(--wa)} .ic.busy{opacity:.5} .askmore{border:2px solid #d9a21b}
/* admin file page */
.reopen{margin-top:8px;width:100%}
.cklist{list-style:none;padding:0;margin:4px 0 0}
.cklist li{display:flex;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);color:var(--ink);font-size:14.5px}
.cklist li small{display:block;color:var(--muted);font-size:12.5px}
.cklist .ck{flex:0 0 22px;text-align:center}
.cklist li.done{color:var(--grey)}
.subh{font-size:15px;margin:18px 0 4px}
.askgrp{border:1px solid var(--line);border-radius:8px;padding:6px 10px;margin-top:8px}
.askgrp summary{cursor:pointer;font-weight:600;color:var(--navy)}
.askgrp .checkrow{margin-top:6px}
.editrow{background:var(--beige-soft);border-radius:8px;padding:10px;margin:4px 0 8px}
.editrow .er-btns{display:flex;gap:8px;margin-top:8px}
.kv.ppread{background:#fff6cc;border-radius:6px;padding-left:6px}
.kv.flash{animation:flash 2s}
@keyframes flash{from{background:#fff6cc}to{background:transparent}}
.ev.unread{background:#fff8e6;border-radius:6px;padding:6px}
.viewer{position:fixed;inset:0;z-index:200;background:rgba(19,23,43,.82);display:flex;flex-direction:column;padding:12px}
.viewer .vbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:#fff;border-radius:10px 10px 0 0;padding:8px 12px}
.viewer .vbar b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.viewer .vbody{flex:1;background:#fff;border-radius:0 0 10px 10px;overflow:auto;display:flex;align-items:flex-start;justify-content:center}
.viewer .vbody img{max-width:100%;height:auto}
.viewer .vbody iframe{width:100%;height:100%;border:0;min-height:70vh}
.ppbox .tbl input{width:100%}
.ppfirst{border:2px solid var(--red-soft)}
.ppfirst .yn-row,.yn-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.field.ppfilled .input{background:#fffbe8}
.selbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:4px 0 10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fff}
.selbar .checkrow{margin:0;border:0;padding:4px 2px;background:none;box-shadow:none}
.selbar [data-selcount]{color:var(--muted,#6b6b7b)}
.selbar .selacts{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.selbar.none .selacts .btn,.selbar.none .bulkbox>summary{opacity:.45;pointer-events:none}
.frowsel{display:flex;gap:8px;align-items:flex-start}
.frowsel>input{margin-top:16px;width:18px;height:18px;flex:none;accent-color:var(--navy)}
.frowsel>.fcard{flex:1;min-width:0}
.profdl{margin-top:12px}

/* ---- Round 5: trust strip, how it works, tracker, WhatsApp button ---- */
.vtype.soon{opacity:.75;border-style:dashed}
.vtype.soon small{font-size:11px;opacity:.85;margin-left:2px}
.trust{background:#fff;border-bottom:1px solid var(--line)}
.trust .wrap{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;padding-top:12px;padding-bottom:12px}
.trust .ti{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--navy)}
.trust .ti .icn{width:17px;height:17px;color:var(--red)}
.how3{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:12px}
@media(min-width:760px){.how3{grid-template-columns:repeat(3,1fr)}}
.how3 li{display:flex;gap:12px;align-items:flex-start}
.how3 .hn{flex:0 0 32px;height:32px;border-radius:50%;background:#fbeaea;color:var(--red);font-weight:700;display:flex;align-items:center;justify-content:center}
.how3 b{display:block;color:var(--ink)}
.how3 span span,.how3 div span{display:block;font-size:14px;color:var(--muted,#5d5d5d);margin-top:2px}
.firsttime{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);text-align:center}
.firsttime>span{display:block;font-size:14px;color:var(--muted,#5d5d5d);margin-bottom:8px}
.tracker{display:block;margin-top:14px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.1);color:#fff;text-decoration:none}
.tk-line{display:flex;gap:4px;margin-bottom:8px}
.tk-line i{flex:1;height:6px;border-radius:3px;background:rgba(255,255,255,.22)}
.tk-line i.done{background:#7fd6a6}
.tk-line i.now{background:#ffd166}
.tk-t{display:block;font-size:15px}
.tk-s{display:block;font-size:13px;color:#d7d6ec;margin-top:2px}
.wafloat{position:fixed;right:16px;bottom:18px;z-index:60;display:inline-flex;align-items:center;gap:8px;background:#25d366;color:#fff;border-radius:28px;padding:10px 16px 10px 12px;box-shadow:0 6px 18px rgba(0,0,0,.18);text-decoration:none;font-weight:600;font-size:15px}
.wafloat:hover{background:#1ebe5b;color:#fff}
@media(max-width:480px){.wafloat span{display:none}.wafloat{padding:12px;border-radius:50%}}
@media print{.wafloat{display:none}}

/* ---- Admin file page: header, tabs, communication ---- */
.fhead{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;justify-content:space-between;margin-top:4px}
.fhead h1{margin:0 0 6px}
.fh-t{flex:1 1 420px;min-width:0}
.fh-act{display:flex;flex-wrap:wrap;gap:8px}
.fh-fam{margin-top:8px;font-size:14px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fh-fam a{padding:3px 10px;border:1px solid var(--line);border-radius:14px;background:#fff;text-decoration:none;color:var(--navy)}
.fh-fam a.me{background:var(--navy);color:#fff;border-color:var(--navy)}
.ftabs{position:sticky;top:0;z-index:20;display:flex;gap:4px;overflow-x:auto;margin:16px 0 14px;padding:6px;background:#fff;border:1px solid var(--line);border-radius:14px;scrollbar-width:none}
.ftabs::-webkit-scrollbar{display:none}
.ftabs a{flex:0 0 auto;padding:9px 14px;border-radius:10px;text-decoration:none;color:var(--grey);font-weight:600;font-size:14.5px;white-space:nowrap}
.ftabs a:hover{background:var(--beige-soft)}
.ftabs a.on{background:var(--navy);color:#fff}
.ftabs .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);vertical-align:middle;margin-left:3px}
.ftab-p[hidden]{display:none!important}
.card.attn{border:2px solid var(--red)}
.mlist{display:grid;gap:8px;margin-top:6px}
.mrow{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;margin:0}
.mrow .mt{flex:1;min-width:0}
.mrow .mt b{display:block;font-size:14.5px}
.mrow .mt small{display:block;color:var(--muted);font-size:12.5px;line-height:1.35}
.suspbox{border-color:var(--red)!important;background:#fff6f6}

/* ---- Feedback strip, box and rating ---- */
.fbstrip{background:#fff8e6;border-bottom:1px solid #f1e3b8;font-size:13.5px;color:#5d4a10}
.fbstrip .wrap{padding-top:7px;padding-bottom:7px;text-align:center}
.fbstrip .linkbtn{font-size:13.5px;font-weight:700;color:var(--navy)}
.fbmodal{position:fixed;inset:0;background:rgba(19,23,43,.45);z-index:80;display:flex;align-items:flex-end;justify-content:center;padding:12px}
@media(min-width:640px){.fbmodal{align-items:center}}
.fbmodal[hidden]{display:none}
.fbbox{background:#fff;border-radius:18px;padding:18px;width:100%;max-width:460px;box-shadow:0 12px 40px rgba(0,0,0,.2)}
.fbbox h3{margin:0 0 4px}
.fbkinds{display:grid;gap:4px;margin-bottom:8px}
.card.rate .stars{display:flex;gap:6px;margin:10px 0}
.star{font-size:34px;line-height:1;background:none;border:0;color:#d6d2dc;cursor:pointer;padding:0 2px}
.star.on{color:#e5a50a}
.fbrow.fixed{opacity:.7}
.fbh{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.fbstars{color:#e5a50a;letter-spacing:1px}
.fbstars span{color:#d6d2dc}
.chip.on{background:var(--navy);color:#fff;border-color:var(--navy)}
a.chip{text-decoration:none;display:inline-block}
.ulist .urow{padding:12px 14px}
.urow.paused{border-color:var(--red);background:#fff6f6}
.uh{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:flex-start}
.um{min-width:0;overflow-wrap:anywhere}
.ufiles{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ufiles a{font-size:13.5px;padding:4px 10px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--navy);background:#fff}
.ufiles small{color:var(--muted)}
.attnbox{border-left:4px solid var(--red)}
.attnbox .arow{border-bottom:1px solid var(--line)}
.attnbox .arow:last-child{border-bottom:0}

/* ---- New file from appointment letters ---- */
.lstep{display:flex;align-items:center;gap:8px;margin:20px 0 8px;font-size:17px}
.lstep:first-of-type{margin-top:4px}
.lstep span{width:26px;height:26px;border-radius:50%;background:var(--navy);color:#fff;font-size:14px;display:inline-flex;align-items:center;justify-content:center}
.lfiles{display:grid;gap:8px;margin-bottom:8px}
.lfile{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}
.lfile .lfn{flex:1;min-width:0;overflow-wrap:anywhere}
.lfile small{color:var(--muted)}
.lfile .bad{color:var(--red)}
.lfam{display:grid;gap:8px}
.lfam small{color:var(--muted);font-weight:400}
.lperson{margin-top:10px}
.lperson.head{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy) inset}
.lp-top{display:flex;align-items:center;gap:8px}
.lown{margin-top:14px;padding:10px 12px;border:1px dashed var(--line);border-radius:12px}
.lownrow{padding:8px 0;border-bottom:1px solid var(--line)}
.lownrow:last-child{border-bottom:0}

/* ---- Customer visa page: action box, tabs, family list ---- */
.actbox{border:2px solid var(--red);border-radius:18px;padding:12px;margin:0 0 14px;background:#fff}
.actbox .act-h{font-weight:700;color:var(--red);margin:0 0 8px;font-size:15px}
.actbox .card{margin-bottom:10px;box-shadow:none}
.actbox .card:last-child{margin-bottom:0}
.ctabs{position:sticky;top:0;z-index:20;display:flex;gap:4px;overflow-x:auto;margin:14px 0;padding:5px;background:#fff;border:1px solid var(--line);border-radius:14px;scrollbar-width:none}
.ctabs::-webkit-scrollbar{display:none}
.ctabs a{flex:0 0 auto;padding:9px 13px;border-radius:10px;text-decoration:none;color:var(--grey);font-weight:600;font-size:14.5px;white-space:nowrap}
.ctabs a.on{background:var(--navy);color:#fff}
.ctab-p[hidden]{display:none!important}
.famlist2{display:grid;gap:8px}
.fl-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#fff}
.fl-row.me{border-color:var(--navy)}
.fl-t{flex:1;min-width:0}
.fl-t small{display:block;color:var(--muted);font-size:12.5px}
.fl-t .fl-s.done{color:var(--ok)}
.fl-t .fl-s.doing{color:#9a6a00}
.fl-a{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.fl-a form{margin:0}
.fam-h .linkbtn{font-size:13.5px}
.remindbox{margin:12px 0;padding:10px 12px;background:var(--sand);border-radius:12px}
.rem-opts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.rem-opts .chip{padding:7px 12px;font-size:14px}
/* tabs sit just under the sticky header */
.ctabs{top:66px}
.fam-h{flex-wrap:wrap}
.fam-h .small{white-space:nowrap}
.fam-h .linkbtn{margin-left:auto;white-space:nowrap}
.ftabs{top:66px}
/* trust strip: credential badges (filled icon in a red circle), not tick boxes */
.trust{background:var(--beige-soft);border-bottom:0}
.trust .wrap{gap:10px;padding-top:14px;padding-bottom:14px}
.trust .ti{background:#fff;border-radius:22px;padding:6px 14px 6px 6px;box-shadow:0 2px 8px rgba(46,45,90,.07);gap:8px;font-size:13.5px}
.trust .tib{width:26px;height:26px;border-radius:50%;background:var(--red);display:inline-flex;align-items:center;justify-content:center;flex:none}
.trust .ti .tib .icn{width:15px;height:15px;color:#fff}
@media(max-width:600px){.trust .wrap{display:grid;grid-template-columns:1fr 1fr;gap:8px}.trust .ti{font-size:12.5px;line-height:1.25;border-radius:16px;padding:6px 10px 6px 6px}}
/* "I don't know" for parents' dates of birth: a clear option to tap */
.dk{border:1.5px solid var(--line);border-radius:20px;padding:7px 14px 7px 10px;background:#fff;cursor:pointer;font-weight:500}
.dk:has(input:checked){background:var(--navy);border-color:var(--navy);color:#fff}
.ppnote{margin-top:6px;color:#1f5f99}
.ppchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.ppchip{border:1.5px solid var(--line);background:#fff;border-radius:18px;padding:6px 12px;font:500 13.5px var(--font);color:var(--ink);cursor:pointer}
.ppchip.sel{background:var(--navy);border-color:var(--navy);color:#fff}

/* Files list: a family shown as one group, its people inside */
.famgrp{border:1px solid var(--line);border-left:4px solid var(--navy);border-radius:var(--r);background:#f7f7fb;padding:8px 10px 10px}
.famgrp-h{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;padding:2px 2px 8px}
.famgrp-h .checkrow{margin:0}
.famgrp-h .icn{width:16px;height:16px;vertical-align:-3px}
.famgrp-b{display:grid;gap:8px;padding-left:14px;border-left:2px dashed #c9c8dd;margin-left:8px}
.famgrp .fcard.fam{border-left:1px solid var(--line)}
.bulkbox{position:relative}
.bulkbox[open]{flex-basis:100%}
.bulkbox>summary{list-style:none;display:inline-block;cursor:pointer}
.bulkbox>summary::-webkit-details-marker{display:none}
.bulkin{margin-top:8px;padding:10px;border:1px solid #f0c9c9;border-radius:10px;background:#fff8f8;display:grid;gap:6px}
.famtag{display:inline-block;font-size:11.5px;font-weight:600;color:var(--navy);background:#ecebf6;border-radius:20px;padding:1px 8px;margin-left:4px;vertical-align:1px}
/* Files list views: families together / all files */
.vtabs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:10px 0 4px}
.vtabs a{padding:7px 14px;border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--grey);text-decoration:none;font-size:14px}
.vtabs a.on{background:var(--navy);border-color:var(--navy);color:#fff}
.famgrp-h{flex-wrap:nowrap;align-items:flex-start}
.famgrp-h>input{margin-top:12px;width:18px;height:18px;flex:none;accent-color:var(--navy)}
.famtog{flex:1;min-width:0;display:grid;grid-template-columns:1fr auto;gap:4px 10px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;cursor:pointer;font:inherit;color:var(--grey)}
.famtog:hover{border-color:var(--navy)}
.famtog .ft-n{grid-column:1}
.famtog .ft-c{grid-column:1;display:flex;flex-wrap:wrap;gap:4px}
.famtog .ft-a{grid-column:2;grid-row:1/3;align-self:center;font-size:18px;color:var(--navy);transition:transform .15s}
.famtog[aria-expanded=true] .ft-a{transform:rotate(180deg)}
.fchip{font-size:12.5px;background:#ecebf6;color:var(--navy);border-radius:20px;padding:2px 9px}
.fchip i{font-style:normal;color:#6b6a85}
.famgrp-b{margin-top:8px}
.famtog b{color:var(--navy)}
/* Same As Main ID / Separate ID choice on each person */
.loginpick{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.loginpick label{position:relative;cursor:pointer}
.loginpick input{position:absolute;opacity:0;pointer-events:none}
.loginpick span{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:20px;background:#fff;font-size:14px}
.loginpick input:checked+span{background:var(--navy);border-color:var(--navy);color:#fff}
.loginpick input:focus-visible+span{outline:2px solid var(--navy);outline-offset:2px}
.lperson .ownbox{margin-top:8px;padding:10px;border:1px dashed var(--line);border-radius:10px;background:#fbfbfe}
/* Customer page: appointment booked, almost done */
.congrats{text-align:center;background:linear-gradient(160deg,#f1fbf4,#fff 70%);border-color:#bfe6cb}
.congrats .cg-h{font-size:40px;line-height:1}
.congrats h2{margin:6px 0 4px;font-size:20px}
.congrats p{margin:0 0 10px}
.congrats .cg-next{display:inline-block;background:#fff;border:1px solid #bfe6cb;border-radius:20px;padding:6px 14px;font-size:14px}
.congrats .cg-next .icn{width:15px;height:15px;vertical-align:-2px}
/* Customer page: small, separate "Forgot a document?" upload */
.upbox{padding:0}
.upbox>summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:auto 1fr;gap:2px 8px;align-items:center;padding:12px 14px}
.upbox>summary::-webkit-details-marker{display:none}
.upbox>summary .small{grid-column:2}
.upbox>summary .icn{width:18px;height:18px;color:var(--navy)}
.upbox[open]>summary{border-bottom:1px solid var(--line)}
.upbox>:not(summary){margin-left:14px;margin-right:14px}
.upbox>.up-list{margin-bottom:12px}
.journey li.star b{color:#1f8a4c}
.formal{margin-top:12px;padding:10px 12px;border:1px dashed var(--line);border-radius:12px;background:#fafafc;color:#6b6a85;font-size:14px}
.formal b{color:var(--grey);font-size:13.5px}
.formal ul{margin:6px 0;padding-left:18px}
.formal li{margin:2px 0}
.pickbtn{padding:7px 14px;border:1px solid var(--line);border-radius:20px;background:#fff;font:inherit;font-size:14px;color:var(--grey);cursor:pointer}
.pickbtn.on{background:var(--navy);border-color:var(--navy);color:#fff;cursor:default}
.pickbtn:disabled{opacity:1}
/* Visa Result tab */
.resultbox .rsteps{margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fbfbfe;display:grid;gap:6px}
.resultbox .rsteps>b{font-size:14px;color:var(--navy)}
.resultbox .rsteps .checkrow{margin:0}
/* Downloads page */
.dlgrid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:860px){.dlgrid{grid-template-columns:1fr}}
.dlone{padding:2px 0}
.dlrow{margin:0}
.famgrp .dlrow{background:#fff}
.dlbtn{display:block;padding:10px 12px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--grey);margin-top:8px}
.dlbtn:hover{border-color:var(--navy)}
.dlbtn b{display:block;color:var(--navy)}
.dlbtn small{color:#6b6a85}
/* Customer page: small "Need your security question?" */
.secq{padding:0}
.secq>summary{list-style:none;cursor:pointer;padding:10px 14px;font-size:14.5px}
.secq>summary::-webkit-details-marker{display:none}
.secq>summary .icn{width:16px;height:16px;vertical-align:-3px;color:var(--navy)}
.secq>summary .small{display:block;margin-left:22px}
.secq[open]>summary{border-bottom:1px solid var(--line)}
.secq>:not(summary){margin-left:14px;margin-right:14px}
.secq>:last-child{margin-bottom:12px}
/* Customer page: helpful guides */
.glinks{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin-bottom:8px}
.glinks a{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--navy);font-weight:600;font-size:14px;background:#fff}
.glinks a:hover{border-color:var(--navy)}
.glinks a span{margin-left:auto;color:#9a99ad}
.glinks .icn{width:17px;height:17px}
/* Customer Reminders tab */
.remdays{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px}
.remdays .checkrow{margin:0}
/* Section titles inside a tab (admin) */
.secth{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#7a7996;margin:4px 2px 8px}
.secth:not(:first-child){margin-top:18px}
#pause details>summary::-webkit-details-marker{display:none}
.gstrip{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;background:#fff7e6;border:1px solid #f1d9a8;border-radius:10px;padding:10px 14px;margin:0 0 12px;font-size:14px}.gstrip a{color:var(--red,#ce272e);font-weight:600;text-decoration:none}.gstrip a:hover{text-decoration:underline}
.tagsug{border:1px solid #e5e2ea;border-radius:10px;margin-top:4px;max-height:260px;overflow:auto;background:#fff}.tagopt{display:block;width:100%;text-align:left;border:0;background:none;padding:10px 12px;font:inherit;cursor:pointer;border-bottom:1px solid #f1eef4}.tagopt:hover,.tagopt:focus{background:#f6f3f9}.tagsug .small{padding:10px 12px}.tagrow[hidden]{display:none}.tagrow+.tagrow{margin-top:6px}
.revbox{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.todaygrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:700px){.todaygrid{grid-template-columns:1fr}}
.apday{font-weight:700;color:var(--navy);font-size:13px;margin:12px 0 4px;padding-top:8px;border-top:1px solid var(--line)}.apday:first-of-type{border-top:0;margin-top:0}
.bell{position:relative;margin-left:auto}.bell>summary{list-style:none;cursor:pointer;font-size:19px;padding:8px 10px;position:relative}.bell>summary::-webkit-details-marker{display:none}
.bellc{position:absolute;top:2px;right:0;background:#ce272e;color:#fff;border-radius:10px;font-size:11px;font-weight:700;padding:1px 6px;line-height:16px}
.bellbox{position:absolute;right:0;top:100%;z-index:50;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.15);width:min(360px,92vw);padding:12px;max-height:70vh;overflow:auto;text-align:left}
.bellbox a{display:block;padding:9px 6px;border-bottom:1px solid #f1eef4;color:var(--ink);text-decoration:none;font-size:14px}.bellbox a:hover{background:#f7f5fa}.bellbox a span{display:block;color:#5d5d6b;font-size:13px}
.bellsearch{margin-top:10px}
/* the admin menu bar scrolls sideways on phones, which cut the panel off: show it above the page instead */
.anav .bellbox{position:fixed;top:auto;right:12px;left:auto;margin-top:4px;z-index:200}
.custtop{display:flex;gap:10px;align-items:center;margin:0 0 10px}.custtop .csearch{flex:1;min-width:0}.cbell{margin-left:0}.cbell>summary{font-size:15px;font-weight:600;background:#fff;border:1px solid var(--line);border-radius:10px;white-space:nowrap}.cbell .bellbox{left:0;right:auto}
.csres{border:1px solid var(--line);border-radius:10px;background:#fff;margin:-4px 0 12px;max-height:340px;overflow:auto}.csres a.tagopt{color:var(--ink);text-decoration:none}
.flash{animation:flash 1.6s ease}@keyframes flash{0%,60%{box-shadow:0 0 0 3px #ce272e}100%{box-shadow:none}}
.pbar{height:10px;background:#efecf3;border-radius:6px;overflow:hidden}.pbar span{display:block;height:100%;background:var(--navy)}.progcard{margin-bottom:14px}
.askbar{border:1px solid var(--line);border-radius:12px;padding:12px;margin:0 0 12px;background:#fafafe}.askbar-h{margin-bottom:6px}
.asktick{flex:none;width:30px;display:flex;align-items:flex-start;padding-top:2px}.asktick input{width:18px;height:18px;accent-color:#ce272e;cursor:pointer}
.kv.newans{background:#e8f2ff;border-left:4px solid #3b82f6;border-radius:8px}.newbox{background:#e8f2ff;border-color:#9cc3f5}
.bigok{background:#e9f7ef;border:2px solid #1f7a4d;border-radius:14px;padding:18px;text-align:center;margin:0 0 14px}.bigok h2{margin:6px 0;color:#1f7a4d}.bigok-i{width:52px;height:52px;border-radius:50%;background:#1f7a4d;color:#fff;font-size:30px;line-height:52px;margin:0 auto}
.toast{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:999;display:flex;gap:12px;align-items:flex-start;max-width:min(560px,92vw);padding:14px 16px;border-radius:12px;font-size:15px;font-weight:600;box-shadow:0 12px 34px rgba(0,0,0,.22);transition:opacity .4s}
.toast.good{background:#1f7a4d;color:#fff}.toast.bad{background:#ce272e;color:#fff}.toast button{background:none;border:0;color:#fff;font-size:22px;line-height:1;cursor:pointer}.toast.out{opacity:0}
.dswarn{background:#fff3f3;border:2px solid #ce272e;border-radius:10px;padding:12px;margin:0 0 12px;font-size:15px}.dsrev{border:2px solid #ce272e}.dschg{margin-top:8px}.dschg>summary{list-style:none;text-align:center;cursor:pointer}.dschg>summary::-webkit-details-marker{display:none}.dschg form{margin-top:8px}.bigok.bad{background:#fff3f3;border-color:#ce272e}.bigok.bad h2{color:#ce272e}

/* passport: reading in progress, and the date of birth box hidden while we ask about it */
.ppreading{display:flex;gap:12px;align-items:center;background:#eef2ff;border:1px solid #c9d3f5;border-radius:12px;padding:14px;margin:10px 0}
.ppreading .spin{width:26px;height:26px;border:3px solid #c9d3f5;border-top-color:#2f2e6d;border-radius:50%;flex:none;animation:ppspin .9s linear infinite}
@keyframes ppspin{to{transform:rotate(360deg)}}
.form-body > .field.dobwait{display:none}
/* Settings: day + time rows and small day boxes */
.planbox{display:flex;flex-direction:column;gap:6px;margin:4px 0 8px}
.planrow,.daysrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.planrow span{font-size:14px;color:var(--muted,#5d5d5d)}
.input.dbox{width:70px;min-width:0;padding:6px 8px;text-align:center}
.input.tsel{width:auto;min-width:110px;padding:6px 8px}
.remgrid{display:grid;grid-template-columns:1fr;gap:0 16px}
@media(min-width:900px){.remgrid{grid-template-columns:1fr 1fr}.remgrid .card{margin-top:0}}
.whylist{margin:2px 0 0;padding-left:18px;font-size:13px;color:var(--muted,#5d5d5d);font-weight:400}
.whylist li{margin:1px 0}
.logoutf{display:inline;margin:0}.pill.out{background:#fff;cursor:pointer;font:inherit;font-size:14px;color:var(--red,#ce272e);border-color:#f0c4c6}
.hdr-r{display:flex;gap:8px;align-items:center}
/* Our Guides: four tiles (2 x 2 on phones) */
.gtiles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 0 14px}
.gtile{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;text-decoration:none;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.gtile:hover{border-color:var(--red,#ce272e);box-shadow:0 2px 10px rgba(0,0,0,.06)}
.gtile .gi{flex:none;width:36px;height:36px;border-radius:10px;background:#fdecec;color:var(--red,#ce272e);display:flex;align-items:center;justify-content:center}
.gtile .gi svg{width:20px;height:20px}
.gtile b{display:block;font-size:14px;line-height:1.25}
.gtile small{display:block;font-size:12.5px;color:var(--muted,#5d5d5d);margin-top:2px}
.gtitle{font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--muted,#5d5d5d);margin:0 0 6px}
@media(max-width:720px){.gtiles{grid-template-columns:1fr 1fr}}
/* Ask the customer: box at the end of the answers, floating button, side panel */
.askend{margin-top:16px}
.askfab{position:fixed;right:18px;bottom:18px;z-index:60}
.askfab .btn{box-shadow:0 6px 18px rgba(0,0,0,.18);border-radius:24px;padding:12px 18px}
.askdrawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100%);z-index:70;background:#fff;box-shadow:-8px 0 24px rgba(0,0,0,.15);overflow:auto}
.askdrawer-in{padding:16px}
.askdrawer-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:17px}
.askdrawer .askbar{margin:0;border:0;padding:0;background:none}
@media(min-width:1100px){body.askopen .admin-wrap{margin-right:440px}}
.askdrawer .askbar-h>b{display:none}

/* ================= Ivory & Red theme (customer pages) ================= */
.cust{--bg:#fffaf6;--sand:#fffaf6;--ink:#12112b;--grey:#3f3e55;--muted:#62607a;--line:#efe4da;--beige-soft:#f7efe8;--navy:#2e2d5a;
  --font:"Plus Jakarta Sans","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;--display:"Plus Jakarta Sans","Segoe UI",system-ui,sans-serif;--r:16px;
  background:#fffaf6;color:var(--grey);font-family:var(--font)}
.cust h1,.cust h2,.cust h3{font-weight:800;letter-spacing:-.01em}
.cust .small{color:var(--muted)}
.cust .hdr{background:rgba(255,250,246,.94);backdrop-filter:saturate(1.2) blur(8px);-webkit-backdrop-filter:saturate(1.2) blur(8px);border-bottom:1px solid var(--line)}
.cust .logo img{mix-blend-mode:multiply}
.cust .logo .lt b{color:var(--ink);font-size:15px;font-weight:800;letter-spacing:-.01em}
.cust .logo .lt b span{white-space:nowrap}
.cust .logo .lt small{color:var(--muted);font-weight:500}
@media(max-width:480px){.cust .logo .lt b span{display:block;line-height:1.15}.cust .logo .lt b{font-size:14px}.cust .hdr.in .logo .lt small{display:none}}
.cust .pill{background:#fff;border-color:var(--line);font-weight:700;font-size:13.5px;color:var(--ink)}
.cust .pill.wa{border-color:#25a35a;color:#1f8a4b}
.cust .pill.out{color:var(--red);border-color:#f0c9cb}
.cust .btn{border-radius:14px;font-weight:700}
.cust .btn.red{box-shadow:0 8px 20px rgba(206,39,46,.26)}
.cust .btn.red:disabled{box-shadow:none}
.cust .btn.sm{box-shadow:none;border-radius:12px}
.cust .btn.ghost,.cust .btn.white{background:#fff;border-color:var(--navy);color:var(--navy)}
.cust .card,.cust details.acc,.cust .t-upload,.cust .rep-item{border-color:var(--line);border-radius:18px;box-shadow:0 6px 22px rgba(46,45,90,.06)}
.cust details.acc[open] summary{background:#fff6ef}
.cust .input{border-radius:12px;border-color:#d9cfc6}
.cust .input:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(206,39,46,.12)}
.cust .input::placeholder{color:#a9a3b3;opacity:1}
.cust .opt,.cust .ynb,.cust .chip,.cust .switch,.cust .checkrow{border-color:#e6dcd3}
.cust .opt.sel{border-color:var(--ink);background:#fff3ee}
.cust .opt.sel .dot{border-color:var(--red)}
.cust .ynb.sel,.cust .chip.sel{background:var(--ink);border-color:var(--ink)}
.cust .switch.on i{background:var(--red)}
.cust .prog i{background:var(--red)}
.cust .ctabs{border-radius:16px;border-color:var(--line);box-shadow:0 4px 14px rgba(46,45,90,.06)}
.cust .ctabs a{font-weight:700;color:var(--grey)}
.cust .ctabs a.on{background:var(--ink);color:#fff}
.cust .fam-tab.on{border-color:var(--ink);background:#fff3ee}
.cust .fam-tab.on .fam-av{background:var(--ink)}
.cust .icb.navy{background:#fff0ea;color:var(--red)}
.cust .howto{background:#fff3ee}
.cust .field.frompp input,.cust .field.frompp select{background:#fff6ef}
.cust .gametab{background:var(--ink)}
.cust .toast{background:var(--ink)}
.cust .ftr{background:#12112b;color:#cfcde0;margin-top:36px;border-radius:26px 26px 0 0}
.cust .ftr-brand{font-weight:800;letter-spacing:-.01em}
.cust .fbstrip{background:#fff3df}
/* dark "ink" hero cards with a soft red glow (form step and visa page) */
.cust .fhero,.cust .shero{background:radial-gradient(circle at 92% -10%,rgba(206,39,46,.55),transparent 46%),radial-gradient(circle at 0% 120%,rgba(86,96,220,.28),transparent 55%),#14132b;border-radius:22px;box-shadow:0 14px 34px rgba(20,19,43,.22)}
.cust .fhero .ftitle,.cust .shero h1{font-weight:800}
.cust .flight .done{background:#ff7b80}
.cust .tk-line i.done{background:#7fd6a6}.cust .tk-line i.now{background:#ff8d91}
/* small pages: start, log in, PIN */
.cust .box{max-width:500px;margin:18px auto 40px;padding:24px 20px 26px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 14px 40px rgba(46,45,90,.08);position:relative;overflow:hidden}
.cust .box:before{content:"";position:absolute;right:-70px;top:-70px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(206,39,46,.14),transparent 68%);pointer-events:none}
.cust .box>*{position:relative}
.cust .box h1{font-size:27px;line-height:1.15;letter-spacing:-.02em}
@media(max-width:540px){.cust .box{margin:14px 14px 30px}}
.cust .boxsteps{display:flex;gap:6px;margin:0 0 14px}
.cust .boxsteps i{flex:1;height:5px;border-radius:3px;background:#f0e6dd}.cust .boxsteps i.on{background:var(--red)}
.cust .eyebrow{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--red);margin-bottom:6px}
/* ---- public page ---- */
.lhero{padding:14px 0 24px;background:radial-gradient(circle at 92% 0%,rgba(206,39,46,.16),transparent 52%),radial-gradient(circle at 0% 100%,rgba(46,45,90,.08),transparent 55%)}
.lhero .crumb{font-size:12.5px;color:var(--grey);margin:4px 0 10px}.lhero .crumb a{color:var(--grey);text-decoration:none}
.lhero h1{font-size:36px;line-height:1.08;letter-spacing:-.025em;font-weight:800;color:var(--ink);margin:0 0 10px}
.lhero h1 span{color:var(--red);display:block}
.lhero .lead{color:var(--grey);font-size:16px;line-height:1.5;margin:0 0 16px;max-width:560px}
.pass{background:#fff;border-radius:20px;padding:16px;margin:0 0 16px;box-shadow:0 10px 32px rgba(46,45,90,.10);border:1px solid var(--line)}
.pass .ph{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted);font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.pass .chk{display:flex;gap:9px;align-items:center;font-size:15px;color:var(--ink);margin-top:10px;font-weight:500}
.pass .chk i{flex:0 0 22px;height:22px;border-radius:50%;background:#e7f6ee;color:#1f8a4b;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800}
.pass .soon{margin-top:12px;padding-top:10px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--muted)}
.lhero .btns{margin-top:0}
.lhero .btn{min-height:54px;font-size:16.5px;font-weight:800}
.lhero .hero-note{color:var(--muted)!important;font-size:13.5px;text-align:center}
.ttiles{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:18px}
@media(min-width:700px){.ttiles{grid-template-columns:repeat(4,1fr)}.lhero h1{font-size:46px}.lhero{padding:26px 0 34px}}
.ttile{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 10px;text-align:center;font-size:12.5px;font-weight:700;color:var(--navy);line-height:1.3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:76px}
.ttile b{display:block;font-size:20px;color:var(--red);font-weight:800;letter-spacing:-.01em;line-height:1.1}
.ttile .icn{width:22px;height:22px;color:var(--red)}
.lsec{padding-top:26px}
.lsec>h2,.lsec .lh2{font-size:24px;letter-spacing:-.02em;margin:0 0 4px;color:var(--ink);font-weight:800}
.lsec .lsub{margin:0 0 14px;color:var(--grey);font-size:15px}
/* passport card */
.ppc{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative}
.ppc .pc{border-radius:20px;padding:16px 10px 14px;border:1px solid var(--line);background:#fff;text-align:center;box-shadow:0 6px 22px rgba(46,45,90,.06)}
.ppc .pc.win{background:linear-gradient(165deg,#fff 0%,#fde9e6 100%);border-color:var(--red)}
.ppc .vs{position:absolute;left:50%;top:62px;transform:translateX(-50%);width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;z-index:2;box-shadow:0 0 0 4px #fffaf6}
.ppc .ppi{position:relative;width:84px;margin:0 auto 10px}
.ppc .ppi svg{display:block;width:84px;height:112px;filter:drop-shadow(0 8px 8px rgba(18,17,43,.3))}
.ppc .stamp{position:absolute;right:-16px;bottom:16px;background:linear-gradient(135deg,#ce272e,#8f1a20);color:#fff;border-radius:6px;padding:5px 8px;font-size:10px;font-weight:800;line-height:1.25;transform:rotate(-8deg);box-shadow:0 6px 12px rgba(0,0,0,.28);letter-spacing:.03em;text-align:left}
.ppc .stamp small{display:block;font-weight:600;font-size:8px;opacity:.95}
.ppc h3{margin:0 0 8px;font-size:15px;color:var(--ink)}
.ppc .ppbar{height:8px;border-radius:5px;background:#f0e6dd;overflow:hidden;margin:0 6px 8px}
.ppc .ppbar i{display:block;height:100%;background:#a9a6b8;border-radius:5px}
.ppc .win .ppbar i{background:linear-gradient(90deg,#ce272e,#ff7b80)}
.ppc .n{font-size:30px;font-weight:800;color:var(--ink);line-height:1;letter-spacing:-.02em}
.ppc .n small{display:block;font-size:12px;color:var(--grey);margin-top:5px;font-weight:600;letter-spacing:0;line-height:1.3}
.ppgain{margin-top:10px;text-align:center;background:#14132b;background:radial-gradient(circle at 90% -20%,rgba(206,39,46,.6),transparent 50%),#14132b;color:#fff;border-radius:18px;padding:14px 12px}
.ppgain b{display:block;font-size:24px;font-weight:800;letter-spacing:-.02em;color:#ffb4b6}
.ppgain span{font-size:13.5px;color:#dcdaea}
.unl{margin-top:10px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 16px;box-shadow:0 6px 22px rgba(46,45,90,.06)}
.unl h3{margin:0 0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--red);font-weight:800}
.unl div{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--ink);padding:6px 0}
.unl i{flex:0 0 20px;height:20px;border-radius:50%;background:#fde9e6;color:var(--red);font-style:normal;font-size:12px;font-weight:800;display:grid;place-items:center;margin-top:2px}
.ppsrc{margin:8px 4px 0;font-size:11.5px;color:var(--muted);text-align:center;line-height:1.45}
/* how it works: timeline */
.tl{position:relative;margin:0;padding:0;list-style:none}
.tl:before{content:"";position:absolute;left:15px;top:10px;bottom:26px;width:2px;background:#eadfd5}
.tl li{position:relative;padding:0 0 18px 46px}
.tl li:last-child{padding-bottom:0}
.tl .tn{position:absolute;left:0;top:0;width:32px;height:32px;border-radius:50%;background:#fff;border:2.5px solid var(--red);color:var(--red);font-weight:800;font-size:14px;display:grid;place-items:center}
.tl b{display:block;font-size:16.5px;color:var(--ink);font-weight:800}
.tl span{display:block;font-size:14.5px;color:var(--grey);margin-top:2px}
.fee2{background:#fff;border:1px solid var(--line);border-radius:18px;padding:4px 16px;box-shadow:0 6px 22px rgba(46,45,90,.06)}
.fee2 .frow{border-bottom:1px dashed #e6dcd3;padding:13px 0;font-size:15.5px;color:var(--ink)}
.fee2 .frow:last-of-type{border-bottom:0}
.fee2 .frow b.hl{color:var(--red);font-size:17px}
.lsec .imp{border-radius:16px}
.lmore{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:28px 0 2px}

/* form: Back button with the word, "Saved" next to the answer */
.bar .btn.back{flex:0 0 auto;padding:10px 16px;font-size:15px;border-radius:14px}
.savedtag{font-size:12.5px;font-weight:700;margin-top:6px;color:var(--ok)}
.savedtag.saving{color:var(--muted);font-weight:500}
.savedtag.err{color:var(--red)}
.cust .fhero .savestate.err{color:#ffb4b6;font-weight:700}
.allsaved{color:var(--ok);font-weight:700;margin:0 0 8px}.allsaved.err{color:var(--red)}
.resetlink{display:block;margin:14px auto 2px;color:var(--red);text-align:center}

/* reminder rows: Day [n] at [time]  ✕ Remove  ·  + Add Reminder */
.planrow .planrm{color:var(--red);font-size:13.5px;text-decoration:none;margin-left:4px}
.planadd{font-weight:700;font-size:14px;text-decoration:none;color:var(--navy);margin:2px 0 4px}
.planrow .tsel{width:auto;min-width:112px;padding:6px 30px 6px 10px;min-height:0;background-position:calc(100% - 15px) 14px,calc(100% - 10px) 14px}

/* account created */
.woo{text-align:center}
.woo-e{font-size:52px;line-height:1;margin:4px 0 10px}
.woo h1{font-size:26px!important}
.woo-steps{text-align:left;margin:18px 0 6px;display:grid;gap:8px}
.woo-steps .ws{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:#fff}
.woo-steps .ws i{flex:0 0 30px;height:30px;border-radius:50%;background:#f0e6dd;color:var(--muted);font-style:normal;font-weight:800;display:grid;place-items:center;font-size:14px}
.woo-steps .ws.done i{background:var(--ok);color:#fff}
.woo-steps .ws.now{border-color:var(--red);background:#fff6f3}
.woo-steps .ws.now i{background:var(--red);color:#fff}
.woo-steps b{display:block;color:var(--ink);font-size:15px}
.woo-steps small{display:block;color:var(--muted);font-size:12.5px}

/* "Send To" tick list, and the one email list on a file */
.rcbox{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:10px 0;background:#fff}
.rcbox .rch{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:4px;font-size:14px}
.rcbox .rch .linkbtn{font-size:13px}
.rcbox .rcrow{border:0;padding:3px 0;background:none;font-size:14px;gap:8px;align-items:center}
.rcbox .rcrow span{word-break:break-all}
.rcbox .rcrow small{color:var(--muted);word-break:normal;white-space:nowrap}
.rcbox .rcnote{margin:4px 0 0}
.todayline{display:flex;align-items:center;gap:10px;margin:16px 0 12px;color:var(--red);font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.todayline:before,.todayline:after{content:"";flex:1;border-top:2px solid var(--red);opacity:.5}
.elsent{padding:10px 0}
.rclist{display:flex;flex-direction:column;gap:3px;margin-top:5px}
.rcp{font-size:13px;color:var(--muted);word-break:break-all}
.rcp.open{color:var(--ok);font-weight:600}
.rcp.team{color:#8a8794}
.whorow{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.whorow:first-of-type{border-top:0}
.whon{flex:0 0 24px;height:24px;border-radius:50%;background:var(--red-soft);color:var(--red);font-weight:700;font-size:13px;display:grid;place-items:center;margin-top:1px}
.whoe{word-break:break-all;color:var(--ink)}

.fileof{margin:6px 0 2px;font-size:15px;color:var(--grey)}.fileof b{color:var(--ink);font-size:16px}
.custact{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:12px 0 0;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;text-decoration:none;color:var(--grey);font-size:14px}
.custact b{color:var(--ink)}.custact span{flex:1;min-width:160px}.custact i{font-style:normal;color:var(--navy);font-weight:600;white-space:nowrap}
.elmore>summary{cursor:pointer;margin:8px 0;list-style:none;font-weight:600}.elmore>summary::-webkit-details-marker{display:none}.elmore[open]>summary{display:none}

/* admin: search in the top bar; on a phone, a bar at the bottom of every page */
.anav .wrap{align-items:center}
.asearch{margin-left:auto;display:flex}
.asearch input{width:170px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.1);color:#fff;border-radius:18px;padding:6px 12px;font:400 14px var(--font);outline:none;transition:width .15s}
.asearch input::placeholder{color:#d7d6ec;opacity:1}
.asearch input:focus{width:240px;background:#fff;color:var(--ink);border-color:#fff}
.asearch input:focus::placeholder{color:#888}
.anav .bell{margin-left:6px}
.abot,.amore{display:none}
@media(max-width:760px){
  .admin .anav{overflow:visible}
  .admin .anav .wrap>a{display:none}
  .admin .anav .wrap{padding-top:7px;padding-bottom:7px}
  .admin .anav2{display:none}
  .admin .asearch{margin-left:0;flex:1}
  .admin .asearch input,.admin .asearch input:focus{width:100%}
  .admin .admin-wrap{padding-bottom:96px}
  .abot{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:150;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(46,45,90,.08);padding:4px 4px calc(4px + env(safe-area-inset-bottom))}
  .abot a{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;text-decoration:none;color:var(--grey);font-size:11px;font-weight:600;padding:5px 2px;border-radius:10px;min-width:0}
  .abot a i{font-style:normal;font-size:19px;line-height:1.15}
  .abot a span{white-space:nowrap}
  .abot a.on{color:var(--red);background:var(--red-soft)}
  .amore{display:block;position:fixed;inset:0;z-index:140;background:rgba(19,23,43,.45)}
  .amore[hidden]{display:none!important}
  .amore-in{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:18px 18px 0 0;padding:14px 16px calc(84px + env(safe-area-inset-bottom));max-height:80vh;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:4px 10px}
  .amore-in b{grid-column:1/-1;font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--red);margin-top:10px}
  .amore-in a{padding:10px 12px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--ink);font-size:14.5px}
  .amore-in a.on{border-color:var(--navy);background:#f3f3fa;font-weight:600}
  .amore-in .btn{grid-column:1/-1;margin-top:12px}
}

/* Activity page */
.actfilters{display:grid;gap:8px;margin:0 0 12px}
.chiprow{display:flex;gap:6px;flex-wrap:wrap}
.fchip{border:1px solid var(--line);background:#fff;border-radius:18px;padding:6px 12px;font-size:13.5px;text-decoration:none;color:var(--ink);white-space:nowrap}
.fchip small{color:var(--muted);margin-left:2px}
.fchip.on{background:var(--navy);border-color:var(--navy);color:#fff}.fchip.on small{color:#d7d6ec}
.actday{font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--red);margin:14px 0 4px;padding-top:10px;border-top:1px solid var(--line)}
.actday:first-child{border-top:0;margin-top:6px}
.actrow{display:grid;grid-template-columns:74px 92px 1fr;gap:8px;align-items:start;padding:7px 0;border-bottom:1px dashed #efe8e3;font-size:14.5px;color:var(--ink)}
.actt{color:var(--muted);font-size:13px;white-space:nowrap}
.acttag{font-size:11.5px;font-weight:700;border-radius:10px;padding:2px 8px;text-align:center;background:#eceaf7;color:var(--navy);white-space:nowrap}
.acttag.customer{background:var(--ok-soft);color:var(--ok)}.acttag.auto{background:#f1eeea;color:#6b6770}
.actw{min-width:0;word-break:break-word}
@media(max-width:560px){.actrow{grid-template-columns:62px 1fr}.acttag{grid-column:2;justify-self:start}.actw{grid-column:1/-1}}

.ndrow{display:grid;grid-template-columns:1.3fr 1fr auto auto;gap:8px;align-items:center;margin:0 0 8px}
.ndrow .input{min-height:42px;padding:8px 10px;font-size:14.5px}
@media(max-width:700px){.ndrow{grid-template-columns:1fr}}

/* dashboard: bigger appointment date, a family as one row that opens */
.adate.big{width:58px;height:62px;border-radius:14px;font-size:11.5px;gap:0}
.adate.big b{font-size:24px;line-height:1.05}
.adate.big small{font-size:10.5px;opacity:.85;letter-spacing:.04em}
details.arow{display:block;padding:0}
details.arow>summary{display:flex;align-items:center;gap:10px;padding:9px 0;cursor:pointer;list-style:none}
details.arow>summary::-webkit-details-marker{display:none}
.famn{font-weight:600;font-size:12.5px;color:var(--navy);background:#eceaf7;border-radius:10px;padding:2px 8px;margin-left:4px;white-space:nowrap}
.upfam[open] .famn{background:var(--navy);color:#fff}
.upfam-in{display:grid;gap:2px;margin:0 0 10px 68px;padding:8px 10px;background:var(--sand);border-radius:10px}
.upfam-in a{padding:5px 0;color:var(--ink);text-decoration:none;font-weight:600;font-size:14.5px}
.upfam-in a:hover{color:var(--red)}
.upmore>summary{cursor:pointer;list-style:none;margin:10px 0 2px;font-weight:600}.upmore>summary::-webkit-details-marker{display:none}.upmore[open]>summary{display:none}
/* phone: headings and buttons never break in the middle of a word */
.admin .ch{flex-wrap:wrap;row-gap:6px}
.admin .ch h2,.admin h1,.admin h3{overflow-wrap:normal;word-break:normal}
.admin .btn{overflow-wrap:normal;word-break:normal}
@media(max-width:760px){.admin .ch h2{flex:1 1 60%}.admin .ch .btn[style*="margin-left:auto"]{margin-left:0!important}.admin .btn.sm2{white-space:nowrap}}
/* Ivory & Red: the last lavender corners on customer pages */
.cust .update{background:#fff;border:1px solid var(--line);border-left:4px solid var(--red);border-radius:14px;box-shadow:0 6px 22px rgba(46,45,90,.06)}
.cust .update b{color:var(--ink)}
.cust label.opt:has(input:checked){border-color:var(--ink);background:#fff3ee}
.cust .ppreading{background:#fff6ef;border-color:#efd9c8}
.cust .tag.review{background:#fff0ea;color:var(--red-dark)}
.cust .toast{white-space:nowrap;font-size:14px;padding:9px 16px;max-width:92vw}

/* customer visa page: appointment details near the top */
.topappt .tarow{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.topappt .tarow:first-of-type{border-top:0;padding-top:2px}
.topappt .tatxt{display:flex;flex-direction:column;gap:2px;min-width:0;color:var(--ink);font-size:15px}
.topappt .tatxt b{font-size:16px}
.topappt .taleft{font-style:normal;font-size:12px;font-weight:700;color:var(--red);background:#fde9e6;border-radius:10px;padding:1px 8px;margin-left:4px;white-space:nowrap}
.cust .adate.big{background:#fff3ee;color:var(--ink);flex:0 0 58px}
.cust .adate.big.soon{background:var(--red);color:#fff}

/* passport card: one big number */
.pphero{display:flex;gap:26px;align-items:center;border-radius:22px;padding:22px 18px 22px 22px;color:#fff;background:radial-gradient(circle at 95% -10%,rgba(206,39,46,.75),transparent 55%),radial-gradient(circle at 0% 120%,rgba(86,96,220,.3),transparent 55%),#14132b;box-shadow:0 14px 34px rgba(20,19,43,.22)}
.pphero .ppi{position:relative;flex:0 0 84px}
.pphero .ppi svg{display:block;width:84px;height:112px;filter:drop-shadow(0 8px 10px rgba(0,0,0,.45))}
.pphero .stamp{position:absolute;right:-18px;bottom:16px;background:linear-gradient(135deg,#ce272e,#8f1a20);color:#fff;border-radius:6px;padding:5px 8px;font-size:10px;font-weight:800;line-height:1.25;transform:rotate(-8deg);box-shadow:0 6px 12px rgba(0,0,0,.35);letter-spacing:.03em;white-space:nowrap}
.pphero .stamp small{display:block;font-weight:600;font-size:8px;opacity:.95}
.pptxt{display:flex;flex-direction:column;min-width:0}
.ppbig{font-size:68px;line-height:.95;font-weight:800;letter-spacing:-.04em;color:#fff}
.ppbig.sm{font-size:28px;line-height:1.1;letter-spacing:-.02em}
.ppcap{font-size:16px;font-weight:700;line-height:1.3;margin-top:8px;color:#ffd9da}
.ppsub{font-size:12.5px;color:#cfcde0;margin-top:8px}
@media(min-width:700px){.ppbig{font-size:92px}.pphero{padding:30px 34px;gap:40px}.ppcap{font-size:20px}}

.topappt{border-color:var(--red)!important;box-shadow:0 10px 28px rgba(206,39,46,.12)!important;margin-top:14px}
.topappt .tawho{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 2px}
.topappt .tawho i{font-style:normal;font-size:13.5px;font-weight:700;color:var(--ink);background:#fff3ee;border:1px solid #f1ddd2;border-radius:14px;padding:3px 10px;white-space:nowrap}
.topappt .tawho i.me{background:var(--ink);border-color:var(--ink);color:#fff}
.topappt .taleft{vertical-align:2px}
.topappt{margin-bottom:16px}

/* "Passport Pro" */
.propill{display:inline-block;background:linear-gradient(135deg,#f6d98a,#d9a93a);color:#3a2a00;border-radius:12px;padding:1px 12px 3px;white-space:nowrap;box-shadow:0 4px 12px rgba(217,169,58,.35)}
.pphero .protag{position:absolute;left:-10px;top:-10px;background:linear-gradient(135deg,#f6d98a,#d9a93a);color:#3a2a00;font-size:11px;font-weight:800;letter-spacing:.08em;border-radius:8px;padding:3px 8px;box-shadow:0 4px 10px rgba(0,0,0,.35);transform:rotate(-6deg)}
.ppup{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:10px;font-size:12.5px;font-weight:700}
.ppup i{font-style:normal;border:1px solid rgba(255,255,255,.3);border-radius:12px;padding:2px 9px;color:#d5d3e6;white-space:nowrap}
.ppup i.pro{background:linear-gradient(135deg,#f6d98a,#d9a93a);border-color:transparent;color:#3a2a00}
.ppup em{font-style:normal;color:#f6d98a}

/* congratulations + appointments in one card near the top */
.topappt.cheer{border-color:#bfe6cb!important;background:linear-gradient(170deg,#f1fbf4 0,#fff 34%);box-shadow:0 10px 28px rgba(32,128,74,.10)!important}
.tacg{text-align:center;padding:4px 4px 12px;border-bottom:1px dashed #cfe6d6;margin-bottom:12px}
.tacg .cg-h{font-size:40px;line-height:1}
.tacg h2{margin:8px 0 6px;font-size:21px;line-height:1.2;color:var(--ink)}
.tacg p{margin:0;font-size:15px;color:var(--grey)}
.tah{display:flex;align-items:center;gap:8px;margin:0 0 4px;font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:var(--red);font-weight:800}
.tah .icn{width:17px;height:17px}
.tanote{margin:10px 0 0;padding-top:10px;border-top:1px solid var(--line);font-size:14.5px;color:var(--grey);text-align:center}
.cust .paid{margin:12px 0}

/* footer: light, in the page's own ivory, instead of the dark block */
.cust .ftr{background:#fff;color:var(--grey);margin-top:40px;border-radius:0;border-top:1px solid var(--line);padding:26px 0 84px;font-size:14px}
.cust .ftr .wrap{position:relative}
.cust .ftr .wrap:before{content:"";position:absolute;left:16px;top:-28px;width:64px;height:3px;border-radius:0 0 3px 3px;background:var(--red)}
.ftr-top{display:flex;gap:12px;align-items:center}
.ftr-top img{flex:none;mix-blend-mode:multiply}
.cust .ftr-brand{margin:0;font-family:var(--font);font-size:18px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.ftr-trust{margin:2px 0 0!important;font-size:13px;color:var(--muted)}
.ftr-contact{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0 14px}
.fc{display:flex;align-items:center;gap:10px;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--bg);text-decoration:none;color:var(--ink)!important}
.fc .icn{flex:none;width:36px;height:36px;padding:9px;border-radius:50%;background:#fde8ea;color:var(--red);stroke:currentColor;fill:none;stroke-width:2;box-sizing:border-box}
.fc.wa .icn{background:#e3f6ea;color:#1a8a4a}
.fc span{display:flex;flex-direction:column;min-width:0}
.fc small{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:var(--muted)}
.fc b{font-size:15px;font-weight:700;overflow-wrap:anywhere}
.cust .ftr-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 12px;padding-top:14px;border-top:1px solid var(--line)}
.cust .ftr-links a{color:var(--ink);font-weight:600;text-decoration:none}
.cust .ftr-links a:hover{color:var(--red);text-decoration:underline}
.cust .ftr .small{color:var(--muted);font-size:12.5px;margin:0}
@media(max-width:560px){.ftr-contact{grid-template-columns:1fr}}

/* "Get Directions" under an appointment place: always on its own line, never broken in two */
.dirlink{display:table;margin-top:4px;white-space:nowrap;font-weight:700;color:var(--red)}

.photonote{margin:8px 0 0;padding:9px 12px;background:#fff3cd;border-left:4px solid #e0a800;border-radius:8px;font-size:14.5px;color:var(--ink)}

/* "Passport → Passport Pro" always stays on one line, also on narrow phones */
.ppup{flex-wrap:nowrap;white-space:nowrap}
.ppup em{flex:none}
@media(max-width:420px){.pphero{gap:16px;padding:20px 14px 20px 16px}.ppup{gap:5px;font-size:11.5px}.ppup i{padding:2px 7px}}
@media(max-width:345px){.pphero .ppi{flex-basis:66px}.pphero .ppi svg{width:66px;height:88px}.ppup{gap:4px;font-size:10.5px}.ppup i{padding:2px 6px}}

/* "1-Min Break" tab on the form: slim and light, so it does not sit on top of the questions */
.cust .gametab{top:auto;bottom:128px;background:rgba(255,255,255,.92);color:var(--muted);border:1px solid var(--line);border-right:0;border-radius:9px 0 0 9px;padding:7px 3px 8px;gap:3px;box-shadow:-1px 2px 8px rgba(18,17,43,.08);font:600 10px/1 var(--font);opacity:.9}
.cust .gametab .gt-i{font-size:12px}
.cust .gametab .gt-t{letter-spacing:.03em}
.cust .gametab:hover{background:#fff;color:var(--ink);opacity:1}
/* narrow phones: long names and buttons in admin lists wrap instead of pushing the page sideways */
.checkrow>span{min-width:0;overflow-wrap:anywhere}
@media(max-width:400px){.admin .frowsel,.admin .fcard{min-width:0}.admin .fcard *{overflow-wrap:anywhere}.admin .btn{white-space:normal}}
.dlsplit>*{min-width:0}
/* footer links: icons only on a phone, where they become small cards */
.cust .ftr-links a .icn,.cust .ftr-links a i{display:none}
@media(max-width:560px){
.cust .ftr-links{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding-top:16px;margin-bottom:16px}
.cust .ftr-links a{display:flex;align-items:center;gap:9px;padding:10px 11px;border:1px solid var(--line);border-radius:14px;background:#fff;font-size:13.5px;font-weight:700;line-height:1.2;box-shadow:0 2px 8px rgba(18,17,43,.05)}
.cust .ftr-links a .icn{display:block;flex:none;width:30px;height:30px;padding:7px;border-radius:9px;background:#fde8ea;color:var(--red);box-sizing:border-box}
.cust .ftr-links a.fl-site{grid-column:1/-1;background:linear-gradient(100deg,#fff1f1,#fff8ee);border-color:#f5d0d2;font-size:14.5px;padding:12px 13px}
.cust .ftr-links a.fl-site .icn{background:var(--red);color:#fff}
.cust .ftr-links a.fl-site i{display:block;margin-left:auto;font-style:normal;color:var(--red);font-size:17px}
.cust .ftr-links a.fl-legal{box-shadow:none;background:none;border-color:transparent;padding:4px 2px;font-weight:600;font-size:13px;color:var(--grey);justify-content:center}
.cust .ftr-links a.fl-legal .icn{width:16px;height:16px;padding:0;background:none;color:var(--muted)}
.cust .ftr-links a:hover{text-decoration:none}
}
.guidelink{display:inline-block;margin-top:6px;font-size:14px;font-weight:700;color:var(--red)}
@media(max-width:400px){.admin .btn,.admin .btn.sm2,.admin .btn.ghost.sm2{white-space:normal;max-width:100%;box-sizing:border-box}}
/* narrow phones: the red visa stamp stays clear of the "Countries…" words */
@media(max-width:420px){.pphero .stamp{right:-6px}}

/* "Back To Summary" when a section was opened with Edit from the summary page */
.tosumrow{margin:4px 0 12px}
.tosumrow .btn{width:100%}

/* case type: bold line at the top of a file, and three counters on the dashboard */
.casebar{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:8px 0 6px;padding:10px 14px;border-radius:12px;border:2px solid;font-size:15px}
.casebar b{font-size:17px;font-weight:800;letter-spacing:.01em;text-transform:uppercase}
.casebar span{font-size:13.5px;opacity:.9}
.casebar.dropbox{background:#e9f7ee;border-color:#1f7a4d;color:#14583a}
.casebar.interview{background:#eef0fb;border-color:#2e2d5a;color:#2e2d5a}
.casebar.check{background:#fff6dc;border-color:#d39b00;color:#6b4e00}
.casetiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 14px}
.casetiles .ct{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:14px;border:2px solid;text-decoration:none}
.casetiles .ct b{font-size:26px;line-height:1.1}
.casetiles .ct span{font-size:13px;font-weight:700}
.casetiles .ct.dropbox{background:#e9f7ee;border-color:#1f7a4d;color:#14583a}
.casetiles .ct.interview{background:#eef0fb;border-color:#2e2d5a;color:#2e2d5a}
.casetiles .ct.check{background:#fff6dc;border-color:#d39b00;color:#6b4e00}
@media(max-width:560px){.casetiles{grid-template-columns:1fr;gap:8px}.casetiles .ct{flex-direction:row;align-items:center;gap:12px;padding:10px 12px}.casetiles .ct b{font-size:22px;min-width:34px}}

/* "You are eligible for Dropbox" screen */
.dbpop-ov{position:fixed;inset:0;z-index:120;background:rgba(18,17,43,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.dbpop{width:100%;max-width:420px;background:#fff;border-radius:22px;padding:26px 22px 22px;text-align:center;border-top:6px solid #1f7a4d;box-shadow:0 24px 60px rgba(0,0,0,.3);animation:dbpop .35s ease-out}
.dbpop-i{font-size:54px;line-height:1}
.dbpop-k{margin:10px 0 2px;font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#1f7a4d}
.dbpop h2{margin:0 0 10px;font-size:24px;line-height:1.2;font-weight:800;color:var(--ink)}
.dbpop p{margin:0 0 10px;color:var(--grey);font-size:15.5px}
.dbpop p.small{font-size:13.5px;color:var(--muted);margin-bottom:16px}
@keyframes dbpop{from{transform:scale(.92);opacity:0}to{transform:none;opacity:1}}

/* summary page: "Edit" is a clear button on every section */
.sumedit{flex:none;padding:7px 14px!important;border:1.5px solid var(--red)!important;border-radius:999px!important;background:#fff4f4!important;color:var(--red)!important;font-weight:800!important;font-size:14px!important;text-decoration:none!important}
.sumedit:hover{background:var(--red)!important;color:#fff!important}
/* narrow phones: the bottom buttons (Back, Save & Exit, Submit) always fit on the screen */
@media(max-width:420px){.bar{gap:6px;padding-left:10px;padding-right:10px}.bar .btn{padding:10px 8px;font-size:13.5px;white-space:normal;line-height:1.15;min-width:0}.bar .btn.back{padding:10px 12px}}

/* answers that do not match: pop-up, note under the question, list on the summary page */
.dbpop.clash{border-top-color:var(--red)}
.dbpop-k.bad{color:var(--red)}
.dbpop .ask{font-weight:800;color:var(--ink)!important;margin:6px 0 16px!important}
.dbpop .btn+.btn{margin-top:8px}
.dbpop .linkbtn{display:block;margin:12px auto 0;font-weight:700;color:var(--grey);text-decoration:underline}
.clashnote{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:#fdecee;border-left:4px solid var(--red);color:#7a1218;font-size:14.5px;line-height:1.45}
.clashnote.acked{background:#f4f4f7;border-left-color:#8a8aa0;color:var(--grey)}
.clashcard{border:2px solid var(--red)!important;background:#fff6f6!important}
.clashcard h2{color:var(--red)}
.clashrow{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;padding:10px 0;border-top:1px solid #f3d4d6}
.clashrow p{margin:0;font-size:14.5px}
/* header: Log In / Sign Up next to WhatsApp */
.cust .pill.login{background:var(--ink);color:#fff;border-color:var(--ink)}
@media(max-width:420px){.cust .hdr-r{gap:6px}.cust .hdr-r .pill{padding:7px 10px;font-size:12.5px;white-space:nowrap}.cust .logo .lt b{font-size:13px}}

/* header on phones: WhatsApp becomes a round icon so "Log In / Sign Up" and the tagline both fit */
.pill.wa .wai{display:none}
@media(max-width:480px){.cust .hdr-r .pill.wa{padding:0;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%}.cust .hdr-r .pill.wa .wai{display:block}.cust .hdr-r .pill.wa .wat{display:none}}
@media(max-width:345px){.cust .hdr-r .pill.login{font-size:11.5px;padding:6px 8px}.cust .logo img{width:36px;height:auto}}

/* Customer Emails › Alerts To Me: one On/Off per alert */
.alertgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}
.alertrow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.alertrow b{display:block;font-size:14px}.alertrow .small{display:block}
.alertrow select{width:auto;min-width:76px;flex:none}
@media(max-width:700px){.alertgrid{grid-template-columns:1fr}}

/* file › To check: each "will send later" question is a link to that answer */
.helplinks{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
.helplinks a{display:inline-block;padding:4px 10px;border-radius:999px;background:#fff;border:1px solid #e0b400;color:#6b4e00;font-size:13px;font-weight:600;text-decoration:none}
.helplinks a:hover{background:#fff3cd}

/* file header: name + badges on the left; buttons and the case type card on the right (phone: case card right under the name) */
.fhead{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t a" "t c";gap:10px 18px;align-items:start}
.fhead .fh-t{grid-area:t}
.fhead .fh-act{grid-area:a;justify-content:flex-end}
.fhead .casecard{grid-area:c;justify-self:end}
.casecard{display:flex;align-items:center;gap:12px;min-width:270px;max-width:420px;padding:10px 16px 10px 12px;border-radius:14px;border:2px solid}
.casecard .cc-i{flex:none;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;background:#fff}
.casecard .cc-t{display:flex;flex-direction:column;min-width:0}
.casecard small{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;opacity:.8}
.casecard b{font-size:19px;line-height:1.2;font-weight:800}
.casecard span:last-child{font-size:12.5px;opacity:.9}
.casecard.dropbox{background:#e9f7ee;border-color:#1f7a4d;color:#14583a}
.casecard.interview{background:#eef0fb;border-color:#2e2d5a;color:#2e2d5a}
.casecard.check{background:#fff6dc;border-color:#d39b00;color:#6b4e00}
@media(max-width:760px){.fhead{grid-template-columns:1fr;grid-template-areas:"t" "c" "a"}.fhead .casecard{justify-self:stretch;max-width:none;min-width:0}.fhead .fh-act{justify-content:flex-start}}
/* editing one section from the summary: a single full-width button */
.bar.onlysum{display:flex}
.bar.onlysum .btn{flex:1;width:100%}
/* 1-minute break: game chooser and the three games */
.game .gtop{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.game .ginfo{margin:2px 0 10px;min-height:1.3em}
.game .gback{width:100%;margin-top:12px}
.gpicks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.gpick{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 6px;border:1.5px solid var(--line);border-radius:14px;background:var(--sand);cursor:pointer;font:inherit;color:var(--ink);text-align:center}
.gpick:hover{border-color:var(--red)}
.gpick .gp-i{font-size:30px;line-height:1.1}
.gpick b{font-size:14px}
.gpick small{font-size:11.5px;color:var(--muted)}
.gagain{width:100%;margin-top:10px}
.xogrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:280px;margin:0 auto}
.xocell{aspect-ratio:1;border:1.5px solid var(--line);border-radius:12px;background:var(--sand);font-size:34px;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}
.xocell.win{background:#e7f6ec;border-color:#2e9e5b}
.lboard{display:grid;grid-template-columns:repeat(15,1fr);width:100%;max-width:330px;aspect-ratio:1;margin:0 auto;border:2px solid var(--ink);border-radius:6px;overflow:hidden;background:#fff}
.lc{position:relative;display:flex;align-items:center;justify-content:center;min-width:0}
.lc.path{border:.5px solid #d9d4cc}
.lc.zr{background:#e5484d}.lc.zg{background:#30a46c}.lc.zy{background:#f5c400}.lc.zb{background:#3e63dd}
.lc.mid{background:#f1ede6}
.lc.hr,.lc.sr{background:#f5a3a6}.lc.hy,.lc.sy{background:#fbe27a}
.ltok{width:78%;height:78%;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.45);padding:0;cursor:default;position:relative;z-index:1}
.ltok.tr{background:#c81e24}.ltok.ty{background:#c99a00}
.ltok.two{position:absolute;width:62%;height:62%;right:0;bottom:0}
.ltok.pick{cursor:pointer;animation:lpulse .8s ease-in-out infinite;outline:3px solid #12172b;outline-offset:0}
@keyframes lpulse{50%{transform:scale(1.25)}}
.lbar{display:flex;align-items:center;gap:12px;margin-top:10px}
.ldice{width:54px;height:54px;flex:none;border:0;border-radius:12px;background:var(--navy);color:#fff;font-size:36px;line-height:1;cursor:pointer;padding:0}
.ldice:disabled{opacity:.55;cursor:default}
.ldice.spin{animation:lspin .35s ease-out}
@keyframes lspin{from{transform:rotate(-200deg) scale(.7)}to{transform:none}}
.lmsg{font-size:14.5px;color:var(--ink)}
@media (prefers-reduced-motion:reduce){.ltok.pick,.ldice.spin{animation:none}}
.lboard{position:relative;grid-template-rows:repeat(15,1fr)}
.lc.mid{background:transparent}
.lyard{position:absolute;width:26.67%;height:26.67%;background:#fff;border-radius:10%;pointer-events:none;z-index:2;box-shadow:inset 0 0 0 2px rgba(0,0,0,.08)}
.lyard.lyr{left:6.67%;top:6.67%}.lyard.lyg{right:6.67%;top:6.67%}.lyard.lyy{right:6.67%;bottom:6.67%}.lyard.lyb{left:6.67%;bottom:6.67%}
.lhome{position:absolute;left:40%;top:40%;width:20%;height:20%;background:conic-gradient(from -45deg,#30a46c 0 25%,#f5c400 0 50%,#3e63dd 0 75%,#e5484d 0)}
.ltok{height:auto;aspect-ratio:1}
/* desktop: the "1-Min Break" sits as a small pill beside the form, not lost at the screen edge */
@media (min-width:1000px){
.cust .gametab{flex-direction:row;right:auto;left:calc(50% + 336px);bottom:120px;padding:8px 13px;gap:6px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);opacity:1;font:600 13px/1 var(--font);box-shadow:0 3px 12px rgba(18,17,43,.10)}
.cust .gametab .gt-i{font-size:15px}
.cust .gametab .gt-t{writing-mode:horizontal-tb;transform:none}
.cust .gametab:hover{border-color:var(--red);color:var(--red)}
}