@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Noto+Serif+SC:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root { --ink:#eee6d9; --muted:#9a9289; --dim:#6d6864; --bg:#17151a; --panel:#211f23; --panel-2:#272329; --line:rgba(238,230,217,.12); --amber:#d89b5d; --copper:#b86f4f; --blue:#647991; --green:#829277; --shadow:0 24px 70px rgba(0,0,0,.26); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 75% 10%,#29232b 0,transparent 34%),var(--bg); font-family:'Noto Serif SC',Georgia,serif; min-width:320px; }
button, input { font:inherit; }
button { color:inherit; border:0; cursor:pointer; }
.app-shell { display:flex; min-height:100vh; }
.sidebar { width:244px; flex:0 0 244px; border-right:1px solid var(--line); padding:37px 27px 24px; display:flex; flex-direction:column; background:rgba(21,19,23,.68); }
.brand-lockup { display:flex; align-items:center; gap:13px; }
.brand-mark { width:29px; height:28px; display:flex; align-items:end; gap:3px; }
.brand-mark span { width:7px; border-radius:8px 8px 2px 2px; background:var(--amber); display:block; transform:rotate(13deg); }.brand-mark span:nth-child(1){height:15px}.brand-mark span:nth-child(2){height:25px;background:var(--copper)}.brand-mark span:nth-child(3){height:19px;background:#e4b378}
.eyebrow,.tiny-label,.section-label small,.version,.topbar,.preview-kicker,.chapter-chip,.menu-tabs,.guest-status,.guest-meta,.flavor-label,.streak-card,.card-arrow { font-family:'Space Mono',monospace; letter-spacing:.12em; text-transform:uppercase; font-size:10px; }
.eyebrow { color:var(--dim); }.eyebrow.warm { color:var(--amber); }.brand-lockup h1 { font-family:'Cormorant Garamond',serif; font-size:29px; line-height:1; margin:0; letter-spacing:.03em; }.brand-note { color:#b3a99b; font-size:13px; line-height:1.85; margin:34px 0 43px; }
.main-nav { display:grid; gap:9px; }.nav-item { background:transparent; text-align:left; color:#8d8883; border-radius:5px; padding:12px 12px; font-size:13px; transition:.2s; position:relative; }.nav-item span { display:inline-block; width:26px; color:#928579; font-size:17px; vertical-align:-2px; }.nav-item:hover,.nav-item.active { color:var(--ink); background:rgba(216,155,93,.11); }.nav-item.active:before { content:''; position:absolute; left:0; top:11px; bottom:11px; width:2px; background:var(--amber); }.nav-item i { float:right; font-style:normal; background:var(--copper); color:#fff1de; border-radius:10px; padding:2px 6px; font-family:'Space Mono'; font-size:9px; }
.sidebar-bottom { margin-top:auto; }.streak-card { border:1px solid var(--line); padding:14px 13px; color:var(--muted); line-height:1.7; text-transform:none; letter-spacing:0; }.streak-card strong { font-family:'Cormorant Garamond'; color:var(--amber); font-size:30px; margin-right:3px; }.streak-line { height:3px; background:#383238; margin-top:10px; overflow:hidden; }.streak-line span { display:block; width:0; height:100%; background:var(--amber); transition:.4s; }.reset-button { background:transparent; color:#77716c; font-size:11px; margin-top:19px; padding:0; }.reset-button:hover { color:var(--amber); }.version { color:#4e4a49; margin-top:24px; font-size:8px; letter-spacing:.06em; }
.main-content { width:min(100%,1440px); margin:0 auto; padding:0 55px 70px; }.topbar { display:flex; justify-content:space-between; align-items:center; height:82px; color:#716c6a; font-size:9px; }.topbar-meta { display:flex; align-items:center; gap:10px; }.live-dot { width:6px;height:6px;border-radius:50%;background:#7c9a7b;box-shadow:0 0 0 3px rgba(124,154,123,.1); }.meta-divider { height:12px; width:1px; background:var(--line); }.icon-button { width:30px;height:30px;background:transparent;color:#99908a;font-size:17px; }.mobile-brand { display:none; font-family:'Cormorant Garamond'; font-weight:700; font-size:21px; }.brand-dot { width:8px;height:8px;background:var(--amber);display:inline-block;border-radius:50%;margin-right:5px; }
.save-indicator { color:#8d9e7f; letter-spacing:.04em; }
.view { display:none; animation:rise .42s ease both; }.active-view { display:block; } @keyframes rise { from { opacity:0; transform:translateY(7px) } to { opacity:1;transform:none } }
.hero-grid { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(500px,1.35fr); align-items:center; min-height:465px; gap:44px; }.hero-copy { padding-left:12px; }.hero-copy h2,.page-intro h2 { font-size:clamp(38px,4vw,64px); font-weight:500; line-height:1.12; letter-spacing:-.06em; margin:20px 0 19px; }.hero-copy h2 em { color:var(--amber); font-style:normal; }.hero-copy p,.page-intro p { color:var(--muted); font-size:14px; line-height:2; margin:0 0 30px; }.primary-button,.secondary-button { padding:12px 18px; border-radius:2px; font-size:13px; transition:.2s; }.primary-button { background:var(--amber); color:#221a17; box-shadow:0 8px 24px rgba(216,155,93,.14); }.primary-button:hover { background:#ebae6d; transform:translateY(-2px); }.primary-button span { padding-left:18px; font-size:16px; }.secondary-button { border:1px solid rgba(216,155,93,.45); background:transparent; color:var(--amber); }.secondary-button:hover { background:rgba(216,155,93,.1); }
.room-illustration { height:397px; position:relative; overflow:hidden; background:linear-gradient(135deg,#292632,#18232b 55%,#171b26); box-shadow:var(--shadow); border:1px solid rgba(216,155,93,.18); }.room-frame { position:absolute; inset:25px 28px 47px; border:1px solid rgba(216,155,93,.15); overflow:hidden; background:linear-gradient(130deg,rgba(63,50,53,.85),rgba(24,40,48,.84)); }.room-wall { position:absolute; inset:0; background:linear-gradient(90deg,transparent 49.7%,rgba(10,17,24,.4) 50%,transparent 50.3%),linear-gradient(rgba(207,145,90,.05) 1px,transparent 1px); background-size:100% 100%,100% 46px; }.window-glow { position:absolute; width:220px;height:250px;right:125px;top:25px;background:radial-gradient(ellipse,#68809544 0,#2b415355 32%,transparent 70%); }.shelf { position:absolute; height:5px; background:#674c3b; right:40px; width:185px; }.shelf-one{top:77px}.shelf-two{top:133px;right:21px;width:140px}.shelf span { display:inline-block; width:15px; height:41px; margin:0 10px 5px; background:#a56e4e; border-radius:8px 8px 2px 2px; border:2px solid #382c2d; }.shelf span:nth-child(2){height:29px;background:#667d75}.shelf span:nth-child(3){height:36px;background:#c99855}.shelf-two span{height:27px;background:#718090}.shelf-two span:nth-child(2){height:35px;background:#a98d70}.lamp{position:absolute;left:107px;top:40px;width:58px;text-align:center}.lamp i{display:block;margin:auto;width:58px;height:35px;background:#c1874f;border-radius:50% 50% 20% 20%;box-shadow:0 0 45px 23px #d89b5d32}.lamp b{display:block;width:2px;height:28px;background:#7d604c;margin:auto}.plant{position:absolute;right:54px;bottom:54px;width:76px;height:76px}.plant i{display:block;position:absolute;background:#667e6d;width:30px;height:50px;border-radius:90% 0 90% 0;transform:rotate(-36deg);bottom:16px}.plant i:nth-child(2){left:23px;transform:rotate(14deg);background:#779378}.plant i:nth-child(3){left:42px;transform:rotate(48deg);background:#4f715f}.plant b{position:absolute;bottom:0;left:21px;width:48px;height:27px;border-radius:4px 4px 12px 12px;background:#9e684e}.bar-counter{position:absolute;left:0;right:0;height:65px;bottom:39px;background:linear-gradient(#6a4939,#432e2b);border-top:3px solid #bd8052}.counter-light{position:absolute;left:30%;right:25%;height:4px;top:14px;background:#d89b5d;filter:blur(5px);opacity:.6}.stool{position:absolute;width:45px;height:13px;border-radius:50%;bottom:20px;background:#8e5b43;box-shadow:0 4px #34252a}.stool:after{content:'';position:absolute;left:21px;top:10px;height:25px;width:3px;background:#6e4b3e}.stool-a{left:180px}.stool-b{right:183px}.record-player{position:absolute;left:53px;bottom:69px;color:#d99e5e;font-size:42px}.record-player small{font-size:20px;color:#be8058}.room-caption{position:absolute;bottom:15px;left:29px;right:29px;display:flex;justify-content:space-between;color:#8e817c;font:9px 'Space Mono';letter-spacing:.12em}.rain{position:absolute;top:-30px;width:1px;height:80px;background:linear-gradient(transparent,#a0b7c1);transform:rotate(18deg);opacity:.35;animation:rain 2.8s linear infinite}.rain-a{right:29%;}.rain-b{right:22%;height:55px;animation-delay:1s}.rain-c{right:12%;height:100px;animation-delay:1.8s}@keyframes rain{to{transform:translate(-18px,410px) rotate(18deg)}}
.section-heading { display:flex; justify-content:space-between; align-items:end; }.home-heading { margin:28px 0 17px; }.section-heading h3 { margin:7px 0 0; font-size:21px; font-weight:500; }.muted { color:var(--dim); font:10px 'Space Mono'; letter-spacing:.08em; }.home-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }.info-card { min-height:120px; border:1px solid var(--line); background:rgba(39,35,41,.64); display:flex; gap:13px; padding:17px 16px; position:relative; }.info-card h4 { margin:7px 0 5px; font-size:14px; font-weight:500; }.info-card p { color:#8d8781;font-size:11px;line-height:1.6;margin:0; }.card-icon { color:var(--amber); font-size:25px; width:31px; }.vinyl { font-size:22px; color:#829277; }.mini-avatar { flex:0 0 31px; }.card-arrow { position:absolute; right:14px;bottom:13px;color:#7b6b61; }.quote-strip { margin-top:30px; padding:20px 25px; border-left:2px solid var(--amber); background:linear-gradient(90deg,rgba(216,155,93,.07),transparent); display:flex; align-items:center; gap:15px; }.quote-strip p { margin:0;color:#b7aaa0;font-size:13px; }.quote-mark { color:var(--amber); font:38px Georgia; line-height:.6; }.quote-author { margin-left:auto; color:#756e6a; font:9px 'Space Mono'; white-space:nowrap; }
.page-intro { display:flex; align-items:end; justify-content:space-between; padding:45px 0 35px; border-bottom:1px solid var(--line); }.page-intro h2 { font-size:clamp(32px,4vw,54px); margin:15px 0 13px; }.page-intro p { margin:0; }.chapter-chip { color:var(--amber); text-align:right; line-height:1.8; }.chapter-chip strong { display:block; color:#9a8a7d; font:13px 'Noto Serif SC'; letter-spacing:0; }.guest-layout { display:grid; grid-template-columns:340px 1fr; gap:30px; padding-top:31px; }.guest-list { display:grid; gap:11px; align-content:start; }.guest-card { border:1px solid var(--line); background:rgba(37,33,39,.7); padding:15px; display:flex; gap:13px; align-items:center; position:relative; transition:.2s; }.guest-card:hover,.guest-card.selected { border-color:rgba(216,155,93,.65); background:rgba(57,44,44,.75); }.avatar { width:43px;height:43px;border-radius:50%;display:grid;place-items:center;color:#f1d8ba;font-size:15px;border:1px solid rgba(255,255,255,.13); }.avatar-lin{background:#514a51}.avatar-mori{background:#45625d}.avatar-yu{background:#725848}.avatar-shen{background:#41556c}.avatar-qiao{background:#765b43}.guest-card h3 { margin:0 0 5px;font-size:14px;font-weight:500; }.guest-card p { margin:0;color:#817a76;font-size:11px; }.guest-status { margin-left:auto; align-self:start; color:var(--green);font-size:8px; }.guest-card .guest-status:first-letter{}.guest-detail { min-height:410px; border:1px solid var(--line); background:linear-gradient(135deg,rgba(42,37,41,.76),rgba(28,32,37,.8)); padding:28px 31px; position:relative; }.detail-top { display:flex; gap:17px; align-items:center; }.detail-top .avatar{width:58px;height:58px;font-size:21px}.detail-top h3{font-size:25px;font-weight:500;margin:0 0 5px}.guest-meta{color:#7d8988;font-size:8px}.detail-story { max-width:620px; font-size:16px;line-height:1.95;color:#c8beb4;margin:28px 0 23px; }.detail-story em{color:var(--amber);font-style:normal}.clue-row {display:flex;gap:9px;flex-wrap:wrap;margin-bottom:25px}.clue{border:1px solid rgba(216,155,93,.27);color:#ae9a88;padding:6px 10px;font-size:11px}.detail-actions{display:flex;gap:9px;align-items:center}.detail-actions .secondary-button{border-color:var(--line);color:#aaa098}.detail-footnote{position:absolute;right:31px;bottom:25px;color:#605c5a;font:9px 'Space Mono';max-width:170px;line-height:1.7;text-align:right}.detail-progress{position:absolute;left:31px;right:31px;bottom:23px;height:2px;background:#413b3e}.detail-progress span{display:block;background:var(--amber);height:100%;transition:.3s}.new-visit{color:var(--amber);font-size:12px;background:transparent;padding:0 4px}
.lab-intro { align-items:center; }.mode-switch { display:flex; gap:11px; align-items:center; cursor:pointer; color:var(--amber); }.mode-switch input{display:none}.switch-track{width:38px;height:20px;border-radius:12px;background:#494046;display:block;position:relative}.switch-track:after{content:'';position:absolute;width:14px;height:14px;background:#a39a94;border-radius:50%;left:3px;top:3px;transition:.2s}.mode-switch input:checked + .switch-track{background:#9f6c4d}.mode-switch input:checked + .switch-track:after{left:21px;background:#f5d3a7}.mode-switch small{display:block;color:#756f6a;font:8px 'Space Mono';margin-top:4px}.lab-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(310px,.7fr);gap:37px;padding-top:31px}.lab-section{border-bottom:1px solid var(--line);padding:0 0 23px;margin-bottom:22px}.section-label{display:flex;align-items:baseline;gap:10px;margin-bottom:15px}.section-label>span{color:var(--amber);font:11px 'Space Mono'}.section-label h3{font-size:16px;font-weight:500;margin:0}.section-label small{color:#6e6863;margin-left:auto;font-size:8px;letter-spacing:.04em;text-transform:none}.ingredient-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.ingredient-button,.choice-button,.technique-button{background:#27232a;border:1px solid transparent;min-height:74px;padding:10px 8px;text-align:left;transition:.2s}.ingredient-button:hover,.ingredient-button.selected,.choice-button.selected,.technique-button.selected{border-color:rgba(216,155,93,.62);background:rgba(104,70,53,.26)}.ingredient-button .ingredient-symbol{font-size:22px;display:block;margin-bottom:6px}.ingredient-button strong{font-size:11px;font-weight:500;display:block}.ingredient-button small{display:block;color:#716a67;font-size:9px;margin-top:3px}.technique-row,.choice-row{display:flex;gap:8px;flex-wrap:wrap}.technique-button{min-height:47px;font-size:11px;text-align:center;padding:10px 14px}.choice-button{min-height:49px;font-size:11px;text-align:center;padding:10px 14px;min-width:84px}.duo-section{display:grid;grid-template-columns:1fr 1fr;gap:25px}.sliders{display:grid;grid-template-columns:1fr 1fr;gap:14px 25px}.slider-row{display:grid;grid-template-columns:85px 1fr 30px;gap:8px;align-items:center}.slider-row label{font-size:11px;color:#aaa09a}.slider-row output{color:var(--amber);font:9px 'Space Mono';text-align:right}.slider-row input{accent-color:var(--amber);width:100%}.drink-preview{position:sticky;top:23px;align-self:start;border:1px solid rgba(216,155,93,.17);background:linear-gradient(160deg,#29222a,#20272c);min-height:615px;padding:19px 23px 22px;display:flex;flex-direction:column;box-shadow:0 19px 55px rgba(0,0,0,.2)}.preview-kicker{color:#877873;display:flex;justify-content:space-between;font-size:9px}.glass-stage{height:205px;display:grid;place-items:center;position:relative}.ambient-halo{position:absolute;width:195px;height:155px;background:radial-gradient(ellipse,#d89b5d3b,transparent 68%);filter:blur(5px)}.drink-glass{width:93px;height:126px;position:relative;border:1px solid rgba(228,215,196,.63);border-top:0;border-radius:4px 4px 26px 26px;transform:perspective(280px) rotateX(-5deg);overflow:hidden;background:linear-gradient(100deg,rgba(255,255,255,.15),transparent 24%,rgba(255,255,255,.08) 73%,transparent)}.drink-glass:before{content:'';position:absolute;top:-1px;left:-6px;right:-6px;height:9px;border:1px solid rgba(238,230,217,.65);border-radius:50%;z-index:2}.liquid{position:absolute;left:0;right:0;bottom:0;height:67%;background:linear-gradient(90deg,#7e4e48,#b27757 53%,#76504b);transition:.4s}.liquid:after{content:'';position:absolute;inset:7px 9px auto;height:3px;background:#fff3ce55;border-radius:50%;filter:blur(2px)}.liquid-shine{position:absolute;left:16px;top:10px;height:75px;width:3px;background:#fff8e84a;border-radius:50%;filter:blur(1px)}.ice-cube{position:absolute;width:21px;height:21px;border:1px solid #e5eee922;background:#ffffff1d;transform:rotate(25deg);top:47px;z-index:2}.ice-one{left:18px}.ice-two{right:17px;top:62px;transform:rotate(-19deg)}.garnish-float{position:absolute;z-index:3;right:7px;top:9px;font-size:20px;color:#dbab65;text-shadow:0 0 9px #f5d49a}.drink-summary{text-align:center}.drink-tags{display:flex;justify-content:center;gap:6px;min-height:18px}.drink-tags span{font:8px 'Space Mono';color:#aa9b92;border:1px solid #ffffff1b;padding:4px 6px}.drink-summary h3{font:500 26px 'Cormorant Garamond';margin:7px 0 6px}.drink-summary p{font-size:11px;color:#8b8581;line-height:1.6;margin:0 auto;max-width:280px;min-height:37px}.flavor-bars{display:flex;justify-content:center;gap:11px;margin-top:17px}.flavor-meter{display:grid;gap:5px;justify-items:center}.flavor-meter i{width:34px;height:3px;background:#423b3f;position:relative}.flavor-meter i span{display:block;height:100%;background:var(--amber)}.flavor-meter label{color:#827972;font:8px 'Space Mono'}.preview-actions{margin-top:21px;display:flex;justify-content:center;gap:8px}.preview-actions button{font-size:11px;padding:10px 13px}.guest-prompt{display:flex;gap:9px;align-items:center;margin-top:18px;padding:12px;border:1px dashed #88715544;color:#93857a}.guest-prompt span{color:var(--amber)}.guest-prompt p{font-size:10px;line-height:1.5;margin:0;flex:1;color:#89817c}.guest-prompt button{font-size:10px;background:transparent;color:var(--amber);white-space:nowrap}
.menu-tabs{display:flex;gap:23px;padding:22px 0 17px;border-bottom:1px solid var(--line)}.menu-tabs button{background:transparent;color:#77706d;padding:0 0 9px;position:relative;font-size:9px}.menu-tabs button.active{color:var(--amber)}.menu-tabs button.active:after{content:'';position:absolute;bottom:-18px;left:0;right:0;height:2px;background:var(--amber)}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-top:24px}.menu-card{border:1px solid var(--line);background:#242126;padding:18px;min-height:215px;position:relative}.menu-card-sign{color:var(--amber);font:9px 'Space Mono';letter-spacing:.1em}.menu-card h3{font:500 28px 'Cormorant Garamond';margin:17px 0 7px}.menu-card p{color:#8f8780;font-size:11px;line-height:1.7;min-height:38px}.menu-card .drink-tags{justify-content:start;margin-top:16px}.menu-card .edit-recipe{position:absolute;right:14px;bottom:15px;background:transparent;color:#766e6b;font-size:11px}.empty-state{grid-column:1/-1;border:1px dashed #ffffff1b;padding:68px 20px;text-align:center;color:#837a75}.empty-state h3{font-weight:500;color:#b7a89a;margin:0 0 9px}.empty-state p{font-size:12px;margin:0}.journal-layout{display:grid;grid-template-columns:minmax(0,1.35fr) 310px;gap:31px;padding-top:30px}.journal-list{display:grid;gap:0}.journal-entry{position:relative;padding:0 0 27px 28px;border-left:1px solid #655247;margin-left:8px}.journal-entry:before{content:'';position:absolute;left:-5px;top:1px;width:9px;height:9px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 4px #17151a}.journal-entry time{color:#756c68;font:9px 'Space Mono'}.journal-entry h3{font-size:17px;font-weight:500;margin:10px 0 6px}.journal-entry p{color:#958c85;font-size:12px;line-height:1.9;margin:0;max-width:650px}.journal-entry .journal-tag{display:inline-block;color:#a98770;font:8px 'Space Mono';border:1px solid #a9877044;padding:4px 6px;margin-top:10px}.journal-aside{display:grid;align-content:start;gap:14px}.aside-note,.milestone-card{border:1px solid var(--line);padding:24px;background:rgba(40,34,39,.65)}.aside-note p{font-size:15px;line-height:1.9;color:#b7aaa0;margin:8px 0 20px}.milestone-card h3{font:500 27px 'Cormorant Garamond';margin:13px 0 5px;color:var(--amber)}.milestone-card p{color:#817973;font-size:11px;line-height:1.8;margin:0}.style-dots{display:flex;gap:6px;margin-top:18px}.style-dots i{width:8px;height:8px;border-radius:50%;background:#413a3d}.style-dots i.active{background:var(--amber)}.journal-count{text-align:right}.journal-count strong{font:42px 'Cormorant Garamond';color:var(--amber);display:block}.journal-count span{font:9px 'Space Mono';color:#6f6864}
.modal-backdrop{position:fixed;inset:0;background:#0a090ccc;z-index:10;display:none;place-items:center;padding:20px}.modal-backdrop.open{display:grid}.service-modal-card{width:min(560px,100%);background:#272127;border:1px solid rgba(216,155,93,.3);padding:29px 33px;box-shadow:var(--shadow);position:relative}.modal-close{position:absolute;right:17px;top:11px;color:#8e8580;background:transparent;font-size:25px}.service-modal-card h3{font-size:25px;font-weight:500;margin:16px 0 8px}.service-modal-card>p{color:#9d938b;font-size:13px;line-height:1.9}.response-list{display:grid;gap:8px;margin:20px 0}.response-button{text-align:left;background:#302a30;border:1px solid #ffffff12;padding:12px 14px;color:#bdb0a7;font-size:12px;transition:.2s}.response-button:hover,.response-button.selected{border-color:#d89b5d99;color:#e9c493;background:#5a3e3638}.modal-next{display:flex;justify-content:flex-end;margin-top:20px}.toast{position:fixed;z-index:20;bottom:27px;left:50%;transform:translate(-50%,20px);background:#e2aa70;color:#241b19;padding:10px 18px;font-size:12px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.3s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:1000px){.sidebar{width:205px;flex-basis:205px;padding-left:19px;padding-right:19px}.main-content{padding-left:33px;padding-right:33px}.hero-grid{grid-template-columns:.8fr 1fr;gap:20px}.ingredient-grid{grid-template-columns:repeat(3,1fr)}.guest-layout{grid-template-columns:285px 1fr}.menu-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.app-shell{display:block}.sidebar{width:100%;height:auto;display:block;padding:15px 16px 10px;border-right:0;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5;background:#17151aee}.brand-lockup,.brand-note,.sidebar-bottom{display:none}.main-nav{display:flex;overflow-x:auto;gap:3px;margin-top:13px}.nav-item{white-space:nowrap;padding:8px 11px;font-size:11px}.nav-item span{width:18px;font-size:15px}.nav-item.active:before{left:4px;top:auto;bottom:3px;width:calc(100% - 8px);height:2px}.mobile-brand{display:block}.topbar{height:48px}.topbar .topbar-meta{display:none}.main-content{padding:0 16px 40px}.hero-grid{display:flex;flex-direction:column;min-height:0;gap:27px;align-items:stretch;padding-top:27px}.hero-copy{padding:0}.hero-copy h2{font-size:45px;margin:15px 0}.hero-copy p{font-size:13px}.room-illustration{height:300px}.room-frame{inset:19px 18px 39px}.shelf{right:19px;transform:scale(.8);transform-origin:right}.lamp{left:55px}.bar-counter{bottom:30px}.stool-a{left:80px}.stool-b{right:80px}.record-player{left:30px;bottom:55px;transform:scale(.75)}.room-caption{left:18px;right:18px;bottom:11px}.home-cards{grid-template-columns:1fr}.info-card{min-height:90px}.quote-strip{margin-top:22px;padding:17px}.quote-author{display:none}.page-intro{display:block;padding:31px 0 24px}.page-intro h2{font-size:38px;margin:13px 0}.chapter-chip{text-align:left;margin-top:18px}.guest-layout,.lab-layout,.journal-layout{display:block;padding-top:22px}.guest-list{display:flex;overflow-x:auto;margin-bottom:14px}.guest-card{min-width:180px;display:block}.guest-card .avatar{margin-bottom:9px}.guest-status{position:absolute;right:10px;top:11px}.guest-detail{padding:22px 19px;min-height:450px}.detail-story{font-size:14px;line-height:1.9;margin-top:23px}.detail-footnote{position:static;text-align:left;margin-top:25px;max-width:none}.detail-progress{left:19px;right:19px;bottom:16px}.lab-intro{display:flex;align-items:flex-end}.lab-intro .mode-switch{margin-bottom:3px}.ingredient-grid{grid-template-columns:repeat(3,1fr)}.ingredient-button{min-height:68px;padding:8px 5px}.ingredient-button .ingredient-symbol{font-size:19px}.ingredient-button strong{font-size:10px}.section-label small{display:none}.duo-section{grid-template-columns:1fr;gap:22px}.drink-preview{position:relative;top:auto;margin-top:32px}.sliders{grid-template-columns:1fr}.menu-grid{grid-template-columns:1fr}.journal-aside{margin-top:25px}.service-modal-card{padding:25px 20px}}
@media (max-width:400px){.nav-item{padding-left:7px;padding-right:7px}.nav-item span{display:none}.hero-copy h2{font-size:39px}.lab-intro{display:block}.mode-switch{margin-top:20px}.ingredient-grid{gap:5px}}

.atmosphere-panel { display:grid; grid-template-columns:minmax(230px,.8fr) 1.3fr; gap:28px; align-items:center; border:1px solid var(--line); margin-top:14px; padding:19px 20px; background:rgba(31,29,34,.58); }
.atmosphere-panel h3 { font-size:17px; font-weight:500; margin:8px 0 6px; }
.atmosphere-panel p { color:#7f7772; font-size:11px; line-height:1.7; margin:0; }
.atmosphere-choices { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }
.atmosphere-choice { background:#2a262c; border:1px solid transparent; padding:12px 9px; text-align:left; min-height:76px; }
.atmosphere-choice:hover,.atmosphere-choice.selected { border-color:#d89b5d88; background:#5a3e362b; }
.atmosphere-choice .atmo-symbol { color:var(--amber); font-size:18px; display:block; margin-bottom:8px; }
.atmosphere-choice strong { display:block; font-size:11px; font-weight:500; }
.atmosphere-choice small { display:block; color:#706a67; font-size:9px; margin-top:4px; line-height:1.3; }
@media (max-width:720px){.atmosphere-panel{display:block;padding:18px 16px}.atmosphere-choices{grid-template-columns:repeat(2,1fr);margin-top:18px}}

/* v1.1 visual material pass: the selected glass and room mood now change the picture itself. */
.room-illustration { background-image:linear-gradient(90deg,rgba(34,20,14,.08),rgba(24,16,14,.18)),url('assets/tavern-hero-v2.webp'); background-size:cover; background-position:center; }
.room-illustration .room-frame { display:none; }
.room-illustration { background-color:#38251d; }
@media (max-width:1100px) { .room-illustration { background-image:linear-gradient(90deg,rgba(34,20,14,.08),rgba(24,16,14,.18)),url('assets/tavern-hero-v2-tablet.webp'); } }
@media (max-width:720px) { .room-illustration { background-image:linear-gradient(90deg,rgba(34,20,14,.08),rgba(24,16,14,.18)),url('assets/tavern-hero-v2-mobile.webp'); background-position:center center; } }
.atmo-retro .room-illustration { filter:saturate(1.18) sepia(.14); }
.atmo-green .room-illustration { filter:hue-rotate(15deg) saturate(1.08); }
.atmo-radio .room-illustration { filter:hue-rotate(170deg) saturate(.84) brightness(.88); }
.drink-glass.glass-low { width:93px; height:126px; border-radius:4px 4px 26px 26px; }
.drink-glass.glass-high { width:70px; height:151px; border-radius:3px 3px 17px 17px; margin-top:-10px; }
.drink-glass.glass-high .liquid { height:78%; }
.drink-glass.glass-tea { width:120px; height:82px; border-radius:5px 5px 39px 39px; margin-top:29px; }
.drink-glass.glass-tea .liquid { height:59%; }
.drink-glass.glass-coupe { width:142px; height:77px; border-radius:0 0 71px 71px; margin-top:31px; }
.drink-glass.glass-coupe .liquid { height:52%; }
.glass-stage:has(.glass-tea)::after { content:'茶盏'; position:absolute; bottom:19px; color:#827873; font:8px 'Space Mono'; letter-spacing:.12em; }
.glass-stage:has(.glass-coupe)::after { content:''; position:absolute; bottom:22px; width:3px; height:27px; background:#dfd2bd88; box-shadow:0 27px 0 -1px #dfd2bd88; }
.drink-glass { box-shadow:inset 10px 0 13px #fff2d412, inset -9px 0 12px #0000002a, 0 12px 24px #00000038; backdrop-filter:blur(1px); }
.drink-glass::after { content:''; position:absolute; z-index:4; top:15px; left:13px; width:4px; height:58%; border-radius:50%; background:linear-gradient(#fff9e899,transparent); filter:blur(.5px); pointer-events:none; }
.drink-glass.glass-high { border-left-color:#e9decf99; border-right-color:#e9decf55; box-shadow:inset 8px 0 13px #fff2d416, inset -8px 0 12px #00000030, 0 15px 26px #00000040; }
.drink-glass.glass-tea { border-radius:8px 8px 39px 39px; background:linear-gradient(90deg,#ffffff18,transparent 22%,#ffffff0c 73%,#00000016); }
.drink-glass.glass-tea::before { height:11px; background:#ffffff0b; }
.drink-glass.glass-tea::after { left:18px; top:14px; height:42%; }
.drink-glass.glass-coupe { border-radius:5px 5px 71px 71px; background:linear-gradient(90deg,#ffffff18,transparent 18%,#ffffff0c 72%,#00000018); }
.drink-glass.glass-coupe::before { left:-2px; right:-2px; height:7px; }
.drink-glass.technique-shake .liquid::before { content:''; position:absolute; inset:10px 13px; border-radius:50%; background:radial-gradient(circle at 20% 30%,#ffffff66 0 2px,transparent 3px),radial-gradient(circle at 70% 63%,#ffffff55 0 2px,transparent 3px),radial-gradient(circle at 44% 45%,#ffffff42 0 1px,transparent 2px); opacity:.75; animation:liquid-bubbles 2.6s ease-in-out infinite; }
.drink-glass.technique-layer .liquid { background-image:linear-gradient(180deg,#f7d18b55 0 16%,transparent 17% 47%,#ffffff12 48% 52%,transparent 53%); }
.drink-glass.technique-ice .liquid { background-image:linear-gradient(130deg,#ffffff25 0 10%,transparent 11% 40%,#ffffff14 41% 45%,transparent 46%); }
.garnish-float { width:54px; height:47px; display:grid; place-items:center; }
.garnish-float img { display:block; width:58px; height:45px; object-fit:contain; filter:drop-shadow(0 5px 4px #00000055); transform:rotate(-8deg); }
.garnish-rosemary img { transform:rotate(-22deg) translate(2px,-1px); }
.garnish-berry img { transform:rotate(8deg) translate(0,2px); }
.garnish-none { display:none; }
@keyframes liquid-bubbles { 0%,100% { transform:translateY(1px); opacity:.35; } 50% { transform:translateY(-3px); opacity:.8; } }
.recipe-name-wrap { display:grid; gap:6px; margin:18px auto 0; width:min(260px,100%); }
.recipe-name-wrap label { color:#766e6a; font:8px 'Space Mono'; letter-spacing:.1em; text-transform:uppercase; }
.recipe-name-wrap input { width:100%; border:1px solid #ffffff18; background:#1c1c22; color:var(--ink); padding:9px 11px; outline:none; font-size:11px; }
.recipe-name-wrap input:focus { border-color:#d89b5d88; }
.conversation-kicker { display:flex; justify-content:space-between; gap:14px; color:#9f7b60; font:8px 'Space Mono'; letter-spacing:.08em; text-transform:uppercase; }
.conversation-kicker span:last-child { color:#756d69; text-align:right; }
.conversation-prompt { color:#8f837c; font-size:11px; line-height:1.7; margin:18px 0 9px; }
.conversation-thread { display:grid; gap:10px; margin:19px 0 10px; }
.chat-bubble { max-width:88%; padding:12px 14px; border:1px solid #ffffff12; color:#c6b9af; font-size:12px; line-height:1.8; animation:conversation-in .28s ease both; }
.chat-bubble.guest { justify-self:start; background:#302a30; border-left:2px solid #a8785d; }
.chat-bubble.player { justify-self:end; background:#49352f; border-right:2px solid var(--amber); color:#e1c49f; }
.chat-bubble.closing-bubble { background:linear-gradient(110deg,#302a30,#3b3332); color:#d7c2ad; }
.conversation-label { display:block; margin-bottom:4px; color:var(--amber); font:8px 'Space Mono'; letter-spacing:.08em; }
@keyframes conversation-in { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
.conversation-choice { cursor:pointer; }
.backup-actions { display:grid; gap:5px; margin:14px 0 5px; }
.save-indicator.save-error { color:#d9866f; }
.menu-card-actions { position:absolute; left:18px; right:18px; bottom:15px; display:flex; justify-content:space-between; gap:8px; align-items:center; }
.menu-card-actions .edit-recipe,.menu-card-actions .signature-toggle { position:static; background:transparent; font-size:10px; color:#766e6b; padding:0; }
.menu-card-actions .signature-toggle.active { color:var(--amber); }
@media (max-width:720px) { .service-modal-card { max-height:calc(100vh - 30px); overflow:auto; } .chat-bubble { max-width:94%; } .conversation-kicker { align-items:flex-start; flex-direction:column; gap:5px; } .conversation-kicker span:last-child { text-align:left; } }
@media (max-width:720px) { .sidebar-bottom { display:block; margin-top:10px; } .sidebar-bottom .streak-card,.sidebar-bottom .version { display:none; } .backup-actions { display:flex; gap:6px; margin:7px 0 0; } .backup-actions .reset-button,.sidebar-bottom > .reset-button { flex:1; margin-top:0; padding:5px 4px; border:1px solid #ffffff16; font-size:9px; } }