*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#121b21;color:#efe8db;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Malgun Gothic',sans-serif}button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid #e8b275;outline-offset:4px}#world{display:block;width:100%;height:100%;touch-action:none;outline:none}header{position:absolute;inset:max(28px,env(safe-area-inset-top)) 32px auto;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.brand,.tools{pointer-events:auto}.brand{display:flex;align-items:center;gap:12px;text-align:left;padding:0;text-shadow:0 2px 12px #0007}.brand-icon{font-size:31px;color:#ecc299;font-weight:200}.brand>span:last-child{font-size:18px;letter-spacing:2px;font-weight:500}.brand small{display:block;font-size:10px;font-weight:400;letter-spacing:1.3px;color:#c2bbae;margin-top:5px}.tools{display:flex;gap:8px}.icon-button{width:42px;height:42px;display:grid;place-items:center;border:1px solid #b8b9aa33;border-radius:50%;background:#111b2180;backdrop-filter:blur(16px)}.icon-button:hover{background:#283136b3}.icon-button>span{font-family:Georgia,serif;font-style:italic;font-size:19px}.icon-button[aria-pressed=true]{color:#e7bb83;border-color:#e7bb8355}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.invitation{position:absolute;top:115px;left:20px;right:20px;display:flex;align-items:center;justify-content:center;gap:13px;font-size:11px;letter-spacing:2.5px;color:#ded9caa3;pointer-events:none;text-shadow:0 1px 8px #0006}.invitation span{height:1px;width:22px;background:#d8c8aa40}#nameplate{position:absolute;left:0;top:0;transform:translate(-50%,-100%);padding:4px 9px;border:1px solid #f1ddbb55;background:#1d2521a6;border-radius:20px;color:#ead7b7;font-size:10px;letter-spacing:1px;pointer-events:none;backdrop-filter:blur(8px)}.bottom{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);text-align:center}nav{display:flex;align-items:center;gap:5px;padding:7px 10px;border:1px solid #b7b09b44;border-radius:26px;background:linear-gradient(145deg,#26302bba,#111a20d9);backdrop-filter:blur(24px);box-shadow:inset 0 1px 0 #fff1,0 10px 40px #0003}nav button{width:88px;height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border-radius:20px;color:#d4d1c6;transition:background .2s,color .2s}nav button[aria-pressed=true]{color:#edc396;background:#d4af6c12}nav button:hover{background:#c5b08918}nav i{display:block;height:24px}nav button span{font-size:11px;letter-spacing:.5px}.separator{width:1px;height:25px;background:#d4d1c619}.hint{margin:13px 0 0;font-size:10px;letter-spacing:.3px;color:#c1c9c180;white-space:nowrap}.hint b{font-weight:400;margin:0 7px}#toast{position:absolute;bottom:145px;left:50%;transform:translateX(-50%);margin:0;padding:11px 18px;border:1px solid #d6c5a433;background:#1e2822d9;backdrop-filter:blur(16px);border-radius:24px;font-size:12px;color:#e5dcc9;white-space:nowrap;opacity:0;transition:opacity .25s;pointer-events:none}#toast.visible{opacity:1}dialog{width:calc(100% - 48px);max-width:340px;padding:32px;background:#1e282b;color:#e9e2d6;border:1px solid #e9dfc933;border-radius:24px;box-shadow:0 20px 80px #0006}dialog::backdrop{background:#07121b99;backdrop-filter:blur(10px)}dialog .eyebrow{font-size:10px;letter-spacing:2px;color:#b7b39e}dialog h1{font-size:22px;font-weight:500;line-height:1.6;margin:16px 0}dialog p{font-size:12px;line-height:1.9;color:#c6c7bb}dialog .note{font-size:11px;color:#a7afa7;border-top:1px solid #e9dfc919;padding-top:16px}.dialog-close{margin-top:10px;border:1px solid #c7ad7e55;background:#d3ae6b0d;padding:12px 20px;border-radius:24px;font-size:12px;color:#e3caa0}#boot{position:absolute;inset:0;background:#121d25;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;transition:opacity .6s;z-index:10}#boot>span{font-size:34px;color:#d2aa79}#boot h1{font-size:23px;font-weight:400;letter-spacing:6px;margin:0}#boot p{font-size:11px;letter-spacing:1px;color:#aab4b3}#boot i{width:4px;height:4px;border-radius:50%;background:#ddb078;animation:breathe 1.6s ease-in-out infinite}#boot.done{opacity:0;pointer-events:none}@keyframes breathe{50%{opacity:.15}}@media(max-width:600px){header{inset:22px 20px auto}.invitation{top:102px;font-size:10px}.brand>span:last-child{font-size:16px}.brand small{font-size:9px}.icon-button{width:38px;height:38px}.bottom{bottom:22px}nav button{width:80px;height:59px}}

