/* V3.24 — first-visit guide. Scoped styles; existing app screens are unchanged. */
.welcome-utility-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
.welcome-help-button{flex:0 0 auto;min-height:40px;border:1px solid rgba(255,211,128,.3);border-radius:999px;padding:8px 11px;color:#ffe0a2;background:rgba(255,182,77,.07);font:inherit;font-size:12px;font-weight:700;white-space:nowrap;cursor:pointer}
.welcome-help-button:hover{background:rgba(255,182,77,.15)}
.welcome-utility-actions .account-btn{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#welcomeGuide{position:fixed;inset:0;box-sizing:border-box;width:min(600px,calc(100vw - 28px));max-width:none;max-height:calc(100vh - 28px);max-height:calc(100dvh - 28px);margin:auto;padding:0;border:1px solid #976126;border-radius:28px;overflow:hidden;color:#fff4e6;background:#170703;box-shadow:0 26px 80px rgba(0,0,0,.6),0 0 42px rgba(208,94,15,.12);font-family:inherit;z-index:450}
#welcomeGuide:not([open]){display:none}
#welcomeGuide[open]{display:flex;animation:welcome-arrive .22s ease-out both}
#welcomeGuide::backdrop{background:rgba(6,2,1,.84)}
.welcome-shell{display:flex;flex-direction:column;width:100%;min-height:0;max-height:calc(100vh - 30px);max-height:calc(100dvh - 30px)}
.welcome-heading{position:relative;flex-shrink:0;padding:24px 27px 19px;border-bottom:1px solid rgba(255,203,119,.13);background:radial-gradient(ellipse at 8% 0,rgba(180,62,8,.52),transparent 75%),linear-gradient(125deg,#381008,#1c0803)}
.welcome-brand{display:block;padding-right:48px;color:#f5bb60;font-size:11px;font-weight:800;letter-spacing:.13em;line-height:1.8}
.welcome-close{position:absolute;right:14px;top:13px;display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,235,198,.2);border-radius:50%;background:rgba(0,0,0,.24);color:#fff1dc;font:inherit;font-size:29px;line-height:1;cursor:pointer}
.welcome-close:hover{background:rgba(255,255,255,.12)}
#welcomeTitle{font-size:clamp(21px,4.8vw,26px);line-height:1.48;letter-spacing:0;margin:11px 0 0;font-weight:900;outline:none;color:#fff4df}
.welcome-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:19px 27px 15px;scrollbar-width:thin;scrollbar-color:#805329 #170703;font-size:15px;line-height:1.65;color:#e9d5c4}
.welcome-intro{margin:0 0 20px;line-height:1.72}
.welcome-body strong{color:#fff1d2;font-weight:800}
.welcome-body h3{font-size:15px;letter-spacing:.01em;color:#ffc569;margin:0 0 11px}
.welcome-steps{list-style:none;counter-reset:welcome-step;margin:0;padding:0;display:grid;gap:10px}
.welcome-steps li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start;padding:10px 12px;border:1px solid rgba(255,208,134,.1);border-radius:15px;background:rgba(255,227,182,.035)}
.welcome-steps li p{margin:0;padding-top:1px;overflow-wrap:anywhere}
.welcome-number{width:30px;height:30px;display:grid;place-items:center;color:#ffd073;border-radius:10px;border:1px solid rgba(255,180,75,.23);background:linear-gradient(145deg,#50210b,#2e0f05);box-shadow:inset 0 1px rgba(255,225,166,.13);font-size:14px;font-weight:900;line-height:1}
.welcome-hashtag{color:#ffc367!important;white-space:nowrap}
.welcome-member-note{margin:16px 0 0;padding:12px 14px;border-left:3px solid #efae51;border-radius:0 12px 12px 0;background:rgba(245,180,72,.06);color:#efdac5;font-size:14px;line-height:1.75}
.welcome-footer{flex-shrink:0;padding:14px 27px 21px;padding-bottom:max(21px,env(safe-area-inset-bottom));border-top:1px solid rgba(255,203,119,.1);background:linear-gradient(#210a04,#170703)}
.welcome-start{width:100%;min-height:53px;display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 15px;border:1px solid #ffd67b;border-radius:15px;background:linear-gradient(115deg,#ffbd50,#ff8c32);color:#281006;box-shadow:inset 0 1px rgba(255,255,255,.35),0 5px 0 #85300b,0 10px 23px rgba(255,120,22,.16);font:inherit;font-size:17px;font-weight:900;cursor:pointer;transition:transform .15s ease,filter .15s ease}
.welcome-start:active{transform:translateY(2px)}
.welcome-start:hover{filter:brightness(1.04)}
.welcome-start span{font-size:22px;line-height:1}
.welcome-start:focus-visible,.welcome-close:focus-visible,.welcome-help-button:focus-visible{outline:3px solid #fff0c8;outline-offset:3px}
.welcome-guide-open,.welcome-guide-open body{overflow:hidden;overscroll-behavior:none}
.welcome-guide-open .site-header *,.welcome-guide-open .app-shell *,.welcome-guide-open .bottom-nav *{animation-play-state:paused!important}
/* Fallback only for browsers without dialog.showModal(). */
.welcome-fallback-backdrop{position:fixed;inset:0;z-index:449;background:rgba(6,2,1,.84)}
@keyframes welcome-arrive{from{opacity:0;transform:translateY(9px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:540px){
 .welcome-utility-actions{gap:5px;flex:0 1 auto}
 .welcome-help-button{padding:7px 8px;min-height:37px;font-size:11px}
 .welcome-utility-actions .account-btn{max-width:118px}
 .utility-row{gap:7px}
 .utility-row .brand-btn{min-width:0;flex-shrink:1}
 .utility-row .brand-btn strong{font-size:15px;line-height:1.35;display:block}
 #welcomeGuide{width:calc(100vw - 22px);border-radius:23px;max-height:calc(100vh - 22px);max-height:calc(100dvh - 22px)}
 .welcome-shell{max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}
 .welcome-heading{padding:19px 19px 15px}
 .welcome-close{right:10px;top:9px}
 .welcome-brand{font-size:10px}
 #welcomeTitle{font-size:23px;line-height:1.45;margin-top:10px}
 .welcome-body{padding:16px 17px 13px;font-size:14px;line-height:1.65}
 .welcome-intro{margin-bottom:16px}
 .welcome-steps{gap:9px}
 .welcome-steps li{gap:9px;grid-template-columns:28px minmax(0,1fr);padding:10px}
 .welcome-number{width:27px;height:28px;font-size:13px;border-radius:9px}
 .welcome-member-note{font-size:13px;padding:10px 11px;line-height:1.75;margin-top:14px}
 .welcome-footer{padding:13px 17px 17px;padding-bottom:max(17px,env(safe-area-inset-bottom))}
 .welcome-start{min-height:51px;font-size:16px}
}
@media(max-width:360px){#welcomeTitle{font-size:21px}.welcome-body{font-size:13.5px}.welcome-utility-actions .account-btn{max-width:95px}.utility-row .brand-btn strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){#welcomeGuide[open]{animation:none}.welcome-start{transition:none}}
