@font-face{font-family:Instrument;src:url('./instrument-sans.woff2') format('woff2');font-weight:400 700;font-display:swap}
:root{--paper:#faf7ee;--ink:#542510;--muted:#80715e;--green:#465333;font-family:Instrument,Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;color-scheme:light}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:var(--paper)}body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 7% 26%,#667d3720,transparent 42%),radial-gradient(ellipse at 100% 40%,#c3ad7724,transparent 40%);z-index:0}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,.brand-mark:focus-visible{outline:2px solid #a23e2b;outline-offset:4px}.preview-nav{position:relative;z-index:2;max-width:430px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 22px;border-bottom:1px solid #54251015;font-size:11px;color:var(--muted)}.preview-nav a{display:grid;place-items:center;width:44px;height:44px;text-decoration:none;font-size:28px}.mini{width:min(100%,430px);margin:0 auto;padding:6px 24px 22px;position:relative;z-index:1;text-align:center}.brand-mark{--logo-fit:1;position:relative;height:334px;touch-action:pan-y;user-select:none;outline-offset:-4px;cursor:grab}.brand-mark:active{cursor:grabbing}.logo-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;opacity:1}.logo-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0}.zt-3d .brand-mark.is-live .logo-canvas{opacity:1}.zt-3d .brand-mark.is-live .logo-img{opacity:0}.ambient{position:absolute;pointer-events:none;border-radius:50%;opacity:0}.ambient-a{inset:18% 7% 22%;background:radial-gradient(ellipse,#cda86935,transparent 67%);animation:arrival-light 3.6s ease-out both}.ambient-b{height:28%;width:28%;top:30%;left:5%;background:radial-gradient(circle,#6a7b4540,transparent 65%);filter:blur(12px);animation:botanic-drift 3.4s ease-out both}.aroma{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;animation:aroma-rise 3.8s ease-out both}.brand-caption{margin-top:-5px}.brand-caption .tiny{margin:0 0 7px;font-size:10px;letter-spacing:3px;color:var(--muted)}h1{font-family:Georgia,serif;font-weight:400;font-size:24px;letter-spacing:-.6px;line-height:1.15;margin:0}.slogan{font-size:12px;color:var(--muted);margin:10px 0 23px}.reserve{position:relative;text-align:left;display:flex;align-items:center;gap:13px;min-height:72px;padding:12px 16px;background:var(--green);color:#fff9ec;border-radius:9px;text-decoration:none;overflow:clip;box-shadow:0 7px 19px #46533318}.reserve::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,#fff4 50%,transparent 65%);transform:translateX(-120%);pointer-events:none;animation:button-glint 9s 3.8s ease-in-out infinite}.reserve strong{display:block;font-size:15px;font-weight:550}.reserve small{display:block;font-size:10px;opacity:.8;margin-top:4px}.wa-icon{display:grid;place-items:center;width:34px;height:34px;flex:none}.wa-icon svg{fill:none;stroke:currentColor;stroke-width:1.35;width:30px;height:30px}.reserve-arrow{font-size:23px;margin-left:auto}.social-caption{font-size:10px;margin:23px 0 8px;color:var(--muted)}.socials{display:flex;justify-content:center;gap:13px}.socials a{width:83px;min-height:58px;display:flex;align-items:center;justify-content:center;gap:5px;flex-direction:column;text-decoration:none;border:1px solid #5425101b;border-radius:8px;transition:transform .25s,color .25s}.socials a:hover{transform:translateY(-3px);color:#a23e2b}.socials svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.socials span{font-size:10px}.scene-controls{display:flex;justify-content:center;gap:18px;margin:16px 0}.scene-controls button{font-size:10px;color:var(--muted);background:transparent;border:0;min-height:44px;padding:5px}.mini footer{font-size:9px;color:var(--muted);margin-top:2px}.mini footer>a{text-decoration:none}.draft-note{font-size:8px;margin:6px 0;color:var(--muted)}.embed .preview-nav{display:none}.embed .mini{padding-top:0}.embed .brand-mark{height:310px}.embed .scene-controls{display:none}.embed .mini footer{margin-top:22px}
html[data-option="2"]{--paper:#f4ead7;--green:#6e3920;--ink:#512711;--muted:#7b614e}html[data-option="2"] body::before{background:radial-gradient(ellipse at 75% 0%,#fff7dd,transparent 56%),radial-gradient(ellipse at 8% 35%,#b58a4a2d,transparent 47%)}html[data-option="2"] .ambient-a{background:radial-gradient(ellipse,#c2924a50,transparent 65%)}html[data-option="2"] .ambient-b{background:radial-gradient(ellipse,#b57d4a2e,transparent 65%)}html[data-option="2"] .aroma{animation:ritual-steam 4s ease-out both;filter:blur(.4px)}
html[data-option="3"]{--paper:#19291f;--ink:#f9efd9;--muted:#c4ba9e;--green:#a77c48;color-scheme:dark}html[data-option="3"] body::before{background:radial-gradient(ellipse at 80% 10%,#92a47113,transparent 55%),radial-gradient(ellipse at 15% 60%,#ba8a4920,transparent 48%)}html[data-option="3"] .brand-mark::before{content:"";position:absolute;inset:1% -8% -1%;background:radial-gradient(ellipse,#faf7ee 47%,#faf7eeef 56%,#faf7ee80 66%,transparent 73%);pointer-events:none}html[data-option="3"] .reserve{color:#1a2218;background:#c7a16d}html[data-option="3"] .socials a{border-color:#c4ba9e36}html[data-option="3"] .preview-nav{border-color:#f9efd91f}html[data-option="3"] .aroma{stroke:#c7a16d;animation:night-aroma 3.7s ease-out both}html[data-option="3"] .ambient-a{background:radial-gradient(ellipse,#d6b97355,transparent 70%)}html[data-option="3"] .ambient-b{background:radial-gradient(ellipse,#c7a16d3d,transparent 70%)}
html[data-option="3"] .brand-mark::before{inset:-6px -24px 0;background:#faf7ee;border-radius:0 0 45% 45% / 0 0 7% 7%}
html[data-option="3"] .brand-caption{margin-top:10px}
.mini{overflow:clip}
:root{--muted:#6d604f}
html[data-option="2"]{--muted:#6c533f}
html[data-option="3"]{--muted:#d1c5a7}
.preview-nav{font-size:12px}.brand-caption .tiny{font-size:12px;letter-spacing:2px}.slogan{font-size:13px}.reserve strong{font-size:16px}.reserve small{font-size:12px}.social-caption,.socials span,.scene-controls button{font-size:12px}.mini footer,.draft-note{font-size:10px}
.zt-3d .logo-img{opacity:0}
html.paused *,html.paused *::before,html.paused *::after{animation-play-state:paused!important}
@keyframes arrival-light{0%{opacity:0;transform:scale(.35)}30%{opacity:.8}100%{opacity:.14;transform:scale(1)}}
@keyframes botanic-drift{0%{opacity:0;transform:translate(-35px,30px) scale(.5)}25%{opacity:.65}100%{opacity:0;transform:translate(110px,-80px) scale(1.6)}}
@keyframes aroma-rise{0%{opacity:0;transform:translate(0,40px) scale(.8)}35%{opacity:.3}100%{opacity:0;transform:translate(12px,-35px) scale(1.1)}}
@keyframes ritual-steam{0%{opacity:0;transform:translateY(70px) scale(.75)}35%,70%{opacity:.75}100%{opacity:0;transform:translateY(-55px) scale(1.12)}}
@keyframes night-aroma{0%{opacity:0;transform:translateY(12px) rotate(-10deg)}40%{opacity:.6}100%{opacity:0;transform:translateY(-20px) rotate(8deg)}}
@keyframes button-glint{0%,68%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
@media(min-width:600px){.mini{padding-top:10px}.brand-mark{height:370px}.embed .brand-mark{height:310px}}
@media(max-width:360px){.mini{padding-left:20px;padding-right:20px}.brand-mark{height:286px}.embed .brand-mark{height:286px}h1{font-size:22px}.socials{gap:10px}.socials a{width:78px}.slogan{margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.ambient,.aroma{opacity:0!important}}
html[data-site] .mini{padding-top:clamp(18px,4svh,48px);padding-bottom:22px}
html[data-site] .brand-mark{height:clamp(286px,40svh,370px)}
html[data-site] .scene-controls{gap:10px;margin:15px 0 12px}
html[data-site] .scene-controls button{font-size:11px;padding:5px 8px}
html[data-site] .mini footer{font-size:10px}
@media(max-width:360px){html[data-site] .brand-mark{height:280px}html[data-site] .mini{padding-top:12px}}
@media(prefers-reduced-motion:reduce){html[data-site] #scene-skip{visibility:hidden}}