/* Campfire audio settings. The original sound mix remains the default. */
.settings-window{width:min(540px,calc(100% - 28px));max-width:540px;max-height:calc(100dvh - 40px);padding:28px;background:linear-gradient(145deg,#27302adb,#17232bdc);border:1px solid #ded3bd55;border-radius:30px;backdrop-filter:blur(28px);scrollbar-width:thin;scrollbar-color:#b8a48455 transparent;color:#eee9de}.settings-window::backdrop{background:#09131a66;backdrop-filter:blur(8px)}.settings-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.settings-heading h2{margin:0;font-size:24px;font-weight:600;letter-spacing:.3px}.settings-heading button{width:44px;height:44px;border-radius:50%;background:#ffffff0a;font-size:30px;font-weight:200;color:#e4e1d8;line-height:1}.settings-window h3{margin:0 0 6px;font-size:16px;font-weight:600}.settings-window p{margin:0;font-size:12px;line-height:1.8;color:#c6c8bd}.master-row,.background-row{display:flex;align-items:center;justify-content:space-between;gap:18px}.master-row{margin-bottom:24px}.master-row #master-status{margin-top:10px;font-size:11px;color:#b2b9ad}.audio-switch{width:52px;height:30px;border-radius:30px;background:#69736a66;padding:4px;flex-shrink:0;transition:background .2s}.audio-switch span{display:block;width:22px;height:22px;border-radius:50%;background:#f6f0e5;box-shadow:0 2px 5px #0002;transition:transform .2s}.audio-switch[aria-checked=true]{background:#b58a55}.audio-switch[aria-checked=true] span{transform:translateX(22px)}.audio-switch:disabled{opacity:.5;cursor:wait}.sound-card{border:1px solid #ded3bd36;border-radius:22px;background:#e0d0af0d;padding:20px;margin:14px 0;transition:background .2s}.channel-heading{display:flex;align-items:center;gap:12px}.channel-heading h3{font-size:16px;margin-bottom:3px}.channel-heading p{font-size:11px}.channel-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:15px;background:#e4c79b10;flex-shrink:0;color:#e8cfab}.channel-heading>.channel-toggle{margin-left:auto;flex-shrink:0}.channel-toggle{padding:9px 15px;min-width:60px;border-radius:24px;background:#ddd7c014;color:#c3c4b9;font-size:12px;font-weight:600}.channel-toggle[aria-checked=true]{background:#b58a5577;color:#fff0da}.volume-row{display:flex;align-items:center;gap:16px;margin-top:25px}.volume-row input{flex:1;min-width:0;margin:0;appearance:none;-webkit-appearance:none;height:7px;border-radius:10px;background:linear-gradient(to right,#c59a62 var(--fill,80%),#d7dbd533 var(--fill,80%));cursor:pointer}.volume-row input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#d1a56e;box-shadow:0 1px 4px #0003}.volume-row input::-moz-range-thumb{width:18px;height:18px;border:0;border-radius:50%;background:#d1a56e}.volume-row output{min-width:36px;text-align:right;font-size:12px;color:#e2dfd2;font-variant-numeric:tabular-nums}.channel-muted .channel-icon,.channel-muted .volume-row{opacity:.5}.background-row{padding:25px 0 23px}.background-row h3{font-size:15px}.background-row p{font-size:11px}.settings-detail{border-top:1px solid #d6c7a924;padding:16px 0}.settings-detail summary{font-size:12px;color:#d0d3c7;cursor:pointer;list-style-position:inside}.settings-detail p{padding:12px 0 0;font-size:11px;line-height:1.95}.settings-detail a{color:#d7b88b;text-decoration-color:#d7b88b66;text-underline-offset:3px}.settings-detail:last-child{padding-bottom:0}@media(max-width:420px){.settings-window{padding:22px;border-radius:26px}.sound-card{padding:16px}.channel-heading{gap:10px}.channel-heading p{font-size:10px}.channel-toggle{padding:9px 12px;min-width:54px}.settings-window h3{font-size:15px}}

/* Entry and a readable, persistent instruction line. */
.brand-icon{display:grid;place-items:center;width:27px;height:32px}.brand-icon svg{width:27px;height:32px;stroke:#efb27b;fill:#dd7e3b22;stroke-width:1.2}#controls-hint{position:absolute;left:18px;right:18px;top:92px;margin:0;z-index:2;pointer-events:none;text-align:center;font-size:12px;font-weight:600;letter-spacing:.1px;color:#f3eee3;text-shadow:0 1px 3px #000,0 2px 12px #000b;line-height:1.7}#intro{position:fixed;inset:0;z-index:6;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 57%,#62382366,transparent 55%),#0a151dd9;backdrop-filter:blur(13px);transition:opacity .65s,backdrop-filter .65s}#intro[hidden]{display:none}#intro.leaving{opacity:0;pointer-events:none;backdrop-filter:blur(0)}.intro-content{text-align:center;padding:32px;transform:translateY(-16px)}.intro-flame{width:100px;height:120px;margin:0 auto 24px;display:grid;place-items:center;filter:drop-shadow(0 0 28px #ff8e3944);animation:intro-warmth 3s ease-in-out infinite}.intro-flame svg{width:85px;height:105px;stroke:#efab70;fill:#c85d2c44;stroke-width:.7}.intro-content h1{font-weight:400;letter-spacing:8px;font-size:34px;margin:0 0 55px;padding-left:8px;color:#efe5d3}.intro-actions{display:flex;flex-direction:column;align-items:center;gap:14px}.intro-actions button{width:235px;min-height:49px;border-radius:30px;font-size:13px;letter-spacing:.5px}#enter-sound{border:1px solid #deb58188;background:linear-gradient(145deg,#9a613a80,#78503540);color:#f5dfc1;box-shadow:inset 0 1px 0 #f8d9ae22,0 4px 35px #0002}#enter-sound:hover{background:#aa6d4599}#enter-quiet{color:#b6bcb6;font-size:11px;min-height:38px}#enter-quiet:hover{color:#ece8dc}.is-intro header,.is-intro .bottom,.is-intro #nameplate,.is-intro #controls-hint{visibility:hidden}#boot>span svg{width:35px;height:43px;stroke:#d2aa79}.bottom{bottom:max(28px,env(safe-area-inset-bottom))}@keyframes intro-warmth{50%{filter:drop-shadow(0 0 38px #ff8e3966);transform:translateY(-3px)}}@media(max-width:420px){#controls-hint{top:85px;font-size:10px;left:10px;right:10px}.intro-content h1{font-size:30px}.bottom{bottom:24px}}@media(prefers-reduced-motion:reduce){.intro-flame{animation:none}#intro{transition:none}}
#action-guide{position:absolute;bottom:145px;left:50%;transform:translateX(-50%);margin:0;padding:12px 18px;border:1px solid #deb58166;background:#18221fed;backdrop-filter:blur(16px);border-radius:24px;font-size:12px;line-height:1.7;text-align:center;color:#f4e5cc;width:max-content;max-width:calc(100% - 36px);pointer-events:none}.is-intro #action-guide{visibility:hidden}
#tutorial-guide{position:absolute;bottom:145px;left:50%;transform:translateX(-50%);margin:0;padding:12px 18px;border:1px solid #deb58166;background:#18221fed;backdrop-filter:blur(16px);border-radius:24px;font-size:12px;line-height:1.7;text-align:center;color:#f4e5cc;width:max-content;max-width:calc(100% - 36px);pointer-events:none}#tutorial-guide:empty,.is-intro #tutorial-guide{visibility:hidden}#tutorial-guide,#controls-hint{transition:opacity .8s,visibility 0s .8s}.tutorial-complete #tutorial-guide,.tutorial-complete #controls-hint{opacity:0;visibility:hidden}body:has(#action-guide:not([hidden])) #tutorial-guide{opacity:0}@media(prefers-reduced-motion:reduce){#tutorial-guide,#controls-hint{transition:none}}
.tutorial-step-hidden #tutorial-guide{opacity:0}
.intro-content h1{letter-spacing:3px;padding-left:3px;margin-bottom:16px}.intro-subtitle{margin:0 0 36px;font-size:12px;line-height:1.7;color:#b6bcb6}


#brand-label{transition:opacity .25s}#brand-label.changing{opacity:0}.brand.showing-visitors{padding:8px 12px;border:1px solid #d6c5a433;border-radius:24px;background:#1e2822b8;backdrop-filter:blur(12px);gap:8px}.brand.showing-visitors #brand-label{font-size:13px;letter-spacing:0}.brand.showing-visitors .brand-icon,.brand.showing-visitors .brand-icon svg{width:20px;height:24px}@media(prefers-reduced-motion:reduce){#brand-label{transition:none}}

.visitor-nameplate{position:absolute;left:0;top:0;transform:translate(-50%,-100%);padding:4px 9px;border:1px solid #f1ddbb55;background:#1d2521a6;border-radius:20px;color:#ead7b7;font-size:10px;letter-spacing:1px;pointer-events:none;backdrop-filter:blur(8px)}
.is-intro .visitor-nameplate{visibility:hidden}