@font-face{font-family:Inter;font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/inter-400-800-latin.woff2) format('woff2')}@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/poppins-600-latin.woff2) format('woff2')}@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/poppins-700-latin.woff2) format('woff2')}@font-face{font-family:Poppins;font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/poppins-800-latin.woff2) format('woff2')}
/* FIND A FUNDI — clickable app prototype. Navy #232D43 · Orange #D75939 · White #FFFFFF */
:root{--navy:#232D43;--navy-d:#1A2234;--orange:#D75939;--orange-d:#B9462A;--orange-l:#FBE9E3;--cream:#F7F5F2;--ink:#1B2232;--mute:#667085;--line:#E6E8EE;--ok:#2E9E6B;--ok-l:#E3F4EC;--warn:#E5A100;--wa:#25D366}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;background:#E9ECF2;color:var(--ink)}
h1,h2,h3,h4{font-family:Poppins,Inter,sans-serif;color:var(--navy);margin:0}
.stage{display:grid;grid-template-columns:300px 1fr;min-height:100vh}
.side{background:var(--navy);color:#C9D1E0;padding:22px 18px;overflow:auto;max-height:100vh;position:sticky;top:0}
.side img{height:70px;margin-bottom:6px}.side h4{color:#fff;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;margin:18px 0 6px}
.side a{display:block;color:#C9D1E0;text-decoration:none;font-size:.86rem;padding:5px 10px;border-radius:8px}
.side a.on,.side a:hover{background:rgba(255,255,255,.1);color:#fff}
.side .lg{display:flex;gap:4px;margin-top:8px}.side .lg button{flex:1;border:0;border-radius:8px;padding:6px;font:700 .78rem Inter;background:rgba(255,255,255,.1);color:#fff;cursor:pointer}.side .lg button.on{background:var(--orange)}
.main{display:flex;align-items:center;justify-content:center;padding:30px;gap:40px;flex-wrap:wrap}
.notes{max-width:340px;font-size:.92rem;color:#475069}.notes h2{font-size:1.3rem;margin-bottom:8px}.notes .k{display:inline-block;background:#fff;border-radius:6px;padding:2px 8px;font-size:.75rem;font-weight:700;color:var(--orange);margin-bottom:8px}
.device{width:390px;height:844px;border-radius:54px;background:#0E1320;padding:12px;box-shadow:0 40px 80px rgba(35,45,67,.35);flex:none}
.screen{width:366px;height:820px;border-radius:44px;overflow:hidden;position:relative;background:#fff;display:flex;flex-direction:column}
body.shot{background:#fff}body.shot .side,body.shot .notes{display:none}body.shot .stage{display:block}body.shot .main{padding:0;display:block}
body.shot .device{width:390px;height:844px;border-radius:0;padding:0;box-shadow:none}body.shot .screen{width:390px;height:844px;border-radius:0}
.status{height:44px;flex:none;display:flex;justify-content:space-between;align-items:center;padding:0 26px;font:600 .82rem Inter;color:var(--ink);position:relative;z-index:5}
.status.light{color:#fff}.status .r{letter-spacing:2px}
.body{flex:1;overflow:auto;position:relative}.body.pad{padding:8px 20px 20px}
.mapbg{position:absolute;inset:0}
.top-float{position:absolute;left:14px;right:14px;top:50px;display:flex;gap:10px;align-items:center;z-index:4}
.circle{width:44px;height:44px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.12);font-size:1.1rem;flex:none;cursor:pointer}
.search{flex:1;background:#fff;border-radius:999px;height:44px;display:flex;align-items:center;padding:0 16px;gap:8px;box-shadow:0 4px 14px rgba(0,0,0,.12);font-size:.88rem;color:var(--mute)}
.sheet{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:28px 28px 0 0;box-shadow:0 -8px 30px rgba(0,0,0,.14);padding:10px 20px 26px;z-index:6;max-height:88%;overflow:auto}
.sheet:before{content:"";display:block;width:42px;height:5px;border-radius:9px;background:#D6DAE2;margin:0 auto 14px}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:16px;border-radius:16px;border:0;font:700 1rem Inter;cursor:pointer;text-decoration:none}
.btn.p{background:var(--orange);color:#fff}.btn.n{background:var(--navy);color:#fff}.btn.g{background:#F1F3F7;color:var(--navy)}.btn.o{background:#fff;color:var(--navy);border:1.5px solid var(--line)}.btn.wa{background:var(--wa);color:#fff}
.btn.sm{padding:11px;font-size:.88rem;border-radius:12px}
.row2{display:flex;gap:10px}.row2>*{flex:1}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{padding:10px 14px;border-radius:14px;border:1.5px solid var(--line);font-weight:600;font-size:.86rem;color:var(--navy);background:#fff;display:flex;align-items:center;gap:6px;cursor:pointer}
.chip.on{border-color:var(--orange);background:var(--orange-l);color:var(--orange-d)}
.lbl{font-weight:700;font-size:.8rem;color:var(--mute);text-transform:uppercase;letter-spacing:.06em;margin:14px 0 8px}
.inp{border:1.5px solid var(--line);border-radius:14px;padding:13px 14px;font-size:.92rem;color:var(--ink);background:#fff}
.inp.ta{min-height:72px;line-height:1.4}
.photos{display:flex;gap:8px}.ph{width:64px;height:64px;border-radius:12px;background:linear-gradient(135deg,#9FB4C8,#5E7690);display:grid;place-items:center;color:#fff;font-size:1.3rem}.ph.add{background:#F1F3F7;color:var(--mute);border:1.5px dashed #C9CED8}
.card{border:1px solid var(--line);border-radius:18px;padding:14px;background:#fff}
.fcard{display:flex;gap:12px;align-items:center}
.av{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#F3A68F,#D75939);color:#fff;font:800 1.05rem Poppins;display:grid;place-items:center;flex:none;position:relative}
.av.sm{width:38px;height:38px;font-size:.8rem}.av.n{background:linear-gradient(135deg,#4A5A7D,#232D43)}
.av .v{position:absolute;right:-2px;bottom:-2px;width:18px;height:18px;border-radius:50%;background:var(--ok);border:2px solid #fff;font-size:.6rem;display:grid;place-items:center}
.nm{font-weight:700;color:var(--navy)}.sub{font-size:.8rem;color:var(--mute)}
.badge{display:inline-flex;align-items:center;gap:4px;padding:4px 9px;border-radius:999px;font-size:.72rem;font-weight:700;background:var(--orange-l);color:var(--orange-d)}
.badge.ok{background:var(--ok-l);color:var(--ok)}.badge.nv{background:#E7EAF1;color:var(--navy)}.badge.w{background:#FFF4D6;color:#8A6200}
.line{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px dashed var(--line);font-size:.9rem}
.line.t{border:0;font-weight:800;font-size:1.05rem;color:var(--navy)}.line s{color:var(--mute)}
.waive{background:var(--ok-l);color:#185E40;border-radius:14px;padding:12px;font-size:.83rem;display:flex;gap:8px;line-height:1.35}
.info{background:#F1F3F7;border-radius:14px;padding:12px;font-size:.82rem;color:#475069;line-height:1.4}
.steps{display:flex;gap:6px;margin:6px 0 12px}.steps i{flex:1;height:5px;border-radius:9px;background:#E3E6EC}.steps i.on{background:var(--orange)}
.tl{display:flex;justify-content:space-between;margin:10px 0}.tl div{flex:1;text-align:center;font-size:.68rem;color:var(--mute);font-weight:600;position:relative}
.tl div b{display:block;width:26px;height:26px;border-radius:50%;background:#E3E6EC;margin:0 auto 4px;line-height:26px;color:#fff;font-size:.7rem}
.tl div.on b{background:var(--orange)}.tl div.done b{background:var(--ok)}.tl div.on{color:var(--orange-d)}
.tabbar{height:78px;flex:none;border-top:1px solid var(--line);display:flex;justify-content:space-around;align-items:flex-start;padding-top:10px;background:#fff;z-index:7}
.tabbar a{font-size:.68rem;color:var(--mute);text-align:center;text-decoration:none;font-weight:600;cursor:pointer}.tabbar a span{display:block;font-size:1.25rem;margin-bottom:2px;filter:grayscale(1);opacity:.6}
.tabbar a.on{color:var(--orange)}.tabbar a.on span{filter:none;opacity:1}
.hdr{display:flex;align-items:center;gap:12px;padding:6px 18px 12px}.hdr h3{font-size:1.15rem;flex:1}
.back{width:38px;height:38px;border-radius:12px;background:#F1F3F7;display:grid;place-items:center;cursor:pointer;font-weight:800;color:var(--navy)}
.list .it{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.ico{width:42px;height:42px;border-radius:12px;background:var(--orange-l);display:grid;place-items:center;font-size:1.2rem;flex:none}
.ico.n{background:#E7EAF1}.ico.ok{background:var(--ok-l)}
.toggle{width:50px;height:30px;border-radius:99px;background:var(--ok);position:relative;flex:none}.toggle:after{content:"";position:absolute;right:3px;top:3px;width:24px;height:24px;border-radius:50%;background:#fff}
.toggle.off{background:#CBD0DA}.toggle.off:after{right:auto;left:3px}
.bubble{max-width:78%;padding:10px 13px;border-radius:16px;font-size:.88rem;margin:6px 0;line-height:1.35}
.bubble.me{background:var(--navy);color:#fff;margin-left:auto;border-bottom-right-radius:4px}.bubble.them{background:#F1F3F7;border-bottom-left-radius:4px}
.stars{font-size:2rem;color:#F5B301;letter-spacing:4px;text-align:center}
.big-num{font:800 2rem Poppins;color:var(--navy)}
.bars{display:flex;align-items:flex-end;gap:10px;height:110px;margin:10px 0}.bars div{flex:1;background:var(--orange);border-radius:8px 8px 3px 3px;position:relative}.bars div.n{background:#D9DEE8}
.bars div span{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:.68rem;color:var(--mute)}
.overlay{position:absolute;inset:0;background:rgba(14,19,32,.45);z-index:8}
.pulse-ring{position:absolute;left:50%;top:40%;width:20px;height:20px;margin:-10px;border-radius:50%;background:var(--orange)}
.countdown{width:56px;height:56px;border-radius:50%;border:5px solid var(--orange);display:grid;place-items:center;font:800 1rem Poppins;color:var(--navy);flex:none;border-left-color:#F1D3CA}
.splash{background:var(--navy);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;padding:30px}
.kbd{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.kbd div{background:#F1F3F7;border-radius:12px;padding:12px;text-align:center;font:600 1.2rem Inter}
.otp{display:flex;gap:10px;justify-content:center;margin:18px 0}.otp div{width:48px;height:58px;border-radius:14px;border:1.5px solid var(--line);display:grid;place-items:center;font:800 1.4rem Poppins;color:var(--navy)}.otp div.on{border-color:var(--orange)}
.soon{font-size:.66rem;font-weight:800;color:#8A6200;background:#FFF4D6;border-radius:6px;padding:2px 6px;margin-left:6px}
@media (max-width:760px){.stage{grid-template-columns:1fr}.side{position:static;max-height:none}}

/* two-way ratings + role choice */
.chip.rolec{justify-content:flex-start;gap:10px;padding:12px;line-height:1.2}
.crow{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-weight:600;font-size:.88rem;color:var(--navy)}
.crow:last-child{border-bottom:0}.crow .s{color:#F5B301;font-size:1.1rem;letter-spacing:2px}.crow .s i{font-style:normal;color:#D5D9E2}
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin-top:10px}.cgrid div{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:6px}.cgrid b{color:var(--navy)}
.custr{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px 10px;border:1px solid var(--line);border-radius:14px;background:#fff}
