/* Warm paper and carved forest-green controls keep copy readable over the photograph. */
#welcome-screen{overflow:auto;padding:calc(var(--header-height,76px) + 32px) 22px 60px;background-image:linear-gradient(90deg,#173f2e16,#173f2e08),url('assets/real-scenes/welcome-v1.webp')}
.welcome-copy{width:min(580px,100%);max-width:580px;padding:38px 44px 30px;color:#274934;text-shadow:none;border:1px solid #fff9e5d9;border-radius:34px;background:linear-gradient(145deg,#fff9e8f2,#f4eddbeb);box-shadow:inset 0 1px 0 #fffdf4,0 20px 65px #12332538;backdrop-filter:blur(8px)}
.welcome-copy:before{display:none}
.welcome-copy h1{font-family:"Noto Serif SC","Songti SC",SimSun,serif;font-size:clamp(42px,6vw,70px);font-weight:700;letter-spacing:.15em;padding-left:.15em;line-height:1.3;margin:0 0 17px;color:#244d35;text-shadow:0 2px 0 #fff9e6,0 4px 0 #b5b48e44}
.welcome-copy>p{color:#38553d;text-shadow:none;font-size:clamp(18px,2.2vw,23px);font-weight:500;letter-spacing:.1em;margin:0 0 30px;line-height:1.7}
.welcome-actions{width:100%;gap:18px;margin:0 auto 25px}
.welcome-actions button{min-height:68px;padding:17px 48px;font-size:clamp(17px,2vw,22px);font-weight:600;letter-spacing:.05em;border-radius:22px;border:1px solid #456746;color:#fff8e3;text-shadow:0 1px 1px #193823;background:linear-gradient(160deg,#658259,#365c3d 62%,#2b4f36);box-shadow:inset 0 2px 1px #d8e6bb99,inset 0 -3px 1px #23412a99,0 5px 0 #243f2c,0 10px 18px #25453026;backdrop-filter:none;transition:transform .15s,box-shadow .15s}
.welcome-actions #welcome-quiet{color:#354d35;text-shadow:0 1px 0 #fffaf0;background:linear-gradient(160deg,#fff9e9,#e6d9ba);border-color:#bbac87;box-shadow:inset 0 2px 1px #fffdf6,inset 0 -3px 1px #c3b18a99,0 5px 0 #a29370,0 10px 18px #25453022}
.welcome-actions button span{width:27px;height:27px;right:16px;font-family:system-ui,sans-serif;font-size:25px;line-height:1;color:inherit;background:#ffffff14;border-color:currentColor;opacity:.7}
.welcome-actions button:hover,.welcome-actions button:focus-visible{transform:translateY(-2px);filter:brightness(1.06);background:linear-gradient(160deg,#658259,#365c3d 62%,#2b4f36);box-shadow:inset 0 2px 1px #d8e6bb99,0 7px 0 #243f2c,0 12px 20px #25453030;outline:3px solid #cfab67;outline-offset:5px}
.welcome-actions #welcome-quiet:hover,.welcome-actions #welcome-quiet:focus-visible{background:linear-gradient(160deg,#fff9e9,#e6d9ba);box-shadow:inset 0 2px 1px #fffdf6,0 7px 0 #a29370,0 12px 20px #25453030}
.welcome-actions button:active,.welcome-actions #welcome-quiet:active{transform:translateY(4px);box-shadow:inset 0 2px 5px #243f2c33,0 1px 0 #7b8060}
.welcome-copy>small{color:#5a6552;text-shadow:none;font-size:11px;line-height:1.9}
#site-nav #music-toggle{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:40px;padding:6px 10px;border:1px solid #b7c4a577;border-radius:20px;background:#fff9e50c;color:inherit}
#music-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#music-toggle[aria-pressed="true"]{background:#d9e8bd!important;color:#284631!important;border-color:#b9ce9e!important}
#music-toggle[aria-pressed="true"] .music-slash{display:none}
.at-home #site-nav #music-toggle{border-color:#a8b69b;background:#fbf7e9}
/* Quiet mode still leaves the music switch available. */
body.resting #app-header{display:flex!important;background:transparent;box-shadow:none;backdrop-filter:none;pointer-events:none;justify-content:flex-end}
body.resting #home-brand,body.resting #scene-name,body.resting #scene-back,body.resting #site-nav>:not(#music-toggle){display:none!important}
body.resting #site-nav{margin-left:auto;width:auto;pointer-events:auto}
body.resting #site-nav #music-toggle{background:#214934ed;color:#fff5dc}
@media(max-width:600px){.welcome-copy{padding:27px 21px 24px;border-radius:26px}.welcome-copy h1{font-size:clamp(38px,10vw,52px);letter-spacing:.1em;padding-left:.1em}.welcome-copy>p{font-size:18px;margin-bottom:24px}.welcome-actions button{padding:15px 40px 15px 15px;font-size:18px;min-height:62px}.welcome-actions button span{right:12px;width:24px;height:24px}.welcome-copy>small{font-size:10px}#site-nav #music-toggle{min-height:40px;padding:6px 8px}#site-nav{column-gap:1px;row-gap:3px}#site-nav a,#site-nav button{padding:5px 6px}}
@media(prefers-reduced-motion:reduce){.welcome-actions button{transition:none}}
/* The top music control uses only its accessible icon. */
#site-nav #music-toggle{width:38px;height:38px;min-width:38px;min-height:38px;padding:0;gap:0;flex:none}
@media(max-width:600px){#site-nav #music-toggle{width:34px;height:34px;min-width:34px;min-height:34px;padding:0}}
/* v17: let the forest photo remain part of the welcome screen. */
#welcome-screen{padding-inline:18px}
.welcome-copy{width:min(460px,100%);max-width:460px;padding:28px 30px 25px;border-color:#fffdf4a6;border-radius:27px;background:linear-gradient(150deg,#fff9e8c9,#f3eddbc0);box-shadow:0 16px 44px #12332538;backdrop-filter:blur(5px)}
.welcome-copy h1{font-size:clamp(38px,5vw,58px);margin-bottom:8px}
.welcome-copy>p{font-size:clamp(16px,1.8vw,19px);margin-bottom:20px}
.welcome-actions{gap:12px;margin-bottom:18px}
.welcome-actions button{min-height:55px;padding:11px 45px;font-size:clamp(15px,1.7vw,18px);border-radius:17px}
@media(max-width:600px){.welcome-copy{width:min(360px,100%);padding:22px 19px 20px;border-radius:22px;background:linear-gradient(150deg,#fff9e8d1,#f3eddbc7)}.welcome-copy h1{font-size:clamp(37px,10vw,47px)}.welcome-copy>p{font-size:16px;margin-bottom:16px}.welcome-actions{gap:10px;margin-bottom:14px}.welcome-actions button{min-height:53px;padding:11px 35px 11px 12px;font-size:16px}}
#site-nav #music-toggle{margin-left:10px}