.family-onboarding{--ob-wine:var(--troubadour-pink-5);--ob-rose:var(--troubadour-burgundy-1);--ob-red:var(--troubadour-main);--ob-cream:var(--troubadour-cream-1);--ob-paper:var(--default-color-2);--ob-peach:var(--troubadour-orange-1);--ob-butter:var(--troubadour-main-10);--ob-ice:var(--troubadour-teal-3);--ob-mint:var(--troubadour-green-2);--ob-sky:var(--troubadour-teal-4);--ob-grey:var(--troubadour-grey-3);--ob-line:color-mix(in srgb, var(--ob-wine) 15%, transparent);--ob-shadow:color-mix(in srgb, var(--ob-wine) 20%, transparent);--ob-focus:color-mix(in srgb, var(--ob-red) 15%, transparent);--ob-h1:clamp(34px, 5vw, 44px);--ob-sub:clamp(16px, 2vw, 18px);--ob-input:clamp(18px, 2vw, 20px);--ob-button:clamp(17px, 2vw, 19px);--ob-label:clamp(12px, 1.4vw, 13px);background:var(--ob-cream);min-height:70vh;color:var(--ob-wine);flex-direction:column;font-family:Sofia Pro,Lato,sans-serif;display:flex}.family-onboarding .ob-backrow{z-index:15;box-sizing:border-box;width:100%;max-width:588px;margin:0 auto;padding:24px 24px 0;position:relative}.family-onboarding .ob-back{border:1.5px solid var(--ob-line);background:var(--ob-paper);width:44px;height:44px;color:var(--ob-wine);cursor:pointer;box-shadow:0 2px 8px color-mix(in srgb, var(--ob-wine) 12%, transparent);border-radius:50%;place-items:center;display:grid}.family-onboarding .ob-back:hover{background:var(--ob-cream)}.family-onboarding .ob-canvas{flex:1;justify-content:center;padding:12px 24px 80px;display:flex}.family-onboarding .ob-step{flex-direction:column;width:100%;max-width:540px;display:flex}.family-onboarding .ob-step-overlay{z-index:300;background:color-mix(in srgb, var(--ob-wine) 42%, transparent);place-items:center;max-width:none;padding:72px 16px 24px;display:grid;position:fixed;inset:0;overflow-y:auto}.family-onboarding .ob-gate{background:var(--ob-cream);width:100%;max-width:520px;box-shadow:0 24px 60px color-mix(in srgb, var(--ob-wine) 32%, transparent);border-radius:28px;flex-direction:column;padding:20px 28px 26px;display:flex;position:relative}.family-onboarding .ob-gate .ob-mascot-row{justify-content:center;margin:-64px 0 4px}.family-onboarding .ob-gate .ob-mascot{width:88px;height:88px}.family-onboarding .ob-gate .ob-h1{text-align:center;margin:4px 0 6px;font-size:clamp(28px,4vw,34px)}.family-onboarding .ob-gate .ob-sub{text-align:center;max-width:none;color:var(--ob-wine);margin:0 0 14px;font-size:clamp(15px,1.6vw,16px)}.family-onboarding .ob-gate .ob-actions{margin-top:20px}.family-onboarding .ob-gate .ob-primary{width:100%}.family-onboarding .ob-gate .ob-fine{text-align:center;margin:12px 0 0}.family-onboarding .ob-mascot-row{margin-bottom:24px;display:flex}.family-onboarding .ob-mascot-row.ob-mascot-row-center{justify-content:center}.family-onboarding .ob-feather{justify-content:center;margin:-24px 0 -32px;display:flex}.family-onboarding .ob-feather canvas{width:clamp(300px,66vw,600px);height:auto;display:block}.family-onboarding.onboarding-tour-invite .ob-step{max-width:720px}.family-onboarding.onboarding-tour-invite .ob-sub{max-width:none;margin-bottom:14px}.family-onboarding.onboarding-tour-invite .ob-actions{margin-top:12px}.family-onboarding .ob-mascot{object-fit:contain;width:110px;height:110px;filter:drop-shadow(0 10px 18px color-mix(in srgb, var(--ob-wine) 18%, transparent))}.family-onboarding .ob-h1{font-family:FatFrank,Lato,sans-serif;font-size:var(--ob-h1);letter-spacing:.03em;text-transform:none;color:var(--ob-wine);margin:6px 0 8px;font-weight:400;line-height:1.05}.family-onboarding .ob-h1.ob-h1-center{text-align:center}.family-onboarding .ob-sub{max-width:460px;font-size:var(--ob-sub);color:var(--ob-rose);margin:0 0 24px;line-height:1.45}.family-onboarding .ob-sub.ob-sub-tight{margin:0 0 8px;font-size:clamp(13px,1.5vw,14px);line-height:1.35}.family-onboarding .ob-sub.ob-sub-center{text-align:center;align-self:center}.family-onboarding .ob-sub.ob-sub-strong{color:var(--ob-wine);font-weight:700}.family-onboarding .ob-fine{font-size:var(--ob-label);color:var(--ob-rose);opacity:.8;margin-top:14px}.family-onboarding .ob-label{font-size:var(--ob-label);letter-spacing:.06em;text-transform:uppercase;color:var(--ob-wine);margin:18px 0 8px;font-weight:800}.family-onboarding .ob-label.ob-label-big{margin-bottom:2px;font-size:clamp(15px,1.6vw,16px)}.family-onboarding .ob-input{box-sizing:border-box;border:2px solid var(--ob-line);background:var(--ob-paper);width:100%;height:auto;font-family:inherit;font-size:var(--ob-input);color:var(--ob-wine);border-radius:18px;padding:18px 22px;line-height:normal;transition:border-color .12s,box-shadow .12s}.family-onboarding .ob-input:focus{border-color:var(--ob-red);box-shadow:0 0 0 4px var(--ob-focus);outline:none}.family-onboarding .ob-input.ob-input-big{letter-spacing:.03em;text-align:center;padding:22px 26px;font-family:FatFrank,Lato,sans-serif;font-size:clamp(22px,3vw,28px)}.family-onboarding .ob-input.ob-input-dob{letter-spacing:.04em;text-align:center;width:80px;padding:16px 14px;font-family:FatFrank,Lato,sans-serif;font-size:clamp(20px,2.5vw,22px)}.family-onboarding .ob-input.ob-input-dob-year{width:120px}.family-onboarding .ob-dob{gap:10px;display:flex}.family-onboarding .ob-dob-group{border:0;min-width:0;margin:0;padding:0}.family-onboarding .ob-terms{border:2px solid color-mix(in srgb, var(--ob-wine) 12%, transparent);background:var(--ob-paper);border-radius:14px;max-height:150px;padding:12px 16px;font-size:clamp(13px,1.5vw,14px);line-height:1.45;overflow-y:auto}.family-onboarding .ob-terms ul{gap:4px;margin:6px 0 8px;padding-left:18px;display:grid}.family-onboarding .ob-terms a{color:var(--ob-red);font-weight:700}.family-onboarding .ob-consent-check{border:2px solid color-mix(in srgb, var(--ob-wine) 12%, transparent);background:var(--ob-paper);cursor:pointer;border-radius:14px;align-items:flex-start;gap:12px;margin-top:10px;padding:12px 14px;font-size:clamp(14px,1.6vw,15px);line-height:1.4;display:flex}.family-onboarding .ob-consent-check input{width:22px;height:22px;accent-color:var(--ob-wine);cursor:pointer;flex:none;margin-top:1px}.family-onboarding .ob-consent-check a{color:var(--ob-red);font-weight:700;text-decoration:underline}.family-onboarding .ob-error{background:color-mix(in srgb, var(--ob-red) 8%, transparent);color:var(--ob-red);border-radius:12px;margin:14px 0 0;padding:10px 14px;font-size:clamp(13px,1.5vw,14px);font-weight:700}.family-onboarding .ob-actions{flex-wrap:wrap;align-items:center;gap:12px;margin-top:32px;display:flex}.family-onboarding .ob-actions.ob-actions-center{justify-content:center}.family-onboarding .ob-primary{background:var(--ob-red);min-height:64px;color:var(--ob-paper);font-family:inherit;font-size:var(--ob-button);cursor:pointer;box-shadow:0 8px 22px var(--ob-shadow);border:0;border-radius:199px;justify-content:center;align-items:center;padding:18px 32px;font-weight:700;text-decoration:none;transition:transform .16s,box-shadow .16s;display:inline-flex}.family-onboarding .ob-primary:not(:disabled):hover{color:var(--ob-paper);transform:translateY(-2px)}.family-onboarding .ob-primary:disabled{background:var(--troubadour-grey-2);color:var(--ob-grey);box-shadow:none;cursor:not-allowed}.family-onboarding .ob-primary .fa-arrow-right{font-size:var(--ob-button);margin-left:10px}.family-onboarding .ob-textlink{color:var(--ob-red);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;align-self:center;align-items:center;gap:8px;margin-top:14px;padding:8px;font-size:clamp(15px,1.6vw,16px);font-weight:700;text-decoration:underline;display:inline-flex}.family-onboarding .ob-textlink:hover{color:var(--ob-wine)}.family-onboarding .ob-google-icon{width:18px;height:18px}.family-onboarding .ob-pwd-row{display:flex;position:relative}.family-onboarding .ob-pwd-row .ob-input{padding-right:96px}.family-onboarding .ob-pwd-toggle{font-family:inherit;font-size:var(--ob-label);color:var(--ob-wine);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:8px 14px;font-weight:800;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.family-onboarding .ob-pwd-toggle:hover{background:color-mix(in srgb, var(--ob-wine) 8%, transparent)}.family-onboarding .ob-whoav{grid-template-columns:1fr 1fr;gap:16px;margin-top:12px;display:grid}.family-onboarding .ob-tile{background:var(--ob-peach);text-align:center;cursor:pointer;border:4px solid #0000;border-radius:22px;flex-direction:column;align-items:center;gap:6px;padding:22px 16px 20px;font-family:inherit;transition:transform .16s,border-color .16s,box-shadow .16s;display:flex;position:relative}.family-onboarding .ob-tile:hover{border-color:color-mix(in srgb, var(--ob-wine) 25%, transparent);transform:translateY(-3px)}.family-onboarding .ob-tile:focus-visible{outline:3px solid color-mix(in srgb, var(--ob-red) 45%, transparent);outline-offset:3px}.family-onboarding .ob-tile[data-tone=butter]{background:var(--ob-butter)}.family-onboarding .ob-tile[data-tone=ice]{background:var(--ob-ice)}.family-onboarding .ob-tile[data-tone=mint]{background:var(--ob-mint)}.family-onboarding .ob-tile[data-tone=sky]{background:var(--ob-sky)}.family-onboarding .ob-tile.is-selected{border-color:var(--ob-red);box-shadow:0 10px 22px color-mix(in srgb, var(--ob-red) 30%, transparent)}.family-onboarding .ob-tile.is-selected:after{content:"✓";background:var(--ob-red);width:32px;height:32px;color:var(--ob-paper);box-shadow:0 4px 10px color-mix(in srgb, var(--ob-red) 40%, transparent);border-radius:50%;place-items:center;font-size:clamp(15px,1.6vw,16px);font-weight:900;display:grid;position:absolute;top:-10px;right:-10px}.family-onboarding .ob-whoav-card-parent{background:var(--ob-peach)}.family-onboarding .ob-whoav-card-child{background:var(--ob-ice)}.family-onboarding .ob-whoav-art img{object-fit:contain;width:120px;height:120px}.family-onboarding .ob-whoav-title{letter-spacing:.03em;color:var(--ob-wine);font-family:FatFrank,Lato,sans-serif;font-size:clamp(22px,3vw,26px);line-height:1.05}.family-onboarding .ob-whoav-sub{color:var(--ob-wine);font-size:clamp(14px,1.6vw,15px);font-weight:700;line-height:1.35}.family-onboarding .ob-avatars{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:8px;display:grid}.family-onboarding .ob-avatar-tile{justify-content:flex-start;gap:8px;padding:16px 10px 12px}.family-onboarding .ob-avatar-img{object-fit:contain;width:68px;height:68px;padding:2px}.family-onboarding .ob-tile-label{text-align:center;color:var(--ob-wine);font-size:clamp(12px,1.4vw,13px);font-weight:700;line-height:1.2}.family-onboarding .ob-count{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:8px;display:grid}.family-onboarding .ob-count-btn{aspect-ratio:1;border:2px solid var(--ob-line);background:var(--ob-paper);color:var(--ob-wine);cursor:pointer;border-radius:20px;font-family:inherit;font-size:clamp(28px,4vw,36px);font-weight:800;transition:background .12s,border-color .12s}.family-onboarding .ob-count-btn:hover{background:var(--ob-cream)}.family-onboarding .ob-count-btn.is-selected{border-color:var(--ob-red);background:var(--troubadour-red-1);box-shadow:0 0 0 3px color-mix(in srgb, var(--ob-red) 20%, transparent)}.family-onboarding .ob-kidnames{flex-direction:column;gap:4px;display:flex}.family-onboarding .ob-pin{justify-content:center;gap:12px;margin:8px 0 6px;display:flex;position:relative}.family-onboarding .ob-pin-box{border:2px solid color-mix(in srgb, var(--ob-red) 30%, transparent);background:var(--ob-paper);width:64px;height:76px;color:var(--ob-wine);border-radius:18px;place-items:center;font-family:FatFrank,Lato,sans-serif;font-size:clamp(32px,4vw,40px);transition:border-color .15s,box-shadow .15s;display:grid}.family-onboarding .ob-pin-box.is-active{border-color:var(--ob-red);box-shadow:0 0 0 4px color-mix(in srgb, var(--ob-red) 18%, transparent)}.family-onboarding .ob-pin-input{opacity:0;color:#0000;caret-color:#0000;border:0;width:100%;height:100%;padding:0;position:absolute;inset:0}@media (width<=767px){.family-onboarding .ob-backrow{padding:14px 16px 0}.family-onboarding .ob-canvas{padding:12px 16px 60px}.family-onboarding .ob-primary{width:100%;min-height:58px;padding:16px 24px}.family-onboarding .ob-actions{flex-direction:column-reverse}.family-onboarding .ob-whoav{grid-template-columns:1fr}.family-onboarding .ob-whoav-art img{width:76px;height:76px}.family-onboarding .ob-avatars{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.family-onboarding .ob-avatar-img{width:60px;height:60px}}@media (width<=480px){.family-onboarding .ob-gate{padding:18px 18px 22px}}
