@charset "UTF-8";
:root{color-scheme:light;--ink:#20211f;--muted:#626359;--line:rgba(33,35,27,.26);--serif:"Songti SC","STSong","Noto Serif CJK SC",serif;--sans:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-family:var(--sans);color:var(--ink);font-synthesis:none;background:#e9e6dc}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select{font:inherit;color:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait}button{border:0;background:none}button:focus,a:focus,input:focus,select:focus,summary:focus{outline:none}body.keyboard-navigation :is(button,a,summary,input,select):focus-visible{background-color:#e9e4ef}body.keyboard-navigation .primary:focus-visible{background-color:#51485d}h1:focus{outline:none}a{color:inherit;text-underline-offset:4px}p,h1,h2,h3{margin:0}button,input,select{touch-action:manipulation}::selection{background:#bac983;color:#20211f}[hidden]{display:none!important}
#atmosphere{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:-2}.paper-grain{position:fixed;inset:0;pointer-events:none;opacity:.055;z-index:4;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' opacity='.8' d='M0 0h180v180H0z'/%3E%3C/svg%3E");background-size:180px 180px}.screen{width:min(100%,480px);min-height:100svh;margin:0 auto;padding:28px 28px max(22px,env(safe-area-inset-bottom));position:relative;animation:arrive .4s ease both}.edge-note{display:none;position:fixed;top:50%;font-size:10px;font-weight:500;letter-spacing:3px;writing-mode:vertical-rl;opacity:.45}.edge-left{left:5vw;transform:rotate(180deg)}.edge-right{right:5vw}.topbar{display:flex;align-items:flex-start;justify-content:space-between;width:100%;min-height:34px}.tiny-brand{font-size:10px;letter-spacing:1.5px;line-height:1.55;text-transform:uppercase}.motion-toggle{display:flex;align-items:center;gap:7px;font-size:11px;padding:8px 0 8px 12px;white-space:nowrap;min-height:34px}.motion-toggle span:first-child{font-size:15px}.text-button{font-size:13px;padding:10px 0;line-height:1.45;min-height:40px}.back{font-size:21px;padding-top:0;display:flex;align-items:center;gap:10px}.back span{font-size:12px}.theory-note{font-size:11px;position:relative;margin-top:28px;line-height:1.65;padding-left:25px}.theory-note .asterisk{position:absolute;left:0;top:0;font-size:20px}.theory-note button{font-size:9px;color:var(--muted);padding:4px 0}.intro{display:flex;flex-direction:column;overflow:hidden}.hero{position:relative;margin-top:34px;padding-left:15px}.hero h1{font-size:clamp(51px,15.7vw,70px);line-height:1.1;letter-spacing:-.045em;font-weight:900;position:relative;z-index:1}.hero h1 span{display:block}.hero-subtitle{font-size:14px;font-weight:600;letter-spacing:5px;margin:24px 0 0 3px}.outline-title{font-family:var(--sans);color:transparent;-webkit-text-stroke:1.2px var(--ink);font-weight:700;font-size:clamp(77px,23.8vw,108px);letter-spacing:-.07em;line-height:1.1;white-space:nowrap;margin:6px 0 0 -5px}.title-period{font-size:.26em;vertical-align:20%;-webkit-text-stroke:1px var(--ink);margin-left:9px}.hero-caption{font-size:12px;letter-spacing:1px;margin:16px 0 0 2px;color:#55574f}.hero-caption span{color:var(--ink);font-weight:600;margin-left:2px}.thinker-seal{position:absolute;right:-12px;top:104px;width:120px;height:120px;transform:rotate(9deg);z-index:2}.thinker-seal img{position:absolute;width:84px;height:84px;left:18px;top:18px;object-fit:contain;filter:invert(1);mix-blend-mode:screen}.orbit{position:absolute;inset:0;animation:rotate 28s linear infinite}.orbit span{position:absolute;left:calc(50% - 3px);top:0;height:60px;width:6px;transform-origin:50% 100%;transform:rotate(var(--angle));font:8px/1 monospace;color:#fff;letter-spacing:0;font-weight:500}.ribbons{margin:29px -28px 0;display:flex;flex-direction:column;gap:9px;transform:rotate(-6deg)}.ribbon{overflow:hidden;border-top:1px solid rgba(35,38,30,.43);border-bottom:1px solid rgba(35,38,30,.43);font-size:12px;padding:6px 0;white-space:nowrap;line-height:1.45}.ribbon-two{transform:translateX(-30px);width:calc(100% + 60px)}.marquee{display:flex;width:max-content;animation:marquee 29s linear infinite}.marquee span{padding-right:50px}.ribbon-two .marquee{animation-direction:reverse;animation-duration:42s}.entry-actions{margin-top:34px;text-align:center}.primary{width:100%;background:var(--ink);color:#f6f4e9;border:1px solid var(--ink);border-radius:0;min-height:58px;padding:15px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:15px;letter-spacing:1px;text-decoration:none;transition:background .2s,transform .2s}.primary:hover{background:#3f4437}.primary:active{transform:scale(.986)}.primary:disabled{opacity:.55}.primary span[aria-hidden]{font-size:26px;font-family:Arial;font-weight:400;line-height:1}.start{width:calc(100% - 28px);margin:auto}.entry-caption{display:flex;justify-content:center;gap:13px;font-size:10px;margin-top:11px;color:#505349}.entry-caption span+span:before{content:'·';margin-right:13px}.purpose{font-size:11px;line-height:1.75;color:#55594e;margin-top:17px}.brand-footer{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:20px;margin-top:auto;padding-top:30px}.brand-footer>:nth-child(2){text-align:center}.brand-footer>:last-child{text-align:right}.iemerge{font-family:Arial,sans-serif;font-size:19px;font-weight:700;letter-spacing:-1px}.year{font:13px monospace;letter-spacing:2px}.gpt-wordmark{font-size:15px;font-family:Arial,sans-serif;letter-spacing:-.7px;display:flex;gap:5px;align-items:center}.dot-grid{font-size:22px;letter-spacing:0;line-height:1}.progress{display:flex;gap:7px;margin-top:28px}.progress span{height:2px;background:rgba(35,38,30,.17);flex:1}.progress .done{background:#686b58}.progress .current{background:#23251e;height:3px}.question-screen{display:flex;flex-direction:column}.question-body{padding-top:51px}.question-meta{display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:1px}.question-meta>span:first-child{font-size:20px;font-family:Georgia,serif}.question-meta i{font-style:normal;font-size:13px;color:#6b6d62;margin-left:4px}.question-title{font-family:var(--serif);font-weight:600;font-size:clamp(28px,8.1vw,38px);line-height:1.45;letter-spacing:-.05em;margin-top:29px}.question-prompt{font-size:12px;line-height:1.8;color:#5c5f53;min-height:26px;margin-top:14px}.options{display:grid;margin-top:30px}.option{width:100%;display:grid;grid-template-columns:31px 1fr 20px;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:21px 5px;min-height:72px;text-align:left;transition:background .2s,padding .2s,opacity .2s}.option:first-child{border-top:1px solid var(--line)}.option-letter{font-family:Georgia,serif;font-size:17px}.option-label{font-size:15px;line-height:1.65}.option-arrow{font-size:18px;opacity:.45}.option:hover{background:#f6f4e433;padding-left:11px}.option.selected{background:#f2f4d6aa;padding-left:14px}.option.selected .option-arrow{opacity:1}.options:has(.selected) .option:not(.selected){opacity:.45}.selection-hint{font-size:11px;color:#626656;text-align:center;margin:24px 0}.skip{margin:15px auto;display:block;border-bottom:1px solid var(--line);padding-bottom:5px}.question-bottom{display:flex;align-items:flex-end;justify-content:space-between;font-size:10px;line-height:1.7;letter-spacing:.4px;padding-top:40px;margin-top:auto;color:#626656}.question-bottom>span:last-child{text-align:right}.small-flower{font-size:36px;line-height:1;font-weight:200;color:#525843;animation:rotate 50s linear infinite}.profile-screen{display:flex;flex-direction:column}.profile-heading{margin:43px 0 34px}.eyebrow{font-size:10px;font-weight:500;letter-spacing:1.5px;color:#5d6252}.profile-heading h1{font-family:var(--serif);font-size:45px;line-height:1.3;margin:17px 0 13px;font-weight:600;letter-spacing:-2px}.profile-heading p{font-size:13px;color:var(--muted)}.field{display:block;font-size:12px;margin-bottom:23px}.field input,.field select{display:block;width:100%;border:0;border-radius:0;border-bottom:1px solid var(--line);background:transparent;padding:12px 0 13px;font-size:16px;min-height:49px}.field input::placeholder{color:#737568;font-size:13px}.field select{appearance:auto}.muted{color:var(--muted);font-size:11px}.two-fields{display:flex;gap:24px}.two-fields>*{flex:1;min-width:0}.consent{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.8;margin:10px 0 0;cursor:pointer}.consent input{width:17px;height:17px;min-width:17px;margin:3px 0 0;accent-color:#424c2d}.privacy-link{padding:7px 0 7px 27px;font-size:11px;text-decoration:underline;text-underline-offset:3px;color:#626656}.form-error{color:#962c2c;font-size:12px;line-height:1.6;min-height:25px;margin-bottom:8px}.local-result{display:block;margin:10px auto 0;font-size:12px}.profile-note{text-align:center;font-size:11px;color:#626656;margin-top:27px}.result-screen{padding-bottom:25px}.result-screen .topbar{margin-bottom:26px}.result-card{padding:23px 21px 0;border:1px solid rgba(61,62,44,.45);background:rgba(255,255,245,.17);position:relative}.result-topline{display:flex;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:.5px}.result-intro{margin-top:31px;text-align:center;font-size:12px;color:#5e6352;overflow-wrap:anywhere}.animal-title{text-align:center;font-family:var(--serif);font-size:36px;letter-spacing:-1.7px;margin-top:12px;line-height:1.35;font-weight:600}.animal-english{font-size:9px;letter-spacing:2.3px;text-align:center;margin-top:11px}.animal-scene{position:relative;isolation:auto;height:270px;margin:3px -8px 0;display:flex;align-items:center;justify-content:center}.animal-scene>img{position:relative;width:270px;height:270px;max-width:100%;object-fit:contain;mix-blend-mode:multiply;animation:float 7s ease-in-out infinite}.animal-orbit{width:240px;height:125px;border:1px solid #737a5540;border-radius:50%;position:absolute;transform:rotate(-27deg)}.animal-caption{position:absolute;top:54px;left:-2px;font-size:8px;letter-spacing:1px;line-height:1.8;color:#777c69;writing-mode:vertical-rl}.animal-star{position:absolute;right:8px;bottom:51px;font-size:30px;color:#777c69}.result-tagline{text-align:center;font-size:15px;line-height:1.7;font-weight:500;margin-top:0}.result-tags{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;margin-top:18px}.result-tags>span{font-size:10px;border:1px solid #747a5d66;border-radius:99px;padding:5px 9px;white-space:nowrap}.result-description{font-family:var(--serif);font-size:15px;line-height:1.9;margin-top:22px}.result-detail{border-top:1px solid var(--line);margin-top:24px;padding-top:19px}.result-detail .eyebrow{font-size:10px;letter-spacing:1px}.result-detail p{font-size:13px;line-height:1.85;margin:7px 0 19px}.axis-title{font-size:12px;margin-top:23px}.axis-title span{font-size:9px;color:#727764;float:right;line-height:1.8}.axis-list{margin-top:14px;display:grid;gap:11px}.axis-list>div{display:flex;align-items:center;gap:10px;font-size:11px}.axis-list small{font-size:9px;color:#69705b}.axis-dots{display:flex;gap:5px;margin-left:auto}.axis-dots i{width:20px;height:5px;background:#69705b20}.axis-dots i.filled{background:#727e51}.evidence{font-size:11px;margin-top:25px;color:#636b55;line-height:1.8}.evidence summary{cursor:pointer;min-height:30px}.evidence p{margin:7px 0}.evidence-quote{font-size:12px;color:var(--ink)}.card-bottom{border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:9px;margin-top:24px;padding:16px 0}.result-actions{margin:22px 0 0}.action-pair{display:flex;justify-content:space-between;margin-top:9px}.action-pair button{font-size:11px}.submission-state{font-size:10px;text-align:center;margin-top:15px;line-height:1.8;color:#68705a}.withdraw{display:block;margin:auto;text-decoration:underline;color:#68705a;font-size:10px}.result-disclaimer{font-size:10px;color:#68705a;text-align:center;line-height:1.8;margin-top:20px}.result-disclaimer button{font-size:10px;text-decoration:underline}.result-screen .brand-footer{margin-top:18px}
#toast{position:fixed;bottom:max(32px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%,20px);background:#24291fe8;color:#fff;padding:13px 20px;font-size:13px;line-height:1.6;max-width:90%;width:max-content;z-index:12;opacity:0;pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{color:var(--ink);background:#eeeede;border:1px solid #9b9d89;padding:38px 28px 28px;max-height:88svh;width:min(440px,calc(100% - 32px));margin:auto;overscroll-behavior:contain}dialog::backdrop{background:#33352888;backdrop-filter:blur(8px)}.modal-close{position:absolute;right:10px;top:6px;font-size:28px;width:40px;height:40px}dialog h2{font-family:var(--serif);font-weight:600;font-size:28px;line-height:1.35;margin:10px 0 20px}dialog p{font-size:13px;line-height:1.9;margin:16px 0;color:#565e49}dialog a{font-size:12px}dialog .primary{margin-top:24px;font-size:13px}.poster-image{width:100%;height:auto;display:block}.animal-gallery{display:grid;grid-template-columns:1fr 1fr;gap:22px 14px}.animal-gallery img{width:100%;height:auto;mix-blend-mode:multiply}.animal-gallery h3{font-family:var(--serif);font-size:16px;font-weight:600}.animal-gallery p{font-size:10px;line-height:1.7;margin-top:7px}.paused .orbit,.paused .marquee,.paused.gradient-fallback::before{animation-play-state:paused!important}
@keyframes rotate{to{transform:rotate(360deg)}}@keyframes marquee{to{transform:translateX(-50%)}}@keyframes float{50%{transform:translateY(-5px) rotate(-1deg)}}@keyframes arrive{from{opacity:0}to{opacity:1}}
@media(min-width:800px){.edge-note{display:block}.screen{padding-top:36px;min-height:max(900px,100svh)}.intro .hero{margin-top:42px}.intro .theory-note{margin-top:36px}.intro .entry-actions{margin-top:48px}.intro .ribbons{margin-top:37px}.intro .brand-footer{padding-top:34px}.question-body{padding-top:65px}.question-title{font-size:40px}.options{margin-top:38px}.option{padding-top:25px;padding-bottom:25px}.question-bottom{padding-bottom:16px}}
@media(max-width:360px){.screen{padding-left:22px;padding-right:22px}.hero{padding-left:5px}.hero h1{font-size:53px}.hero-subtitle{margin-top:21px}.outline-title{font-size:80px}.thinker-seal{right:-11px;top:97px;width:100px;height:100px}.orbit span{height:50px;font-size:7px}.thinker-seal img{width:68px;height:68px;top:16px;left:16px}.question-title{font-size:28px}.option-label{font-size:14px}.animal-title{font-size:30px}.result-card{padding-left:17px;padding-right:17px}.result-tagline{font-size:13px}}
@media(max-height:740px) and (max-width:799px){.screen{padding-top:18px}.intro .theory-note{margin-top:16px}.intro .hero{margin-top:24px}.intro .hero h1{font-size:56px}.intro .hero-subtitle{margin-top:18px}.intro .outline-title{font-size:85px}.intro .thinker-seal{top:86px}.intro .ribbons{margin-top:24px}.intro .entry-actions{margin-top:25px}.intro .brand-footer{padding-top:22px}.question-body{padding-top:31px}.question-title{margin-top:21px}.options{margin-top:23px}.option{padding-top:16px;padding-bottom:16px;min-height:65px}.question-bottom{padding-top:24px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Reference study: top annotation + seal, 26% lab label, 40% outlined title,
   48% filled title, crossing tapes near 73%, divided footer near 95%. */
:root{background:#f8f7fa;--muted:#686570}
.paper-grain{opacity:.023}
.gradient-fallback{background:radial-gradient(ellipse 240px 220px at 44% 45%,#618bffbb,transparent 95%),radial-gradient(ellipse 240px 190px at 59% 59%,#ff9bccbb,transparent 95%),#f8f7fa;background-attachment:fixed}
.edge-note{display:none}
.screen.intro{display:block;min-height:740px;height:100svh;max-width:440px;padding:0;overflow:hidden}
.intro .theory-note{position:absolute;top:5.7%;left:8.2%;margin:0;padding:0;font-size:10px;line-height:1.65;color:#64616a;width:65%}
.intro .theory-note button{font-size:9px;padding:4px 0;opacity:.7}
.seal-button{position:absolute;right:6.4%;top:4.5%;width:75px;height:75px;padding:0}
.intro .thinker-seal{position:relative;top:0;right:0;width:75px;height:75px;transform:none}
.intro .thinker-seal img{width:49px;height:49px;left:13px;top:13px;filter:none;mix-blend-mode:multiply}
.intro .orbit span{height:37.5px;font-size:6.5px;width:5px;left:calc(50% - 2.5px);color:#66616c}
.intro .hero{position:absolute;top:26.5%;left:8.2%;margin:0;padding:0;width:83.6%}
.intro .hero-subtitle{font-family:var(--serif);font-weight:500;font-size:25px;line-height:1.2;letter-spacing:-1px;margin:0}
.intro .outline-title{font-family:var(--sans);font-weight:400;font-size:53px;line-height:1.16;letter-spacing:2px;-webkit-text-stroke:.7px #1b191e;margin:61px 0 0 -1px}
.intro .hero h1{font-family:var(--sans);font-weight:400;font-size:56px;line-height:1.28;letter-spacing:0;margin-top:3px}
.intro .ribbons{position:absolute;left:-30px;top:73.1%;margin:0;width:calc(100% + 60px);height:74px;transform:none;display:block}
.intro .ribbon{position:absolute;width:100%;margin:0;padding:3px 0;border-color:#7f7a8266;background:#faf9fbcd;font-size:11px;line-height:1.5;letter-spacing:2px}
.intro .ribbon-one{top:0;transform:rotate(9deg);z-index:2}
.intro .ribbon-two{top:29px;transform:rotate(-6deg)}
.intro .marquee{animation-duration:36s}
.intro .ribbon-two .marquee{animation-duration:44s}
.intro .entry-actions{position:absolute;top:86%;left:8.2%;width:83.6%;margin:0;text-align:center}
.intro .start{width:auto;border:0;border-bottom:1px solid #242029;background:none;border-radius:0;min-height:34px;margin:0 auto;padding:3px 0 7px;display:flex;align-items:center;gap:38px;font-family:var(--serif);font-size:16px;letter-spacing:1px;color:#242029}
.intro .start:hover{color:#624b91;border-color:#624b91}
.intro .start>span{font-family:Arial;font-size:19px}
.intro .entry-caption{font-size:8px;gap:8px;margin-top:10px;line-height:1.2;color:#77717e;align-items:center}
.intro .entry-caption span+span:before{margin-right:8px}
.intro .entry-caption button{font-size:8px;padding:0 0 0 2px;color:inherit;text-decoration:underline;text-underline-offset:2px}
.intro .entry-actions>.text-button{font-size:10px;min-height:20px;padding:5px 0 0}
.intro .brand-footer{position:absolute;left:4%;right:4%;bottom:max(1.3%,env(safe-area-inset-bottom));padding:7px 0 0;margin:0;border-top:1px solid #928e966b;gap:0;grid-template-columns:1fr 1.45fr 1fr;min-height:37px}
.intro .brand-footer>*{min-height:28px;line-height:28px;text-align:center}
.intro .brand-footer>*+*{border-left:1px solid #928e9688}
.intro .brand-footer .gpt-wordmark{justify-content:center;font-size:15px}
.intro .brand-footer .iemerge{font-size:17px}
.intro .brand-footer .year{font-size:18px;font-weight:700;letter-spacing:0}
.intro .brand-footer .dot-grid{display:none}
dialog{background:#f4f1f8}
.axis-dots i.filled{background:#9a8ccb}
@media(min-width:800px){.screen.intro{height:100svh;min-height:800px}.intro .hero{top:26.5%}.intro .hero-subtitle{font-size:26px}.intro .theory-note{margin-top:0}.intro .ribbons{margin-top:0}.intro .entry-actions{margin-top:0}.intro .brand-footer{padding-top:7px}}
@media(max-width:360px){.intro .theory-note{font-size:9px;width:63%}.intro .seal-button{right:5%;width:68px;height:68px}.intro .thinker-seal{width:68px;height:68px}.intro .orbit span{height:34px;font-size:6px}.intro .thinker-seal img{width:44px;height:44px;left:12px;top:12px}.intro .hero-subtitle{font-size:23px}.intro .hero h1{font-size:51px}.intro .outline-title{font-size:49px}}
@media(max-height:740px) and (max-width:799px){.screen.intro{min-height:670px}.intro .hero{margin-top:0;top:25.5%}.intro .theory-note{margin-top:0}.intro .hero-subtitle{font-size:22px;margin-top:0}.intro .outline-title{font-size:46px;margin-top:43px}.intro .hero h1{font-size:48px}.intro .thinker-seal{top:0}.intro .ribbons{margin-top:0;top:72.5%}.intro .entry-actions{margin-top:0;top:85%}.intro .brand-footer{padding-top:7px}}

.result-card{background:rgba(249,247,251,.88)}
:root{--theme-a:#a6c1ee;--theme-b:#fbc2eb;--theme-paper-a:#dce6f8;--theme-paper-b:#fde7f7}
.result-card{background:linear-gradient(155deg,var(--theme-paper-a),#f9f7fb 48%,var(--theme-paper-b))}
.result-tags>span{background:#ffffff55;border-color:#75658666}
.animal-gallery .gallery-animal{padding:10px 8px 15px;background:linear-gradient(155deg,var(--animal-a),#f7f4f9 66%,var(--animal-b));border:1px solid #ffffff88}
.animal-gallery small{display:block;font-size:9px;letter-spacing:1px;margin-top:7px;color:#686271}
.gradient-fallback{background:#f8f7fa}
/* A long, softly bending gradient also works without WebGL. */
:root{--flow-size:min(64vw,281.6px,36vh)}
.gradient-fallback::before{content:'';position:fixed;left:50%;top:var(--flow-anchor,46vh);width:calc(var(--flow-size)*1.4);height:calc(var(--flow-size)*2.1);pointer-events:none;z-index:-1;opacity:.94;border-radius:45% 55% 46% 54%/36% 42% 58% 64%;background:radial-gradient(ellipse at 12% 49%,var(--flow-c),transparent 63%),radial-gradient(ellipse at 76% 85%,var(--flow-b),transparent 68%),var(--flow-a);filter:blur(22px);mask-image:radial-gradient(ellipse,black 39%,transparent 73%);transform:translate(-50%,-50%);animation:fallback-flow 13s ease-in-out infinite alternate}
@keyframes fallback-flow{50%{background-position:16px 22px,-12px -18px,0 0;border-radius:53% 47% 59% 41%/43% 51% 49% 57%;transform:translate(-46%,-52%) rotate(7deg) skew(3deg,-1deg) scale(.94,1.04)}to{background-position:-15px -12px,18px 14px,0 0;border-radius:42% 58% 48% 52%/55% 39% 61% 45%;transform:translate(-54%,-48%) rotate(-6deg) skew(-3deg,1deg) scale(1.04,.96)}}
/* A quieter result: one illustration, one heading, generous readable text. */
#atmosphere{transition:opacity 1.1s ease}
body[data-screen="question"] #atmosphere,body[data-screen="profile"] #atmosphere{opacity:.72}
body[data-screen="result"] #atmosphere{opacity:.42}
body[data-screen="result"].gradient-fallback::before{opacity:.42}
body[data-screen="question"].gradient-fallback::before,body[data-screen="profile"].gradient-fallback::before{opacity:.72}
.result-screen{max-width:460px;padding:26px 30px 26px;animation:none}
.result-screen .topbar{margin-bottom:32px}
.result-card{border:0;background:none;padding:0}
.result-topline{font-size:10px;color:#6e6874;letter-spacing:.7px}
.result-intro{margin-top:34px;font-size:12px;color:#65616b}
.animal-title{font-family:var(--sans);font-size:clamp(23px,6.7vw,31px);font-weight:600;line-height:1.4;letter-spacing:-.5px;margin-top:13px;color:#212026}
.result-tagline{font-family:var(--sans);font-weight:400;font-size:13px;color:#66616c;line-height:1.8;margin-top:12px}
.animal-scene{height:240px;margin:13px 0 12px;isolation:auto}
.animal-scene>img{width:250px;height:250px;animation:none;mix-blend-mode:multiply}
.result-description{font-family:var(--sans);font-size:14px;line-height:1.95;letter-spacing:.15px;color:#38333e;margin-top:0;text-align:justify}
.result-takeaway{margin-top:24px;padding-top:20px;border-top:1px solid #847b902d}
.result-takeaway>span{font-size:10px;letter-spacing:2px;color:#777080}
.result-takeaway p{font-size:14px;line-height:1.8;margin-top:7px;color:#39323f}
.result-more{margin-top:19px;border-top:0}
.result-more>summary{display:flex;align-items:center;justify-content:space-between;min-height:48px;list-style:none;cursor:pointer;font-size:11px;color:#777080}
.result-more>summary>span{display:inline-flex;align-items:center;justify-content:center;flex:0 0 32px;height:44px;font-size:26px;font-weight:400;line-height:1;color:#595160;transition:transform .16s ease}
.result-more>summary::-webkit-details-marker{display:none}
.result-more[open]>summary span{transform:rotate(45deg)}
.result-more .next-thought{font-size:13px;line-height:1.9;color:#595160;margin:15px 0 20px}
.result-more .axis-title{margin-top:16px}
.result-actions{margin-top:19px}
.result-actions .primary{font-size:13px;letter-spacing:1px;min-height:54px;background:#292530;border-color:#292530}
.result-actions .primary:hover{background:#494052}
.result-actions .action-pair button{font-size:11px;color:#645d6b;min-height:48px}
.result-actions .submission-state{font-size:10px;color:#797180;margin-top:11px}
.result-actions .withdraw{color:#797180;font-size:10px;min-height:48px;padding:12px 8px}
.result-disclaimer{font-size:10px;color:#797180;margin-top:13px}
.result-screen .brand-footer{padding-top:25px;margin-top:8px;opacity:.7}
.result-screen .brand-footer .dot-grid{display:none}
@media(max-width:360px){.result-screen{padding-left:25px;padding-right:25px}.animal-scene{height:218px}.animal-scene>img{width:225px;height:225px}.result-description{font-size:13px}.result-intro{margin-top:27px}}

.animal-gallery h3{font-family:var(--sans);font-size:17px;line-height:1.7;letter-spacing:0}
.animal-gallery h3>span{display:block;font-size:11px;font-weight:400;line-height:1.6;white-space:nowrap}
.animal-gallery .gallery-animal{border:0;padding:10px 10px 15px}

/* Warm paper for reading; white for the illustrated result. */
:root{background:var(--paper,#f8f7fa)}
.gradient-fallback{background:transparent}
body[data-screen="question"] #atmosphere,body[data-screen="profile"] #atmosphere{opacity:1}
body[data-screen="result"] #atmosphere{opacity:.20}
body[data-screen="question"].gradient-fallback::before,body[data-screen="profile"].gradient-fallback::before{opacity:1}
body[data-screen="result"].gradient-fallback::before{opacity:.20}
.animal-scene{height:auto;aspect-ratio:1;margin:20px auto 23px;width:min(270px,82%)}
.animal-scene>img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;mix-blend-mode:normal}
.animal-gallery .gallery-animal{background:none;border-bottom:1px solid #8c82921f;padding:8px 3px 18px}
.animal-gallery img{display:block;border-radius:50%;mix-blend-mode:normal;margin-bottom:12px}
.result-screen .brand-footer{display:none}

/* Fit the available viewport; keep touch targets usable on shorter phones. */
.screen{min-height:100svh;padding-top:max(20px,env(safe-area-inset-top))}
.screen.intro{height:100svh;min-height:0}
.intro .hero-subtitle{font-size:clamp(18px,3svh,26px)}
.intro .outline-title{font-size:clamp(37px,6.3svh,55px);margin-top:clamp(24px,7svh,61px)}
.intro .hero h1{font-size:clamp(38px,6.6svh,56px)}
.intro .entry-actions{top:auto;bottom:9.2%}
.intro .brand-footer{bottom:max(8px,env(safe-area-inset-bottom));min-height:32px}
.question-screen{padding-bottom:max(20px,env(safe-area-inset-bottom))}
.question-screen .progress{margin-top:clamp(16px,3svh,28px)}
.question-body{padding-top:clamp(20px,4svh,45px)}
.question-title{font-size:clamp(25px,4.1svh,36px);margin-top:clamp(16px,2.5svh,27px);line-height:1.38}
.question-prompt{margin-top:10px}
.options{margin-top:clamp(16px,3svh,28px)}
.option{min-height:54px;padding:clamp(12px,2svh,20px) 5px}
.option-label{font-size:clamp(13px,1.9svh,15px)}
.question-bottom{padding-top:16px;padding-bottom:0}
.selection-hint{margin:17px 0}
.profile-heading{margin:24px 0}
.profile-heading h1{font-size:clamp(32px,5.3svh,43px)}
.profile-screen .field{margin-bottom:18px}
.result-screen{padding-top:max(22px,env(safe-area-inset-top));padding-bottom:28px;min-height:100svh}
.result-screen .topbar{margin-bottom:25px}
.result-intro{margin-top:25px}
.result-description{font-size:13px;line-height:1.9}
.result-takeaway{margin-top:20px;padding-top:16px}
.result-actions{margin-top:12px}
.result-savebar{width:100%}
@media(max-width:799px){
 .result-screen{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
 .result-savebar{position:fixed;left:0;right:0;bottom:0;z-index:8;padding:12px max(24px,calc((100vw - 400px)/2)) max(12px,env(safe-area-inset-bottom));background:rgba(255,255,255,.96);border-top:1px solid #eeeaf1}
 .result-savebar .primary{min-height:50px}
}
@media(max-height:650px){
 .intro .theory-note{top:5%;font-size:8px}
 .intro .seal-button{transform:scale(.8);transform-origin:top right}
 .intro .ribbons{top:71%;height:55px}
 .intro .ribbon{font-size:9px;padding:2px 0}
 .intro .ribbon-two{top:22px}
 .intro .entry-actions{bottom:10%}
 .intro .entry-caption{margin-top:6px;font-size:7px}
 .intro .entry-caption button{font-size:7px}
 .intro .start{font-size:14px;min-height:28px;padding-bottom:4px}
 .intro .brand-footer>*{min-height:24px;line-height:24px}
 .question-body{padding-top:17px}
 .question-bottom{display:none}
 .question-title{font-size:25px;margin-top:15px}
 .question-prompt{font-size:11px}
 .option{min-height:51px;padding:10px 5px}
 .selection-hint{margin:12px 0}
}
.result-screen{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
.result-savebar{position:fixed;left:50%;right:auto;bottom:0;transform:translateX(-50%);z-index:8;width:min(460px,100%);padding:12px clamp(24px,7.7vw,30px) max(12px,env(safe-area-inset-bottom));background:rgba(255,255,255,.96);border-top:1px solid #eeeaf1}
.result-savebar .primary{min-height:50px}

/* Quiet typography, generous and non-overlapping touch targets. */
button,summary,a,input,select{touch-action:manipulation}
.topbar{min-height:48px;align-items:center;gap:16px}
.text-button{min-height:48px;min-width:48px;padding:12px 8px}
.back{min-width:76px;padding:8px 12px 8px 0}
.motion-toggle{min-height:48px;min-width:96px;padding:10px 0 10px 12px}
.intro .theory-note button{min-height:44px;min-width:108px;padding:8px 0;text-align:left;font-size:10px;opacity:1}
.intro .entry-actions{bottom:max(52px,calc(env(safe-area-inset-bottom) + 44px))}
.entry-primary{display:flex;align-items:center;justify-content:center;gap:16px}
.intro .start{min-height:48px;width:100%;padding:11px 18px;gap:24px;background:#292530;color:#f8f7fa;border:1px solid #292530;justify-content:space-between;font-family:var(--sans);font-size:15px}
.intro .start:hover{background:#494052;color:#fff;border-color:#494052}
.intro .start>span{font-size:24px;line-height:1}
.intro .fresh-start{min-height:44px;min-width:64px;padding:8px 4px;font-size:11px;white-space:nowrap}
.entry-primary:has(.fresh-start) .start{margin:0;flex:1;justify-content:space-between;gap:8px}
.intro .entry-caption{min-height:44px;margin-top:0;gap:7px;font-size:9px;white-space:nowrap}
.intro .entry-caption span+span:before{margin-right:7px}
.intro .entry-caption button{min-height:44px;min-width:44px;padding:8px 4px;font-size:9px}
.consent{min-height:48px;padding:10px 0;gap:12px}
.consent input{width:20px;height:20px;min-width:20px;margin:1px 0 0}
.privacy-link{display:block;min-height:44px;padding:10px 8px 10px 32px;text-align:left}
.submission-notice{font-size:12px;line-height:1.8;margin-top:10px;color:#56564f}
.submission-notice+.privacy-link{padding-left:0}
.local-result{width:100%;min-height:48px}
.skip{min-height:48px;padding:12px 16px}
.result-more>summary{min-height:48px;padding:8px 0}
.action-pair{gap:16px}
.action-pair .text-button{flex:1;min-height:48px;padding:12px 4px}
.action-pair .text-button:first-child{text-align:left}
.action-pair .text-button:last-child{text-align:right}
.withdraw{min-height:48px;min-width:128px;padding:12px 8px}
.result-disclaimer{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0 8px}
.result-disclaimer button{min-height:44px;min-width:80px;padding:10px 4px}
dialog{padding:0;overflow:hidden;max-height:88svh}
dialog[open]{display:flex;flex-direction:column}
.modal-toolbar{display:flex;justify-content:flex-end;flex:none;padding:4px 8px 0}
.modal-close{position:static;width:48px;height:48px;flex:none;display:grid;place-items:center;font-size:28px;line-height:1}
#modal-content,#detail-body{overflow-y:auto;min-height:0;padding:0 28px 28px;overscroll-behavior:contain;scrollbar-width:thin}
dialog:focus,#modal-content:focus{outline:none}
#modal-content a:not(.primary){display:inline-flex;align-items:center;min-height:44px;padding:8px 0}
button:active,summary:active{opacity:.7}
@media(max-height:800px){
 .intro .ribbons{top:67%;height:48px}
 .intro .ribbon-one{transform:rotate(6deg)}
 .intro .ribbon-two{top:20px;transform:rotate(-4deg)}
}

/* Refined opening: preserve the words, give the sentence a natural line break. */
body[data-screen="intro"] #atmosphere,body[data-screen="intro"].gradient-fallback::before{opacity:1}
.paper-grain{opacity:.042}
body[data-screen="result"] .paper-grain{opacity:.018}
.intro .hero{top:27%;left:8.2%;width:83.6%}
.intro .hero-subtitle{font-family:var(--sans);font-size:12px;line-height:1.5;font-weight:500;letter-spacing:2px;color:#56515c}
.intro .outline-title{font-size:clamp(46px,7.8svh,66px);line-height:1.12;font-weight:400;letter-spacing:3px;margin-top:clamp(17px,3svh,26px);-webkit-text-stroke:.65px #6a6272}
.intro .hero h1{font-size:clamp(34px,5.7svh,48px);line-height:1.38;letter-spacing:-.025em;font-weight:400;margin-top:clamp(17px,3svh,26px)}
.intro .start{width:min(220px,100%);min-height:48px;margin:auto;font-size:14px;padding:11px 18px}
.entry-primary:has(.fresh-start) .start{width:auto}
.openai-mark{display:block;width:24px;height:24px;object-fit:contain}
.intro .gpt-wordmark{display:flex;align-items:center;justify-content:center}
.topbar-tools{display:flex;align-items:center;gap:8px}
.music-toggle{display:grid;place-items:center;flex:none;width:48px;min-width:48px;min-height:48px;padding:12px;color:#5b5463}
.music-toggle svg{width:20px;height:20px;display:block}
.music-toggle[aria-pressed="true"]{color:var(--ink)}
.note-actions{display:flex;align-items:center;gap:8px}
.intro .theory-note .music-toggle{min-width:44px;width:44px;min-height:44px;padding:12px}
.intro .theory-note .music-toggle svg{width:17px;height:17px}
.intro .entry-caption{min-height:18px;margin-top:10px}
.site-filing{position:relative;z-index:1;text-align:center;background:#f7f7f9}
.site-filing a{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;font-size:10px;color:#77737d;text-decoration:none;letter-spacing:.3px}
.site-filing a:hover{text-decoration:underline;text-underline-offset:3px}
body:not([data-screen="intro"]) .site-filing{display:none}
@media(max-height:540px) and (max-width:799px){
 .intro .hero{top:20%}
 .intro .hero-subtitle{font-size:11px}
 .intro .outline-title{font-size:38px;margin-top:12px}
 .intro .hero h1{font-size:30px;line-height:1.33;margin-top:10px}
 .intro .ribbons{top:58%}
}

.photo-field{margin:3px 0 25px}.field-label{font-size:12px;margin-bottom:12px}.photo-picker{position:relative;display:flex;gap:16px;align-items:center;min-height:104px;padding:16px;border:1px dashed #a6a599;cursor:pointer;background:#ffffff26}.photo-picker:focus-within{outline:none}body.keyboard-navigation .photo-picker:focus-within{background-color:#e9e4ef}.photo-picker input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.photo-picker strong{font-size:14px;font-weight:500;display:block}.photo-picker small{display:block;margin-top:7px;font-size:10px;color:var(--muted);line-height:1.8}.photo-plus{font-size:30px;font-weight:300;width:48px;text-align:center;color:#6b6b60}.photo-picker img{width:64px;height:80px;object-fit:cover}.photo-hint{font-size:11px;line-height:1.85;margin-top:12px;color:var(--muted)}.photo-status{font-size:11px;line-height:1.7;color:var(--muted);margin-top:6px}.remove-photo{display:block;margin:4px 0 0 auto;min-width:80px;text-decoration:underline;text-underline-offset:4px}