:root{--ivory:#fffaf1;--ink:#38291f;--orange:#e9651d;--copper:#c74f15;--line:#edc7aa;--peach:#ffcda8;--green:var(--orange)}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#f0e9dc;color:var(--ink);font-family:Georgia,'Times New Roman',serif}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.55}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #7258b4;outline-offset:3px}a{color:var(--copper)}
.game{max-width:680px;margin:18px auto;padding:12px 18px 16px;background:radial-gradient(ellipse at 50% 0,#fffefb,var(--ivory) 75%);border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 60px #56331b10;position:relative}
header{display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{width:min(78%,400px);aspect-ratio:2.12;display:flex;align-items:center;justify-content:center}.brand img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}.icon-button{border:1px solid var(--orange);border-radius:50%;background:transparent;color:var(--copper);width:44px;height:44px;font-size:24px;flex-shrink:0}
.lab-detail{position:relative;display:flex;align-items:center;justify-content:center;height:32px;margin-top:-12px;margin-bottom:12px;color:var(--copper)}.lab-detail svg{position:absolute;inset:0;width:100%;height:100%;opacity:.3}.lab-detail span{font:8px system-ui;letter-spacing:1.2px;background:var(--ivory);padding:4px;z-index:1}
.dashboard{display:grid;grid-template-columns:30% 1fr;gap:16px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px}.portrait{min-width:0}.hair{width:100%;aspect-ratio:.5;background-size:500% 100%;background-position:0 0;mix-blend-mode:multiply;mask-image:linear-gradient(#000 94%,transparent)}.character-name{display:block;text-align:center;font-size:10px;color:#80614e;margin-top:3px}.eyebrow{font:8px/1.5 system-ui;letter-spacing:1.4px;color:var(--copper);margin-bottom:9px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.stats>div{border:1px solid var(--line);border-radius:9px;text-align:center;padding:9px 2px}.stats span{display:block;font:9px system-ui;letter-spacing:.5px}.stats strong{display:block;font-size:27px;font-weight:400;font-variant-numeric:tabular-nums}.progress-title{display:flex;align-items:center;justify-content:space-between;font-size:10px;margin-top:18px}.progress-title strong{font-size:32px;color:var(--orange)}.track{height:5px;background:#ded4c7;border-radius:9px;margin:8px 0}.track>div{height:100%;background:var(--orange);border-radius:9px;transition:width .5s}.milestones{display:flex;justify-content:space-between;font-size:10px}.ritual-note{font:11px/1.4 system-ui;color:#857462;margin:12px 0 0}.status-row{display:flex;align-items:center;justify-content:space-between;gap:8px;font:10px system-ui;color:#796856;margin:10px 0}.pill{border:1px solid var(--line);border-radius:20px;padding:5px 8px;font-size:9px}
.live-timer{position:sticky;top:4px;z-index:30;background:#fffaf1f5;backdrop-filter:blur(8px);border:1px solid var(--orange);border-radius:10px;padding:8px 12px;margin:10px 0;box-shadow:0 3px 10px #6433160c}.live-timer>div{display:flex;align-items:center;justify-content:space-between;gap:10px}.level-live{font:600 11px system-ui}.live-timer span{font:9px system-ui;letter-spacing:.7px}.live-timer strong{font-size:32px;color:var(--orange);line-height:1;font-variant-numeric:tabular-nums}.live-timer p{margin:5px 0 0;text-align:center;font:10px/1.3 system-ui;color:#806b59}.live-timer.overtime strong{font-size:26px;color:#967455}.urgent{color:#a22a23!important}
.selection-note{text-align:center;font:10px/1.4 system-ui;margin:8px 0;color:#756152}.suggestion{display:flex;gap:10px;align-items:center;padding:8px 12px;border:1px solid var(--line);border-radius:10px;margin:9px 0 18px;background:#fffdf8}.suggestion strong{font:15px Georgia}.suggestion small{display:block;font:10px/1.5 system-ui;color:#806c5c;margin-top:2px}.hint-swatch{display:block;width:35px;height:35px;border-radius:50%;overflow:hidden;flex-shrink:0}.hint-swatch .layer{height:100%;min-height:100%;border-radius:0;border:0}.hint-swatch .ingredient-mark{width:25px;height:27px}.hint-swatch svg{width:23px;height:25px}
.board{display:grid;grid-template-columns:1fr 18% 1fr;gap:10px;position:relative}.rack{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 10px}.tube{height:125px;min-width:0;padding:0 3px 4px;position:relative;border:1.3px solid #b8aca0;border-radius:7px 7px 23px 23px;background:linear-gradient(90deg,#d4d8d520,#fffdf9 15%,#ffffff40 62%,#aab8af20);box-shadow:inset 2px 0 2px white,inset -2px 0 4px #dbd7cf,0 5px 8px #48352a0b;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate}.tube:before,.receiver:before{content:'';position:absolute;z-index:3;left:-2px;right:-2px;top:-4px;height:8px;border:1px solid #aaa095;border-radius:50%;background:linear-gradient(#fff,#ded8cd,#fff)}.tube:after{content:'';position:absolute;left:9%;top:8px;bottom:14px;width:5%;background:linear-gradient(#ffffffcc,#ffffff20);pointer-events:none;border-radius:8px}.tube:disabled,.receiver:disabled{opacity:1}.tube.pour-source{visibility:hidden}.tube.selected,.tube.available,.receiver.available{outline:none;filter:none}.layer{height:18px;min-height:18px;display:flex;align-items:center;justify-content:center;color:var(--liquid-ink);border-top:1px solid #ffffffb0;background:linear-gradient(90deg,#ffffff55,transparent 33%,#00000009 76%,#ffffff40),var(--color);box-shadow:inset 0 2px 2px #ffffff40;overflow:hidden}.layer:first-child{border-radius:50% 50% 0 0 / 3px 3px 0 0}.layer:last-child{border-radius:0 0 18px 18px}.ingredient-mark{display:flex;justify-content:center;align-items:center;width:20px;height:18px;color:var(--liquid-ink)}.layer svg{width:17px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 0 #ffffff77)}
.center{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.center-caption{font:9px/1.5 system-ui;letter-spacing:1px;text-align:center;margin-bottom:12px}.center-caption strong{display:block;font:24px Georgia;margin-top:4px;letter-spacing:0}.receiver{width:90%;height:310px;padding:0;position:relative;border:1.5px solid #a79f92;border-radius:8px 8px 45px 45px;background:linear-gradient(90deg,#c7d1c620,#fffffff0 15%,#ffffff30 50%,#bbc5b61a 90%,#fff);box-shadow:inset 3px 0 3px white,0 7px 12px #5b3b2310;isolation:isolate}.mix{position:absolute;top:8px;bottom:5px;left:4px;right:4px;border-radius:0 0 38px 38px;overflow:hidden;display:flex;flex-direction:column-reverse;justify-content:flex-start;pointer-events:none}.mix .layer{height:10%;min-height:0;flex:0 0 10%;border:0;border-radius:0;box-shadow:none}.mix .ingredient-mark{opacity:0}.graduations{position:absolute;right:5px;top:10px;bottom:8px;width:9px;background:repeating-linear-gradient(to top,transparent 0,transparent calc(10% - 1px),#76695766 calc(10% - 1px),#76695766 10%);z-index:3;pointer-events:none}.receiver.full .layer{background:var(--peach);transition:background .25s}.cream-effect{pointer-events:none;opacity:0;position:absolute;top:35%;width:38px;height:90px;z-index:8;filter:drop-shadow(0 0 6px #f5c3a1)}.cream-effect svg{width:100%;height:100%;fill:none;stroke:#f5b892;stroke-width:7;stroke-linecap:round}.cream-effect .rungs{stroke-width:3}.cream-effect.play{animation:peach-rise .6s ease-out}@keyframes peach-rise{0%{opacity:0;transform:translateY(90px) scale(.4)}40%{opacity:1}100%{opacity:0;transform:translateY(-100px) scale(1.2)}}
.tube.pour-ghost{position:fixed!important;transform-origin:50% 5px!important;opacity:1!important;filter:none!important;outline:none!important;visibility:visible!important;transition:none!important;z-index:1000;pointer-events:none;margin:0!important}.pour-stream{position:fixed;width:6px;border-radius:4px;z-index:1001;pointer-events:none;transform-origin:50% 0;background:linear-gradient(90deg,var(--stream-color),#ffffffb0 48%,var(--stream-color))}
.message{min-height:38px;text-align:center;display:flex;align-items:center;justify-content:center;font:11px/1.4 system-ui;color:#7c6554;margin:12px 0}footer{border-top:1px solid var(--line);padding-top:12px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.personal-best{margin-right:auto}.personal-best span{display:block;font:8px system-ui;letter-spacing:1px}.personal-best b{font-size:24px;font-weight:400}.primary,.secondary{border-radius:8px;padding:12px 15px;min-height:44px;font:14px/1.4 Georgia;border:1px solid var(--orange);text-decoration:none;display:inline-block;text-align:center}.primary{background:var(--orange);color:white}.secondary{background:transparent;color:var(--ink)}.text-button{background:none;border:0;color:var(--copper);padding:10px;font:12px system-ui}.bottom-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:8px}.bottom-nav button{font:11px system-ui;background:none;border:0;padding:12px 8px;min-height:44px;color:var(--copper)}.footnote{text-align:center;font:9px/1.4 system-ui;color:#897666;margin:5px 0 0}
dialog{border:1px solid var(--line);border-radius:16px;background:var(--ivory);color:var(--ink);padding:18px;width:min(94vw,540px);max-height:92dvh;overflow-y:auto;box-shadow:0 20px 100px #0003}dialog::backdrop{background:#35261977;backdrop-filter:blur(3px)}.modal-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:5px;gap:16px}.modal-logo{width:180px;max-width:75%;mix-blend-mode:multiply}.modal-top button{border:0;background:none;font-size:28px;width:44px;height:44px;color:var(--copper)}dialog h2{font-size:27px;line-height:1.2;font-weight:400;margin:16px 0 10px}dialog p,dialog li{font:13px/1.6 system-ui}dialog li{margin-bottom:8px}dialog .actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.actions>button{flex:1}.result-hero{display:grid;grid-template-columns:45% 1fr;gap:12px;align-items:center;margin-top:12px}.result-hair{width:100%;aspect-ratio:.5;background-size:500% 100%;mix-blend-mode:multiply;mask-image:linear-gradient(#000 94%,transparent)}.result-hero small{font:10px system-ui;color:var(--copper)}.result-hero p{font:italic 15px Georgia}.result-hero span{font:10px system-ui}.result-number{font-size:52px;line-height:1.1;color:var(--orange);font-variant-numeric:tabular-nums;margin-top:8px;overflow-wrap:anywhere}.result-lines{border-block:1px solid var(--line);padding:6px 0}.result-lines p{display:flex;justify-content:space-between;margin:5px 0}.result-note,.muted{color:#806e60}.failure,.demo-note{background:#f9e8dc;border-radius:7px;padding:10px;color:#833e24}.auth-card{border:1px solid var(--orange);border-radius:12px;padding:16px;margin:16px 0}.auth-card h2{font-size:24px;margin-top:0}.auth-card .primary{width:100%}dialog label{font:13px/1.5 system-ui}dialog input:not([type=checkbox]){width:100%;display:block;border:1px solid #baafa4;border-radius:8px;padding:12px;background:#fffefa;color:var(--ink);font:16px system-ui;margin:5px 0 14px;min-width:0}.consent{display:flex;gap:10px;align-items:flex-start;margin:14px 0 0}.consent input{width:22px;height:22px;accent-color:var(--orange);flex-shrink:0;margin:0}.error{color:#a03424}.otp-boxes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.otp-boxes input.otp-digit{text-align:center;padding:12px 0;font:26px Georgia;border-color:var(--orange);height:54px}.reward-card{border:1px solid var(--line);border-radius:9px;padding:13px;margin:10px 0}.reward-card small{color:var(--copper)}.reward-card h3{font-size:19px;margin:6px 0}.reward-card img,.end-promo img{display:block;max-width:100%;max-height:240px;object-fit:contain;margin:auto}.prize-details summary{font:13px/1.5 system-ui;color:var(--copper);padding:14px 0;cursor:pointer}.end-promo{background:#f8eddf;border:1px solid var(--line);border-radius:12px;padding:16px;text-align:center;margin:16px 0}.end-promo h3{font:24px Georgia;margin:10px 0}.end-promo a,.end-promo button{margin:4px}.voucher-code{font:20px monospace;overflow-wrap:anywhere}.character-carousel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 5px 16px;margin:0 -5px 10px}.character-card{scroll-snap-align:center;flex:0 0 82%;border:1px solid var(--line);border-radius:13px;background:var(--ivory);padding:8px}.character-card.chosen{border:2px solid var(--orange)}.choice-hair{display:block;width:100%;aspect-ratio:.6;background-size:500% 100%;background-position:100% 0;mix-blend-mode:multiply;max-height:52dvh}.character-card strong{display:block;font:23px Georgia;margin:8px 0}.character-card small{display:block;font:11px system-ui;color:#806856;margin-bottom:6px}#choose-model{width:100%}table{width:100%;border-collapse:collapse;font:13px system-ui}td,th{padding:10px 6px;border-bottom:1px solid var(--line);text-align:left}
@media(max-width:600px){.game{margin:0;border:0;border-radius:0;padding:8px 10px 14px;max-width:480px;min-height:100dvh}header{gap:7px}.brand{width:77%;max-height:115px}.icon-button{width:36px;height:36px;font-size:21px}.lab-detail{margin-top:-7px;height:25px}.lab-detail span{font-size:6px;letter-spacing:.7px}.dashboard{gap:10px;grid-template-columns:29% 1fr;padding:7px}.eyebrow{font-size:6px;letter-spacing:.8px}.stats>div{padding:7px 1px}.stats span{font-size:7px}.stats strong{font-size:21px}.progress-title{font-size:8px;margin-top:10px}.progress-title strong{font-size:25px}.milestones{font-size:8px}.ritual-note{font-size:9px;margin-top:8px}.character-name{font-size:8px}.suggestion strong{font-size:12px}.suggestion small{font-size:9px}.board{grid-template-columns:1fr 17% 1fr;gap:8px}.rack{gap:15px 6px}.tube{height:102px;padding:0 2px 4px}.layer{height:15px;min-height:15px}.layer svg{width:13px;height:14px}.ingredient-mark{width:16px;height:14px}.receiver{height:252px;width:92%}.center-caption{font-size:7px;letter-spacing:0}.center-caption strong{font-size:19px}.hint-swatch{width:32px;height:32px}.hint-swatch svg{width:23px;height:25px}.status-row{font-size:9px}.message{font-size:10px}.primary,.secondary{font-size:13px;padding:11px}.result-hero h2{font-size:24px}.result-number{font-size:43px}.auth-card{padding:12px}.auth-card h2{font-size:23px}}
@media(max-width:360px){.game{padding-inline:7px}.board{gap:5px;grid-template-columns:1fr 15% 1fr}.rack{column-gap:5px}.stats strong{font-size:19px}.tube{height:99px}.result-number{font-size:36px}.result-hero{gap:8px}.result-hero h2{font-size:21px}.otp-boxes{gap:4px}.otp-boxes input.otp-digit{height:48px;font-size:22px}}
.embedded .game{margin:0 auto;min-height:0}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.pour-ghost,.pour-stream{display:none}}

/* UI v1.1.0-profesi: rose-gold accents, source-only selection and visible verification. */
:root{--rose-gold:#a46252;--rose-light:#edd1c4}
.ingredient-mark{color:var(--rose-gold);background:linear-gradient(140deg,#fffaf1,#f4ddd0);border:1px solid #b9826a66;border-radius:50%;box-shadow:inset 0 1px 1px #fff;flex-shrink:0}
.layer svg{width:80%;height:90%;stroke-width:1.8;filter:none}
.tube.selected{outline:2px solid var(--orange);outline-offset:3px;box-shadow:0 0 0 6px #d49b852b,inset 2px 0 2px white,inset -2px 0 4px #dbd7cf}
.tube.selected:before{border-color:var(--rose-gold);background:linear-gradient(#fff7ed,#d8a68e,#fff7ed)}
.auth-card{border-color:#d8b3a1;background:linear-gradient(145deg,#fffdf8,#fff7ed);box-shadow:0 5px 20px #79513c08}
.auth-eyebrow{display:block;font:9px/1.5 system-ui;letter-spacing:1.4px;color:#945d49;margin-bottom:12px}
.auth-card .auth-intro{font-size:14px;line-height:1.65;margin-bottom:18px}
.auth-step{display:flex;align-items:center;gap:9px;font-weight:600!important;color:#714738;margin:18px 0 12px}
.auth-step span{display:grid;place-items:center;width:26px;height:26px;border:1px solid #d1a492;border-radius:50%;background:#f8e9de;font:15px Georgia}
.field-note{display:block;font:11px/1.5 system-ui;color:#806e60;margin:-8px 0 14px}
.auth-card .consent-note{font-size:11px;margin-top:6px}.auth-card .demo-note{font-size:11px;padding:8px 10px}
.otp-section{margin-top:20px;padding-top:4px;border-top:1px solid #dec0ad}.otp-recipient{overflow-wrap:anywhere}
.otp-boxes input.otp-digit{border-color:#be8a76;background:linear-gradient(#fffdfa,#fcf0e7);color:#714738;box-shadow:inset 0 1px 2px #6c3d2910}
.otp-boxes input:disabled{opacity:1;background:#f5ede4;border-color:#d5bbaa;color:#a18470}.otp-boxes input::placeholder{color:#b49b87}
.auth-card input::placeholder{font-size:12px}.text-button{border:0;background:transparent;text-decoration:underline;color:#945d49;font:12px/1.6 system-ui;padding:10px 0;min-height:40px}.otp-recipient .text-button{margin-left:6px}

/* Profesi edition: approved ivory/orange artwork, uncropped hair and live labels. */
:root{--ivory:#faf5eb;--orange:#d75115;--copper:#ac4115;--ink:#342a25;--line:#e7c9b3}
body{background:#efe8dd}
.game{border-radius:4px;border-color:#d7511566;max-width:760px;padding:20px 26px;background:radial-gradient(ellipse at top,#fffdfa,#faf5eb 72%)}
.brand{aspect-ratio:3.7;width:min(78%,420px)}
header{margin-bottom:14px}.lab-detail{margin-top:0;margin-bottom:18px;opacity:.8}
.dashboard{grid-template-columns:38% 1fr;padding:14px 18px;gap:22px;border-radius:3px;background:#ffffff30}
.hair{aspect-ratio:.625;background-size:500% 125%;background-position:0 0;mask-image:none;mix-blend-mode:multiply}
.character-name{font-size:20px;letter-spacing:1px;color:var(--ink);margin-top:5px}
.character-profession{display:block;text-align:center;font:600 10px/1.5 system-ui;letter-spacing:.6px;color:var(--copper);margin-top:4px}
.hair-condition{display:block;text-align:center;font:10px/1.5 system-ui;color:#806b58;margin:6px 0}
.milestones .reached{color:var(--orange);font-weight:bold}.stats>div,.suggestion,.live-timer{border-radius:5px}
.stats strong{font-size:31px}.ritual-note{line-height:1.6}.progress-title{margin-top:22px}
.choice-hair{aspect-ratio:.625;background-size:500% 125%;max-height:none}
.gallery-profession{display:block;font:600 12px/1.5 system-ui;color:var(--orange);margin:8px 0}
.character-carousel{gap:16px}.character-card{flex-basis:70%;border-radius:5px;padding:12px}
.character-card small{line-height:1.6}.ingredient-mark{background:#fffaf1cc;border-color:#ffffffb0;color:var(--liquid-ink);box-shadow:none}
.tube{border-color:#b9aa9b}.tube.selected{outline-color:var(--orange)}
.primary{background:var(--orange);border-color:var(--orange)}
#hair.changed{animation:hair-reveal .6s ease-out}
@keyframes hair-reveal{from{opacity:.45;filter:brightness(1.1)}to{opacity:1;filter:none}}
@media(max-width:600px){
 .game{max-width:480px;padding:12px 12px 18px;border:none;border-radius:0}
 header{margin-bottom:10px}.brand{aspect-ratio:3.3;max-height:95px}
 .lab-detail{margin:0 0 10px;height:25px}.dashboard{grid-template-columns:38% 1fr;padding:8px;gap:11px}
 .character-name{font-size:16px}.character-profession{font-size:8px;letter-spacing:.2px}.hair-condition{font-size:8px}
 .stats{gap:4px}.stats>div{padding:8px 1px}.stats strong{font-size:21px}.progress-title{font-size:8px;margin-top:14px}.progress-title strong{font-size:27px}.ritual-note{font-size:9px}
 .board{gap:9px;grid-template-columns:1fr 17% 1fr}.rack{gap:18px 8px}.tube{height:105px}.receiver{height:268px}
 .live-timer{padding:9px 10px}.live-timer strong{font-size:28px}.suggestion{margin-bottom:20px}
 .character-card{flex-basis:78%}
}
@media(max-width:360px){.game{padding-inline:8px}.board{gap:6px}.rack{column-gap:6px}.character-profession{font-size:7px}.stats strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){#hair.changed{animation:none}}

.result-hair{aspect-ratio:.625;background-size:500% 125%;mask-image:none}

.cooldown-notice,.result-cooldown{font:12px/1.6 system-ui;color:#a3441c;background:#f7e9d9;padding:12px;border:1px solid #e4c2a5;border-radius:6px;text-align:center}.cooldown-notice[hidden]{display:none}#again:disabled{opacity:.65;cursor:wait}

/* v1.2: ivory paper, orange notebook ornament and clear character confirmation. */
header{position:relative;margin-bottom:4px}
.pause-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:52px;height:56px;border-radius:26px}
.pause-button>span{font-size:21px;line-height:1}.pause-button small{font:10px/1.2 system-ui;letter-spacing:.25px}
.lab-detail{height:180px;margin:0;opacity:1;overflow:hidden;border-block:1px solid #d7511528;isolation:isolate}
.lab-sketch{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply;opacity:.78;z-index:-1;pointer-events:none}
.lab-signature{display:flex;flex-direction:column;align-items:center;gap:10px;max-width:52%;text-align:center;background:none}
.lab-detail .lab-kicker{font:500 9px/1.4 system-ui;letter-spacing:1.65px;color:var(--copper);padding:0;background:none}
.lab-detail .lab-handwriting{font:italic 29px/1.2 'Snell Roundhand','Apple Chancery','URW Chancery L',Georgia,serif;letter-spacing:0;color:var(--orange);padding:0;background:none}
.lab-detail .lab-rule{font:14px/1 Georgia;background:none;padding:0;color:var(--orange)}
.formula-strip{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;text-align:center;gap:12px;padding:18px 8px 20px;margin-bottom:4px;color:var(--copper)}
.formula-strip small{display:block;font:500 9px/1.5 system-ui;letter-spacing:1.8px}.formula-strip strong{display:block;font:400 23px/1.25 Georgia;margin-top:3px}.formula-strip i{font:10px Georgia;color:#d7511570}
.dashboard{border-color:#d7511540;background:linear-gradient(125deg,#fffdf8aa,#faf5eb44)}
.character-name{color:var(--copper);font-weight:400;letter-spacing:.4px}.character-profession{color:var(--orange);font-weight:500}
.eyebrow{color:var(--copper);letter-spacing:1.6px;font-size:9px}.stats span,.progress-title{color:var(--copper)}
.stats strong{color:var(--copper)}.stats>div{border:0;border-bottom:1px solid #d7511555;border-radius:0;background:#fffdf766}
.suggestion{padding:12px 16px;border:1px solid #d7511545;border-left:3px solid var(--orange);background:#fffdf8;gap:13px;align-items:center}
.suggestion strong{font:400 19px/1.25 Georgia;color:var(--copper)}.suggestion .hint-eyebrow{font:500 9px/1.4 system-ui;letter-spacing:1.4px;text-transform:uppercase;color:var(--copper);margin:0 0 4px}
.suggestion small{font-size:11px;line-height:1.5;margin-top:5px}.hint-swatch{width:42px;height:42px;border:1px solid #e7c9b3;box-shadow:0 2px 8px #c74f1510}
.character-carousel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;overflow:visible;scroll-snap-type:none;margin:0;padding:8px 0 16px}
.character-card{min-width:0;text-align:center;border:1px solid #e7c9b3;padding:10px;position:relative}.character-card.chosen{border:2px solid var(--orange);background:#fff4e6;box-shadow:0 0 0 3px #d7511510}
.character-card strong{font:22px/1.2 Georgia;color:var(--copper);margin:9px 0 5px}.character-card small{font-size:10px;margin:5px 0 10px}.gallery-profession{font-size:11px;margin:0}
.character-pick{display:block;border:1px solid var(--orange);padding:9px 3px;border-radius:3px;font:500 11px/1.3 system-ui;color:var(--copper)}
.character-card.chosen .character-pick{background:var(--orange);color:#fffaf1}.character-card.chosen .character-pick:before{content:'✓ ';font-size:12px}
#choose-model{position:sticky;bottom:0;box-shadow:0 -5px 14px #faf5eb;margin-top:5px;min-height:48px}
@media(max-width:600px){
 header{gap:8px}.brand{width:calc(100% - 102px);aspect-ratio:3.4}.pause-button{width:46px;height:50px}.pause-button small{font-size:9px}
 .lab-detail{height:112px;margin:2px 0 0}.lab-signature{gap:7px;max-width:55%}.lab-detail .lab-kicker{font-size:7px;letter-spacing:.8px}.lab-detail .lab-handwriting{font-size:22px}.lab-detail .lab-rule{font-size:11px}
 .formula-strip{gap:7px;padding:15px 2px 17px}.formula-strip small{font-size:8px;letter-spacing:1px}.formula-strip strong{font-size:20px}
 .eyebrow{font-size:7px;letter-spacing:1px}.suggestion{padding:11px;gap:10px}.suggestion strong{font-size:17px}.suggestion small{font-size:10px}.suggestion .hint-eyebrow{font-size:8px}
 .character-name{font-size:17px}.character-profession{font-size:9px}.character-card strong{font-size:21px}
}
@media(max-width:360px){.lab-detail .lab-handwriting{font-size:19px}.formula-strip strong{font-size:18px}.character-card{padding:7px}.character-card strong{font-size:19px}}

/* Approved full composition: preserve every sketch and the two original taglines. */
.art-header{display:block;margin:0 0 18px;position:relative}
.header-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:12px}
.brand.brand-art{display:block;width:100%;height:auto;max-height:none;aspect-ratio:auto}
.brand.brand-art img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;mix-blend-mode:multiply}
.auth-card .auth-intro{font-size:13px;line-height:1.55;margin:8px 0 16px}
.auth-card h2{font-size:25px;line-height:1.25}.auth-eyebrow{margin-bottom:8px}
@media(max-width:600px){.art-header{margin-bottom:12px}.header-controls{margin-bottom:4px}.auth-card h2{font-size:23px}}

/* v1.4: controls overlay the approved artwork; portrait phone play area uses one viewport. */
.art-header .header-controls{position:absolute;inset:8px 8px auto;z-index:2;margin:0;pointer-events:none}
.header-controls button{pointer-events:auto;background:#faf5ebed;box-shadow:0 2px 8px #ac411510}
.phone-menu{display:none}
@media(max-width:600px){
 .game{--phone-head:clamp(88px,16dvh,144px);--phone-dash:clamp(88px,14dvh,112px);width:100%;max-width:none;height:100dvh;min-height:600px;margin:0;padding:6px 8px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:var(--phone-head) var(--phone-dash) 36px minmax(248px,1fr) 28px 44px;gap:6px;align-content:stretch;border:0}
 .art-header{grid-row:1;margin:0;min-height:0;height:var(--phone-head)}
 .brand.brand-art{height:100%;width:100%}.brand.brand-art img{height:100%;width:100%;object-fit:contain}
 .art-header .header-controls{inset:4px auto auto 50%;transform:translateX(-50%);width:min(100%,calc(var(--phone-head) * 2));padding:0 4px}
 .header-controls .icon-button{width:44px;height:44px;min-height:44px;font-size:19px}.header-controls .pause-button{gap:0}.pause-button small{font-size:10px}
 .dashboard{grid-row:2;grid-template-columns:94px minmax(0,1fr);gap:10px;padding:5px 8px;height:100%;min-height:0;align-items:center}
 .portrait{display:grid;grid-template-columns:48px minmax(0,1fr);grid-template-rows:1fr 1fr;column-gap:5px;align-items:end;height:100%;min-height:0}
 .hair{grid-column:1;grid-row:1/3;width:48px;height:76.8px;aspect-ratio:auto;align-self:center}
 .character-name{grid-column:2;grid-row:1;font-size:12px;line-height:1.25;letter-spacing:0;overflow-wrap:anywhere;text-align:left;margin:0;align-self:end}
 .character-profession{grid-column:2;grid-row:2;font-size:9px;line-height:1.3;letter-spacing:0;text-align:left;margin:3px 0 0;align-self:start;overflow-wrap:anywhere}
 .hair-condition,.ritual-note{display:none}
 .stats{gap:5px}.stats>div{padding:2px 0}.stats span{font-size:9px}.stats strong{font-size:22px;line-height:1.1}
 .progress-title{font-size:9px;margin-top:5px;line-height:1.2}.progress-title strong{font-size:18px;line-height:1}.track{height:4px;margin:5px 0}.milestones{font-size:9px}
 .status-row,.live-timer,.selection-note,.bottom-nav,.footnote{display:none}
 .suggestion{grid-row:3;margin:0;padding:3px 7px;gap:7px;height:36px;min-width:0;border-radius:3px}
 .suggestion .hint-eyebrow{font-size:8px;line-height:1.1;margin:0 0 1px}.suggestion strong{font-size:14px;line-height:1.1}.suggestion small:last-child{display:none}.hint-swatch{width:28px;height:28px}.hint-swatch .ingredient-mark{width:23px;height:23px}
 .board{grid-row:4;grid-template-columns:minmax(0,1fr) clamp(48px,14vw,60px) minmax(0,1fr);gap:6px;min-height:248px;padding-top:4px}
 .rack{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:8px 4px;min-height:0}
 .tube{height:100%;min-height:52px;padding:0 2px 4px;border-radius:5px 5px 18px 18px;min-width:0}
 .tube .layer{height:calc((100% - 6px) / 6);min-height:0;flex:0 0 calc((100% - 6px) / 6)}
 .tube .ingredient-mark{height:100%;max-height:17px;width:17px}.tube .layer svg{height:100%;width:14px}
 .center{min-height:0}.center-caption{margin:0 0 8px;font-size:9px;letter-spacing:0}.center-caption strong{font-size:20px;margin-top:2px}
 .receiver{height:calc(100% - 58px);max-height:340px;min-height:170px;width:100%;border-radius:7px 7px 28px 28px}
 .message{grid-row:5;margin:0;min-height:0;height:28px;font-size:10px;line-height:1.3;overflow:auto}
 .cooldown-notice{display:none}
 footer{grid-row:6;display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;height:44px;min-height:0;padding:0;border:0;margin:0}
 .phone-menu{display:block;grid-column:1;grid-row:1;border:1px solid var(--orange);background:transparent;border-radius:6px;color:var(--copper);font:11px system-ui;min-height:44px}
 footer .primary,footer .secondary{min-height:44px;padding:7px 8px;font-size:13px;grid-column:2;grid-row:1;margin:0}
 footer .personal-best,footer #rankings{display:none}footer #finish-run{display:none}.game.is-playing footer #finish-run{display:block}.game.is-playing footer #start{display:none}
 .game.is-playing #time-summary{color:var(--orange)}
 .mobile-menu-actions{display:grid;gap:8px}.mobile-menu-actions button{min-height:44px}
}
@media(max-width:359px){.game{min-height:620px}.dashboard{grid-template-columns:85px minmax(0,1fr);gap:6px;padding-inline:5px}.portrait{grid-template-columns:42px minmax(0,1fr)}.hair{width:42px;height:67.2px}.character-name{font-size:11px}.stats strong{font-size:20px}}
@media(min-width:360px) and (max-width:600px){.dashboard{grid-template-columns:112px minmax(0,1fr)}}
@media(max-width:600px){.embedded .game{min-height:600px}}
@media(max-width:600px){.stats span{line-height:1.1}.stats strong{font-size:20px;line-height:1}.progress-title{margin-top:3px}.track{margin:3px 0}.milestones{line-height:1.1}}

/* v1.5: one continuous wide composition, edge-to-edge rather than letterboxed. */
.art-header{aspect-ratio:3 / 1;width:100%;height:auto}
.brand.brand-art{width:100%;height:100%}.brand.brand-art img{width:100%;height:100%;object-fit:contain}
.art-header .header-controls{left:8px;right:8px;top:6px;width:auto;transform:none;padding:0}
.header-controls .icon-button{width:44px;height:44px;min-height:44px;font-size:19px;border-width:1px;box-shadow:none;background:#faf5ebdc}
.header-controls .pause-button{gap:0}.header-controls .pause-button small{font-size:9px}
@media(max-width:600px){
 .game{--phone-head:calc(100vw / 3);padding-top:0;padding-bottom:6px}
 .art-header{width:calc(100% + 16px);height:var(--phone-head);margin:0 -8px;aspect-ratio:3 / 1}
 .art-header .header-controls{inset:4px 6px auto;transform:none;width:auto;padding:0}
 .brand.brand-art,.brand.brand-art img{height:100%;width:100%;max-height:none;object-fit:contain}
}

.art-header{aspect-ratio:2172 / 724}
@media(max-width:600px){.game{--phone-head:calc(100vw * 724 / 2172)}.art-header{aspect-ratio:2172 / 724}}

/* v1.6: character lobby and focused play surface. */
.play-wordmark{display:none}.lobby{display:block}
.game:not(.in-session){display:block;height:auto;min-height:100dvh}
.game:not(.in-session)>:not(.art-header):not(.lobby){display:none!important}
.game:not(.in-session) #pause{display:none}
.game:not(.in-session) .art-header{margin-bottom:20px}
.lobby-heading{text-align:center;margin:0 0 22px}.lobby-heading h1{font:400 30px/1.2 Georgia;color:var(--copper);margin:0 0 6px}.lobby-heading p{font:13px/1.5 system-ui;color:#816450;margin:0}
.lobby-characters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
.lobby-card{display:block;position:relative;min-width:0;padding:0;border:1px solid #dfbd9f;background:#fffaf1;border-radius:5px;overflow:hidden;color:var(--copper);text-align:center;box-shadow:0 3px 14px #9b5b2510}
.lobby-hair{display:block;width:100%;aspect-ratio:.625;background-size:500% 125%;background-position:100% 0;mix-blend-mode:multiply}
.lobby-card-caption{display:block;padding:12px 4px 14px;border-top:1px solid #e7c9b366}.lobby-card-caption strong{display:block;font:400 22px/1.2 Georgia}.lobby-card-caption>span{display:block;font:11px/1.4 system-ui;margin-top:4px;color:#9e481e}
.lobby-check{display:none;position:absolute;top:7px;right:7px;width:26px;height:26px;border-radius:50%;background:var(--orange);color:white;font:17px/26px system-ui}
.lobby-card.chosen{border:2px solid var(--orange);box-shadow:0 0 0 3px #d751151a}.lobby-card.chosen .lobby-check{display:block}
.lobby-actions{position:sticky;bottom:0;z-index:5;background:#faf5ebf7;backdrop-filter:blur(8px);border-top:1px solid var(--line);margin:20px -4px 0;padding:12px 4px 8px;text-align:center}
.lobby-actions>p{font:12px/1.5 system-ui;margin:0 0 8px;color:var(--copper)}.lobby-actions>.primary{width:100%;min-height:48px;font-size:17px}.lobby-links{display:flex;justify-content:center;gap:18px;margin-top:5px}.lobby-links button{min-height:44px;border:0;background:transparent;color:var(--copper);font:12px system-ui;padding:8px 2px}
.game.in-session .lobby,.game.in-session .brand-art{display:none}
.game.in-session .art-header{height:56px;aspect-ratio:auto;display:flex;align-items:center;justify-content:center;margin:0 0 14px;width:100%;border-bottom:1px solid #d7511540}
.game.in-session .play-wordmark{display:block;width:200px;max-width:calc(100% - 112px);height:48px;object-fit:contain;mix-blend-mode:multiply}
.game.in-session .art-header .header-controls{inset:5px 0 auto;transform:none;width:auto;padding:0}
.game.in-session .header-controls button{border-color:#d7511555;background:#fffaf1;border-radius:7px}
.game.in-session .board{isolation:isolate}
.game.in-session .board:before{content:'';position:absolute;inset:-10px -4px;z-index:-1;pointer-events:none;opacity:.13;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500'%3E%3Cg fill='none' stroke='%23c74f15' stroke-width='1'%3E%3Cpath d='M16 20C16 45 54 48 54 74S16 100 16 126M54 20C54 45 16 48 16 74S54 100 54 126M20 26H50M28 43H42M20 68H50M20 82H50M28 100H42M20 120H50'/%3E%3Ccircle cx='452' cy='385' r='33'/%3E%3Ccircle cx='452' cy='385' r='48'/%3E%3Cpath d='M402 385H499M452 332V438M410 446L438 466L478 450M438 466L436 492'/%3E%3Ccircle cx='410' cy='446' r='7'/%3E%3Ccircle cx='438' cy='466' r='8'/%3E%3Ccircle cx='478' cy='450' r='7'/%3E%3C/g%3E%3C/svg%3E") center/100% 100% no-repeat}
@media(max-width:600px){
 .game:not(.in-session){padding:0 12px 8px;max-width:none;min-height:100dvh;gap:0}
 .game:not(.in-session) .art-header{width:calc(100% + 24px);margin:0 -12px 20px;height:calc(100vw / 3)}
 .game:not(.in-session) .header-controls{inset:5px 6px auto}
 .lobby-heading{margin-bottom:16px}.lobby-heading h1{font-size:27px}.lobby-characters{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .lobby-card-caption{padding:9px 4px 12px}.lobby-card-caption strong{font-size:21px}.lobby-actions{margin-top:18px;padding-bottom:max(8px,env(safe-area-inset-bottom))}
 .game.in-session{--phone-head:48px;--phone-dash:clamp(140px,22dvh,180px);padding-top:4px}
 .game.in-session .art-header{height:48px;width:100%;margin:0}
 .game.in-session .art-header .header-controls{inset:2px 0 auto}
 .game.in-session .play-wordmark{height:40px;width:184px}
 .game.in-session .dashboard{grid-template-columns:106px minmax(0,1fr);padding:5px 9px;gap:12px;border:0;border-bottom:1px solid #d7511540;border-radius:0;background:transparent}
 .game.in-session .portrait{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;height:100%}
 .game.in-session .hair{height:calc(var(--phone-dash) - 42px);width:calc((var(--phone-dash) - 42px) * .625);flex-shrink:0}
 .game.in-session .character-name{font:400 16px/1.2 Georgia;text-align:center;margin:3px 0 0;align-self:center;overflow-wrap:normal}
 .game.in-session .character-profession{font:10px/1.3 system-ui;text-align:center;align-self:center;margin-top:2px;overflow-wrap:normal}
 .game.in-session .stats strong{font-size:24px;line-height:1.2}.game.in-session .stats span{font-size:9px;letter-spacing:.4px}
 .game.in-session .progress-title{font-size:10px;margin-top:12px}.game.in-session .progress-title strong{font-size:25px}.game.in-session .track{height:5px;margin:7px 0}.game.in-session .milestones{font-size:10px}
 .game.in-session .suggestion{background:#fffaf177}
}
@media(max-width:359px){.game.in-session .dashboard{grid-template-columns:90px minmax(0,1fr);gap:8px;padding-inline:4px}.game.in-session .stats strong{font-size:20px}.lobby-card-caption strong{font-size:19px}}