/* The table is a persistent scene; only the menu pages change. */
body{min-height:100svh;background-attachment:fixed;isolation:isolate}
body.is-opening,body.has-dock{padding:0;overflow-x:hidden;overflow-y:auto}
.site-header,.is-opening .site-header{display:flex;position:absolute;top:0;left:0;right:0;z-index:30;max-width:none;border:0;padding:28px 4.5vw;color:#a48669}
.site-header{isolation:isolate;text-shadow:0 2px 8px #210811}
.site-header::before{content:"";position:absolute;inset:0 0 -22px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#350e19e6,#350e19a6 58%,transparent)}
#dialog-body .about-author{margin-top:24px;color:var(--gold-bright);font-family:var(--serif);letter-spacing:1px}
.brand>span{font-size:18px;letter-spacing:2px}
.brand svg{stroke:#927749;width:29px;height:37px}
.brand-flourish{opacity:.52;width:104px;height:19px}
.site-header nav{color:#a48676;font-size:12px;gap:30px}
.site-header button{transition:color .2s}
.site-header button:hover,.site-header button:focus-visible{color:#e0cba6}
main,.is-opening main{position:relative;z-index:2;display:grid;place-items:center;min-height:100svh;min-height:100dvh;padding:110px 100px 120px;perspective:1800px}
.site-footer,.is-opening .site-footer,.has-dock .site-footer{display:block;position:fixed;bottom:18px;left:0;right:0;z-index:3;min-height:0;margin:0;padding:0;overflow:visible;pointer-events:none}
.footer-copy{flex-direction:row;justify-content:center;gap:18px;font-size:10px;color:#97784d;opacity:.7}
.footer-copy button{pointer-events:auto;font-size:10px;color:#a48676}
.has-dock .site-footer{display:none}

/* The same cutout sits around the closed and opened menu. */
.table-roses{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.table-rose{position:absolute;left:calc(50% + var(--x));top:var(--y);width:var(--size);height:auto;max-width:none;opacity:.65;filter:brightness(.66) saturate(.7) drop-shadow(0 12px 9px #19040c55);transform:translate(-50%,-50%) rotate(var(--angle));transition:left 1050ms cubic-bezier(.22,.68,.2,1),top 1050ms cubic-bezier(.22,.68,.2,1),transform 1050ms cubic-bezier(.22,.68,.2,1),opacity 1050ms}
.rose-1{--x:-455px;--out:-610px;--y:22%;--size:192px;--angle:-25deg}
.rose-2{--x:-295px;--out:-575px;--y:35%;--size:230px;--angle:15deg}
.rose-3{--x:-505px;--out:-650px;--y:53%;--size:230px;--angle:-48deg}
.rose-4{--x:-305px;--out:-565px;--y:72%;--size:212px;--angle:26deg}
.rose-5{--x:-460px;--out:-615px;--y:86%;--size:185px;--angle:-14deg}
.rose-6{--x:455px;--out:610px;--y:20%;--size:194px;--angle:27deg}
.rose-7{--x:295px;--out:575px;--y:34%;--size:225px;--angle:-13deg}
.rose-8{--x:505px;--out:650px;--y:52%;--size:235px;--angle:47deg}
.rose-9{--x:305px;--out:565px;--y:71%;--size:215px;--angle:-24deg}
.rose-10{--x:460px;--out:615px;--y:85%;--size:188px;--angle:18deg}
.rose-11{--x:-180px;--out:-265px;--y:14%;--open-y:7%;--size:168px;--angle:38deg}
.rose-12{--x:180px;--out:265px;--y:13%;--open-y:7%;--size:172px;--angle:-31deg}
.rose-13{--x:-160px;--out:-275px;--y:89%;--open-y:95%;--size:185px;--angle:-44deg}
.rose-14{--x:165px;--out:275px;--y:89%;--open-y:95%;--size:180px;--angle:36deg}
.rose-15{--x:-455px;--out:-620px;--y:39%;--size:145px;--angle:54deg}
.rose-16{--x:455px;--out:620px;--y:66%;--size:147px;--angle:-51deg}
.rose-17{--x:-350px;--out:-390px;--y:17%;--open-y:5.5%;--size:126px;--angle:-8deg}
.rose-18{--x:350px;--out:390px;--y:16%;--open-y:5.5%;--size:130px;--angle:16deg}
.rose-19{--x:-450px;--out:-625px;--y:68%;--size:132px;--angle:61deg}
.rose-20{--x:450px;--out:625px;--y:39%;--size:145px;--angle:-63deg}
.rose-21{--x:-330px;--out:-440px;--y:92%;--open-y:98%;--size:128px;--angle:23deg}
.rose-22{--x:330px;--out:440px;--y:92%;--open-y:98%;--size:132px;--angle:-17deg}
.menu-open .table-rose{left:calc(50% + var(--out));top:var(--open-y,var(--y));transform:translate(-50%,-50%) rotate(calc(var(--angle) + 12deg)) scale(.92);opacity:.5}

/* Closed cover and unfolding leaves share the table's central area. */
.opening-view{height:100%;width:100%;min-height:620px;overflow:visible;isolation:auto}
.opening-menu{top:50%;width:340px;height:510px;max-height:none;max-width:calc(100vw - 80px);padding:34px 32px 28px}
.opening-menu h1{font-size:40px}
.opening-menu h1 span:first-child{font-size:32px}
.opening-rose{width:80px;height:96px;margin:25px auto 17px}
.opening-hint{top:calc(50% + 283px);font-size:10px}
.opening-hit{position:absolute;inset:-110px -100px -100px;width:calc(100% + 200px);height:calc(100% + 210px)}
.opening-leaves{position:absolute;left:50%;top:50%;width:min(920px,calc(100vw - 240px));height:600px;max-height:calc(100svh - 230px);transform:translate(-50%,-50%) scaleX(.38);opacity:0;background:linear-gradient(90deg,#4b1728,#431320 48%,#270b16 50%,#4b1828 53%,#431321);border:1px solid #987d4a;box-shadow:0 25px 55px #10020b75,inset 0 0 0 6px #3f1322,inset 0 0 0 7px #a1844f66;transition:transform 700ms cubic-bezier(.4,0,.25,1),opacity 300ms}
.is-unfolding .opening-leaves{transform:translate(-50%,-50%) scaleX(1);opacity:1}
.is-unfolding .opening-hint{opacity:0;animation:none}

/* One bounded, two-leaf spread, with a gutter and slightly raised edges. */
.book-wrap{width:min(920px,calc(100vw - 240px));max-width:100%;perspective:1800px}
.book-spread{height:clamp(490px,calc(100svh - 230px),620px);padding:10px 13px 15px;background:linear-gradient(90deg,#451421,#4c1929 3%,#471624 46%,#310d1a 49.8%,#2b0b16 50%,#501b2c 53%,#431321 97%,#360f1c);border:1px solid #927848;box-shadow:0 32px 65px #10020b75,0 6px 0 -2px #200812,0 7px 0 -2px #91764c55,inset 0 0 0 5px #3c1120,inset 0 0 0 6px #b79b6240;isolation:isolate}
.book-pages{display:grid;height:100%;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:54px minmax(0,1fr)}
.book-spread::before{inset:12px;border-color:#b79b6224}
.book-spread .corner{opacity:.75}
.book-topbar{grid-column:1/-1;display:flex;align-items:center;justify-content:center;padding:0 18px;color:#9f814d}
.book-topbar .journey-nav{width:100%;margin:0;font-size:11px}
.journey-nav .text-button,.back-button{font-size:11px;color:#b39a80}
.journey-label{color:#9e8154;font-size:11px}
.book-binding{position:absolute;top:15px;bottom:15px;left:50%;width:20px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#21081155 46%,#c1a56a22 50%,#19050d33 53%,transparent);pointer-events:none;z-index:3}
.book-leaf{position:relative;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#9a784740 transparent;padding:24px 32px 30px;backface-visibility:hidden}
.book-left{display:flex;align-items:center;justify-content:center}
.book-right{display:flex;flex-direction:column;justify-content:center}
.book-question{width:100%;text-align:center;margin:auto}
.question-flourish{width:210px;max-width:90%;height:38px;margin:0 auto 37px;opacity:.8}
.question-title,.number-title{font-size:29px;line-height:1.9;letter-spacing:2px;max-width:350px;margin:0 auto;text-wrap:pretty}
.number-title{text-wrap:balance}
.book-question>.ornament{margin:35px auto 0;opacity:.6}
.number-selection{text-align:center;margin:auto 0}
.number-pad{max-width:278px;gap:12px}
.number-key{height:67px;font-size:31px}
.resume-number{font-size:10px}
.options{width:100%;gap:13px;margin:auto 0}
.option{padding:14px 15px;gap:11px;font-size:14px;min-height:62px;flex-shrink:0;border-color:#a4875555;background:linear-gradient(90deg,#d4ac6b09,transparent)}
.option-flower{font-size:14px}.option-arrow{font-size:16px}
.help-option{font-size:12px}
.book-right>.options{flex-shrink:0}

/* Cards stay on the table below the menu, rather than in a full-width bar. */
.card-dock{width:max-content;max-width:calc(100% - 40px);left:50%;bottom:13px;transform:translateX(-50%);height:94px;padding:8px 22px;gap:28px;border:0;background:linear-gradient(90deg,transparent,#2a0b18aa 18%,#2a0b18aa 82%,transparent);box-shadow:none;backdrop-filter:none}
.dock-caption strong{font-size:14px;letter-spacing:1px}.dock-caption small{font-size:9px}
.dock-flourish{width:82px;opacity:.55}.dock-cards{min-width:180px;gap:10px}
.mini-card{width:47px;height:67px}.mini-card .question-mark{font-size:25px}
.empty-card{width:47px;height:67px}

/* The ending is the same open menu: letter on the left, meal on the right. */
.result-book .book-left{display:block}
.result-letter{padding:16px 0 22px;min-height:100%;display:flex;flex-direction:column;justify-content:center}
.letter-flourish{width:240px;max-width:100%;height:43px;margin-bottom:28px}
.result-title{font-size:31px;letter-spacing:2px;line-height:1.75}
.result-body{font-size:15px;line-height:2.05;margin-top:24px;letter-spacing:.4px}
.result-signature{margin-top:28px}.result-signature span{font-size:13px}
.result-book .book-right{display:block;padding:14px 26px 27px}
.revealed-menu{padding:0}
.reveal-flourish{width:135px;height:24px;margin:0 auto 10px}
.revealed-menu h2{font-size:22px;letter-spacing:2px;margin:7px 0}
.result-cards{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:21px auto 20px;max-width:350px}
.reveal-card{flex:0 1 calc(50% - 6px);width:150px;min-width:110px;max-width:160px;height:213px}
.reveal-front{padding:16px 10px}.dish-category{font-size:10px;letter-spacing:3px}
.dish-icon{width:42px;height:42px;margin:14px 0 10px}
.reveal-front h3{font-size:16px;letter-spacing:.5px;line-height:1.55}.dish-ornament{font-size:9px;margin-top:10px}
.result-cards .card-back{padding:6px}.result-cards .question-mark{font-size:53px}
.result-actions{gap:9px;flex-wrap:wrap}
.result-actions .button{font-size:11px;min-height:40px;padding:9px 13px;letter-spacing:.3px;gap:9px}
.result-note{font-size:9px;line-height:1.9;margin-top:17px;padding:0}
.path-details{font-size:11px;margin-top:18px}.path-details summary{padding:15px 2px}
.path-details strong{font-size:13px}.path-details p span{font-size:11px}
.result-again{font-size:11px;margin-top:17px}

@media(min-width:701px) and (max-width:1150px){
 main,.is-opening main{padding-inline:50px}
 .book-wrap,.opening-leaves{width:calc(100vw - 140px)}
 .book-leaf{padding-inline:25px}
 .table-rose{left:calc(50% + var(--x)*.8);width:calc(var(--size)*.85)}
 .menu-open .table-rose{left:calc(50% + var(--out)*.85)}
 .opening-hit{left:-50px;right:-50px;width:calc(100% + 100px)}
}
@media(max-width:700px){
 .site-header,.is-opening .site-header{padding:20px 22px;align-items:center;gap:12px}
 .brand{gap:8px}.brand svg{width:23px;height:29px}.brand>span{font-size:15px;letter-spacing:1px}
 .brand-flourish{width:86px;height:15px;margin-top:2px;opacity:.45}
 .site-header nav{flex-direction:column;align-items:flex-end;gap:0;font-size:10px;line-height:1.7}
 .site-header nav button{padding:3px 0}
 main,.is-opening main{padding:154px 24px;min-height:100svh;min-height:100dvh}
 .opening-view{min-height:0;height:calc(100svh - 308px)}
 .opening-menu{width:250px;height:388px;max-width:calc(100vw - 100px);top:50%;padding:25px 23px 22px}
 .opening-flourish{width:116px;height:22px;margin:0}
 .opening-rose{width:62px;height:73px;margin:20px auto 12px}
 .opening-menu h1{font-size:31px;line-height:1.6;letter-spacing:4px}
 .opening-menu h1 span:first-child{font-size:25px;letter-spacing:8px}
 .opening-menu .ornament{margin-top:20px}.opening-seal{padding-top:10px;font-size:16px}
 .opening-hint{top:calc(50% + 214px);font-size:9px;letter-spacing:2px}
 .opening-hit{inset:-50px -24px -100px;width:calc(100% + 48px);height:calc(100% + 150px)}
 .opening-leaves{width:calc(100vw - 48px);height:calc(100svh - 308px);max-height:none;transform:translate(-50%,-50%) scale(.8)}
 .is-unfolding .opening-leaves{transform:translate(-50%,-50%) scale(1)}
 .table-rose{left:var(--mx);top:calc(50% + var(--my));width:var(--ms);opacity:.57}
 .rose-1{--mx:12%;--my:-238px;--ms:104px;--retreat:-64px}
 .rose-2{--mx:38%;--my:-250px;--ms:114px;--retreat:-64px}
 .rose-3{display:none}
 .rose-4{--mx:67%;--my:-244px;--ms:118px;--retreat:-64px}
 .rose-5{--mx:93%;--my:-229px;--ms:98px;--retreat:-64px}
 .rose-6{--mx:8%;--my:232px;--ms:102px;--retreat:64px}
 .rose-7{--mx:35%;--my:249px;--ms:116px;--retreat:64px}
 .rose-8{display:none}
 .rose-9{--mx:65%;--my:246px;--ms:114px;--retreat:64px}
 .rose-10{--mx:93%;--my:230px;--ms:100px;--retreat:64px}
 .rose-11{--mx:3%;--mx-out:-8%;--my:-130px;--ms:118px;--retreat:-10px}
 .rose-12{--mx:97%;--mx-out:108%;--my:-140px;--ms:116px;--retreat:-10px}
 .rose-13{--mx:1%;--mx-out:-9%;--my:0px;--ms:126px;--retreat:0px}
 .rose-14{--mx:99%;--mx-out:109%;--my:8px;--ms:124px;--retreat:0px}
 .rose-15{--mx:3%;--mx-out:-8%;--my:145px;--ms:114px;--retreat:10px}
 .rose-16{--mx:97%;--mx-out:108%;--my:139px;--ms:118px;--retreat:10px}
 .rose-19{--mx:1%;--mx-out:-9%;--my:-65px;--ms:84px;--retreat:-6px}
 .rose-20{--mx:99%;--mx-out:109%;--my:65px;--ms:86px;--retreat:6px}
 .menu-open .table-rose{left:var(--mx-out,var(--mx));top:calc(50% + var(--my) + var(--retreat));transform:translate(-50%,-50%) rotate(calc(var(--angle) + 10deg)) scale(.9);opacity:.45}
 .book-wrap{width:100%;max-width:430px}
 .book-spread{height:auto;max-height:calc(100svh - 308px);min-height:0;padding:10px 16px 22px;background:linear-gradient(100deg,#38101d,#4a1727 7%,#461524 91%,#32101b);box-shadow:0 22px 45px #10020b75,0 5px 0 -2px #200812,0 6px 0 -2px #91764c55,inset 0 0 0 5px #3c1120,inset 0 0 0 6px #b79b6240}
 .book-pages{display:flex;flex-direction:column;height:auto;max-height:calc(100svh - 342px);min-height:360px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#9a784740 transparent}
 .book-topbar{flex:0 0 36px;padding:0 3px;position:relative;z-index:4}
 .book-topbar .journey-nav{gap:6px}.journey-nav .text-button,.back-button{font-size:9px}.journey-label{font-size:9px;letter-spacing:.5px}
 .book-leaf{overflow:visible;flex-shrink:0;padding:20px 9px 18px;min-height:auto}
 .book-left{display:block;text-align:center;border-bottom:1px solid #af8d4c30;background:linear-gradient(0deg,#21091416,transparent 15px)}
 .book-right{display:block;padding-top:23px}
 .book-binding{display:none}
 .question-flourish{width:153px;height:27px;margin:0 auto 19px}
 .question-title,.number-title{font-size:22px;line-height:1.75;letter-spacing:1px;max-width:290px;margin:0 auto}
 .book-question>.ornament{display:none}
 .number-title{max-width:235px;font-size:21px}
 .number-pad{max-width:235px;gap:9px}.number-key{height:48px;font-size:26px}
 .resume-number{margin-top:11px;font-size:10px}
 .options{gap:10px}
 .option{font-size:13px;line-height:1.65;min-height:53px;padding:12px 11px;gap:9px}
 .help-option{font-size:12px}.option-flower{font-size:13px}
 .card-dock{max-width:calc(100% - 34px);gap:16px;height:85px;bottom:8px;padding:6px 8px;justify-content:center}
 .dock-caption strong{font-size:12px}.dock-caption small{font-size:9px}.dock-flourish{width:68px;height:13px}
 .dock-cards{min-width:128px;gap:7px}.mini-card,.empty-card{width:39px;height:57px}.mini-card .question-mark{font-size:22px}
 .site-footer,.is-opening .site-footer{bottom:19px}
 .footer-copy{font-size:9px;gap:14px}.footer-copy button{font-size:9px}
 .result-book .book-left{padding:23px 9px 27px}
 .result-letter{padding:0;min-height:auto}
 .letter-flourish{width:190px;height:34px;margin-bottom:22px}
 .result-title{font-size:27px;line-height:1.7}.result-body{font-size:14px;line-height:2;margin-top:20px}
 .result-signature{margin-top:23px}.result-signature span{font-size:12px}
 .result-book .book-right{padding:27px 6px 12px}
 .reveal-flourish{width:125px;height:23px}.revealed-menu h2{font-size:21px}
 .result-cards{gap:10px;margin-block:20px}.reveal-card{min-width:100px;max-width:150px;flex-basis:calc(50% - 5px);height:203px}
 .reveal-front h3{font-size:15px}.result-actions .button{padding:9px 10px;font-size:11px}
}
@media(max-height:720px) and (min-width:701px){
 main,.is-opening main{padding-top:90px;padding-bottom:102px}
 .book-spread{height:calc(100svh - 192px);min-height:360px}
 .opening-view{min-height:calc(100svh - 192px)}
 .opening-menu{height:410px;max-height:calc(100svh - 160px);padding-top:24px;padding-bottom:20px}
 .opening-rose{width:60px;height:70px;margin:16px auto 10px}
 .opening-menu h1{font-size:31px;line-height:1.5}.opening-menu h1 span:first-child{font-size:25px}
 .opening-hint{top:calc(50% + min(205px,50svh - 80px) + 20px)}
 .book-leaf{padding-top:15px;padding-bottom:20px}.number-key{height:51px}.number-pad{gap:9px}
 .card-dock{height:82px;bottom:6px}
}
@media(max-height:760px) and (max-width:700px){
 main,.is-opening main{padding-top:132px;padding-bottom:118px}
 .opening-view{height:calc(100svh - 250px)}
 .opening-menu{height:350px;padding-top:22px;padding-bottom:19px}
 .opening-rose{width:53px;height:60px;margin:16px auto 9px}
 .opening-menu h1{font-size:29px}.opening-menu h1 span:first-child{font-size:23px}
 .opening-hint{top:calc(50% + 192px)}
 .book-spread{max-height:calc(100svh - 250px);min-height:0}
 .book-pages{max-height:calc(100svh - 284px);min-height:280px}
 .table-rose{top:calc(50% + var(--my)*.85);width:calc(var(--ms)*.86)}
 .menu-open .table-rose{top:calc(50% + var(--my)*.85 + var(--retreat)*.72)}
 .menu-open .rose-1,.menu-open .rose-2,.menu-open .rose-4,.menu-open .rose-5{top:max(98px,calc(50% + var(--my)*.85 + var(--retreat)*.72))}
 .book-leaf{padding-block:15px}.question-flourish{height:22px;margin-bottom:13px}
 .question-title,.number-title{font-size:20px}.number-key{height:42px}
}
@media(prefers-reduced-motion:reduce){.table-rose,.opening-leaves{transition:none}.opening-menu{animation:none}}
.desktop-edge{display:none}
/* A cropped outer layer extends the desktop flowers beyond the table's frame. */
@media(min-width:701px){
 .desktop-edge{display:block;left:calc(50% + var(--x));width:var(--size);opacity:.52}
 .rose-23{--x:calc(-50vw - 20px);--out:calc(-50vw - 69px);--y:35%;--size:210px;--angle:13deg}
 .rose-24{--x:calc(50vw + 22px);--out:calc(50vw + 72px);--y:32%;--size:216px;--angle:-22deg}
 .rose-25{--x:calc(-50vw - 17px);--out:calc(-50vw - 65px);--y:74%;--size:198px;--angle:-34deg}
 .rose-26{--x:calc(50vw + 19px);--out:calc(50vw + 68px);--y:73%;--size:208px;--angle:42deg}
 .rose-27{--x:-90px;--out:-135px;--y:-19px;--open-y:-53px;--size:200px;--angle:-15deg}
 .rose-28{--x:110px;--out:155px;--y:-20px;--open-y:-55px;--size:210px;--angle:32deg}
 .rose-29{--x:-90px;--out:-140px;--y:calc(100% + 25px);--open-y:calc(100% + 65px);--size:224px;--angle:49deg}
 .rose-30{--x:115px;--out:165px;--y:calc(100% + 23px);--open-y:calc(100% + 61px);--size:218px;--angle:-28deg}
 .menu-open .desktop-edge{left:calc(50% + var(--out));opacity:.42}
}
/* Quieter outer flowers form a second, looser layer on phones. */
@media(max-width:700px){
 .table-rose.rose-3{display:block;left:52%;top:108px;width:112px;opacity:.43}
 .table-rose.rose-8{display:block;left:52%;top:calc(100% - 84px);width:122px;opacity:.47}
 .table-rose.rose-17{left:20%;top:111px;width:86px;opacity:.43}
 .table-rose.rose-18{left:83%;top:113px;width:84px;opacity:.43}
 .table-rose.rose-21{left:18%;top:calc(100% - 102px);width:94px;opacity:.43}
 .table-rose.rose-22{left:86%;top:calc(100% - 100px);width:96px;opacity:.43}
 .menu-open .table-rose.rose-3{left:50%;top:88px;opacity:.32}
 .menu-open .table-rose.rose-8{left:20%;top:calc(100% - 40px);opacity:.35}
 .menu-open .table-rose.rose-17{left:6%;top:89px;opacity:.32}
 .menu-open .table-rose.rose-18{left:94%;top:89px;opacity:.32}
 .menu-open .table-rose.rose-21{left:2%;top:calc(100% - 45px);opacity:.32}
 .menu-open .table-rose.rose-22{left:94%;top:calc(100% - 43px);opacity:.32}
}
@media print{
 .table-roses{display:none}main{display:block;padding:0;min-height:0}.book-wrap{width:100%;max-width:none}
 .book-spread,.book-pages{display:block;height:auto;max-height:none;overflow:visible;background:white;box-shadow:none;color:black}
 .book-topbar,.book-binding{display:none}.book-leaf{overflow:visible;padding:25px}.result-letter{min-height:0}
}

/* Languages share the same menu, routes and floral composition. */
.site-header nav {flex-wrap:wrap;justify-content:flex-end;align-items:center}
.language-switch {display:flex;align-items:center;gap:0;border-left:1px solid #a58a5344;padding-left:12px}
.site-header .language-switch button {font-size:12px;padding:6px 8px;letter-spacing:.02em;white-space:nowrap;min-height:32px}
.language-switch button[aria-pressed="true"] {color:#dec593;text-decoration:underline;text-underline-offset:5px}
html[lang="en"] .brand {font-size:clamp(15px,1.5vw,22px);letter-spacing:.01em}
html[lang="en"] .opening-menu h1 {font-size:clamp(25px,3.3vw,43px);letter-spacing:.03em;line-height:1.5}
html[lang="en"] .opening-menu h1 span:last-child {font-size:.9em}
html[lang="en"] .question-title, html[lang="en"] .number-title {font-size:clamp(24px,2.5vw,36px);line-height:1.4;letter-spacing:.01em;overflow-wrap:break-word}
html[lang="en"] .result-title {font-size:clamp(25px,2.6vw,38px);letter-spacing:.01em;line-height:1.3}
html[lang="en"] .option {letter-spacing:.01em;line-height:1.55}
html[lang="en"] .result-body,html[lang="en"] .dialog-body {letter-spacing:.01em;line-height:1.85}
html[lang="en"] .reveal-front h3 {font-size:16px;line-height:1.4;letter-spacing:0;overflow-wrap:break-word}
html[lang="en"] .result-actions .button {letter-spacing:0;font-size:13px;padding-inline:12px}
html[lang="ja"] body {font-family:"Noto Serif CJK JP","Yu Mincho","Hiragino Mincho ProN",serif}
@media(max-width:700px){
 .site-header nav {row-gap:2px;max-width:54%}
 .language-switch {flex-basis:100%;justify-content:flex-end;border-left:0;padding-left:0}
 .site-header .language-switch button {font-size:10px;padding:5px 6px;min-height:30px}
 html[lang="en"] .site-header nav>button {font-size:10px;letter-spacing:0}
 html[lang="en"] .brand {font-size:15px;max-width:43%;text-align:left;line-height:1.35}
 html[lang="en"] .brand>span {max-width:130px}
 html[lang="en"] .opening-menu h1 {font-size:29px}
 html[lang="en"] .question-title,html[lang="en"] .number-title {font-size:24px}
 html[lang="en"] .option {font-size:13px;padding-block:10px}
 html[lang="en"] .journey-nav {gap:6px;font-size:10px}
 html[lang="en"] .journey-nav button {font-size:10px;letter-spacing:0}
 html[lang="en"] .dock-caption {font-size:10px;letter-spacing:0}
 html[lang="en"] .result-title {font-size:27px}
}