/* The CRU® Serum Atelier — brushed platinum, ivory glass and champagne details. */
.lucky-page[data-active-arcade="serum"] .lucky-grid{grid-template-columns:minmax(0,1fr)}
.lucky-page[data-active-arcade="serum"] .lucky-side{display:none}
.lucky-arcade-tabs:has([data-arcade-tab="serum"]){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.lucky-arcade-tabs [data-arcade-tab="serum"]{background:linear-gradient(130deg,#fffef4,#e3eee7);color:#3d5b54;border-color:#b4c2b2}
.lucky-arcade-tabs [data-arcade-tab="serum"][aria-selected="true"]{background:linear-gradient(125deg,#49645d,#253e40);color:#f2e5bc;border-color:#baa676;box-shadow:0 4px 0 #a3926a,0 12px 28px #324d4429}
.cru-serum-lab{--csl-ink:#314c4d;--csl-gold:#9c8456;position:relative;isolation:isolate;min-width:0;padding:30px 36px 22px;border:1px solid #b9b6a0;border-radius:27px;background:radial-gradient(ellipse at 0 0,#fff8dbc2,transparent 42%),radial-gradient(ellipse at 100% 10%,#c9e0d57d,transparent 50%),repeating-linear-gradient(115deg,#a1b1ac08 0 1px,#ffffff13 1px 3px),linear-gradient(135deg,#fffff8,#ebeee6 58%,#f6f1e2);box-shadow:inset 0 0 0 5px #fffcf1bd,0 2px 0 #aea386,0 6px 0 #82938d,0 10px 0 #d4d7c8,0 26px 62px #284f4523;color:var(--csl-ink)}
.cru-serum-lab *{box-sizing:border-box}
.cru-serum-lab::before{content:"";position:absolute;inset:11px;pointer-events:none;border:1px solid #c1b28a66;border-radius:18px;z-index:-1}
.cru-serum-lab h2,.cru-serum-lab h3,.cru-serum-lab p{margin:0;color:inherit}
.cru-serum-lab button{font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.cru-serum-lab button:focus-visible,.cru-serum-lab canvas:focus-visible,.cru-serum-lab summary:focus-visible{outline:3px solid #977c44;outline-offset:4px}
.cru-serum-lab button:disabled{opacity:.42;cursor:default}
.cru-serum-lab [hidden]{display:none!important}
.csl-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:22px;margin-bottom:25px;border-bottom:1px solid #b7ad8c73}
.csl-eyebrow{display:block;color:#89764e;font:600 9px/1.5 system-ui,sans-serif;letter-spacing:.19em}
.csl-heading h2{font:500 clamp(30px,3.4vw,40px)/1.3 'Noto Serif TC',Georgia,serif;letter-spacing:.06em;margin:8px 0 11px;color:#2e4c4c}
.csl-heading h2 small{display:block;font:400 8px/1.6 Georgia,serif;letter-spacing:.3em;margin-top:8px;color:#72827a}
.csl-heading p{font-size:12px;letter-spacing:.13em;color:#6a7a72}
.csl-mode{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:10px;letter-spacing:.05em;padding:10px 14px;border:1px solid #b5b592;border-radius:30px;background:#fffceb80;color:#777147;box-shadow:inset 0 1px #fffff5}
.csl-mode i{display:block;width:5px;height:5px;border-radius:50%;background:#6c9986;box-shadow:0 0 0 3px #6c998617}
.csl-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:38px;max-width:950px;margin:auto;align-items:start}
.csl-main{width:100%;max-width:500px;margin:0 auto;min-width:0}
.csl-dashboard{display:grid;grid-template-columns:1.2fr 1fr .8fr;padding:15px 8px;border:1px solid #a9976d;border-radius:14px;background:linear-gradient(125deg,#395851,#243f43 65%,#3f5754);box-shadow:inset 0 1px #ced6c44a,0 3px 0 #b3aa8f,0 8px 17px #40564720;color:#f0e4c2;margin-bottom:23px}
.csl-dashboard>div{text-align:center;border-right:1px solid #d9d4b32e;min-width:0}
.csl-dashboard>div:last-child{border:0}
.csl-dashboard span{font-size:10px;color:#c7d7cb;letter-spacing:.12em;display:block}
.csl-dashboard strong{display:block;margin-top:7px;font:400 33px/1.1 Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:.025em;color:#f5e4b9;text-shadow:0 0 18px #f5d78d21}
.csl-dashboard strong small{font-size:13px;margin-left:3px;color:#d0d7bb}
.csl-cabinet{padding:0 17px;border:1px solid #a4a386;border-radius:21px;background:repeating-linear-gradient(0deg,#ffffff15 0 1px,#88978a0b 1px 3px),linear-gradient(125deg,#bec8bf,#fffbed 20%,#a7b7b4 43%,#f6efdb 67%,#b1b7a6 100%);box-shadow:inset 0 0 0 3px #e7e5d8,inset 0 0 0 5px #b5b099,0 3px 0 #758881,0 7px 0 #d8d9cb,0 12px 0 #a1aba1,0 24px 29px #34544929}
.csl-engraving{display:flex;align-items:center;gap:12px;height:37px;padding:0 2px;text-shadow:0 1px #fff9df;color:#67745f}
.csl-engraving b{font:600 14px Georgia,serif;letter-spacing:.1em}
.csl-engraving span{font:500 6px Georgia,serif;letter-spacing:.17em;margin-left:auto}
.csl-engraving i{width:5px;height:5px;border:1px solid #9a9776;border-radius:50%;background:linear-gradient(45deg,#fef7df 45%,#798779 46% 55%,#dad4b8 56%)}
.csl-stage{position:relative;border:1px solid #869c90;border-radius:13px;overflow:hidden;background:#dfe9df;box-shadow:inset 0 2px 8px #4567584d,0 1px #fff8dc}
.csl-stage canvas{display:block;width:100%;height:auto;aspect-ratio:6/7;touch-action:none;user-select:none;-webkit-user-select:none;outline-offset:-4px!important}
.csl-stage::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(125deg,#ffffff21,transparent 30% 60%,#fff7d616);box-shadow:inset 0 0 0 4px #eef2e657;border-radius:12px}
.csl-hud{position:absolute;z-index:2;left:10%;right:10%;top:20%;display:flex;align-items:center;justify-content:space-between;gap:5px;pointer-events:none}
.csl-hud>span{font:600 9px/1.5 system-ui,sans-serif;letter-spacing:.06em;color:#567467}
.csl-hud>strong{font:500 9px/1.5 system-ui,sans-serif;letter-spacing:.03em;color:#927a40}
.csl-baseplate{display:flex;justify-content:space-between;align-items:center;gap:8px;height:30px;font:600 6px/1.5 ui-monospace,monospace;letter-spacing:.14em;color:#6f765e;text-shadow:0 1px #fff5d1}
.csl-intro{position:absolute;z-index:3;left:10%;right:10%;top:45%;text-align:center;padding:20px 16px;border:1px solid #b5a77fcc;border-radius:14px;background:linear-gradient(135deg,#fffef2ed,#e8eee4eb);box-shadow:inset 0 0 0 3px #fffff0b3,0 10px 30px #3d655f26;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.csl-intro .csl-eyebrow{font-size:7px;letter-spacing:.15em}
.csl-intro h3{font:500 24px/1.5 'Noto Serif TC',Georgia,serif;letter-spacing:.05em;margin:9px 0 7px;color:#3c5e55}
.csl-intro p{font-size:11px;line-height:1.85;color:#718071}
.csl-intro button{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:12px 18px;min-height:45px;width:100%;max-width:235px;margin:17px auto 0;border:1px solid #887d59;border-radius:7px;color:#f5e7c1;background:linear-gradient(130deg,#577168,#2e4c49);box-shadow:inset 0 1px #c9d8b240,0 3px 0 #b4a47b;font-size:12px;letter-spacing:.08em}
.csl-intro button:hover{background:linear-gradient(130deg,#668174,#3b5853)}
.csl-intro button span{font-size:18px}
.csl-controls{display:grid;grid-template-columns:1fr 1.8fr 1fr;gap:10px;margin:28px 0 14px}
.csl-controls button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:62px;padding:10px 6px;border:1px solid #afa789;border-radius:10px;background:linear-gradient(#ffffef,#d9e0d2);box-shadow:inset 0 1px #fff,0 3px 0 #9fa38a;color:#4d675b;font-size:19px;touch-action:none;user-select:none;-webkit-user-select:none}
.csl-controls button:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 2px 6px #54675125,0 1px 0 #9ba081}
.csl-controls button small{font-size:9px;letter-spacing:.04em;color:#6c7d6f}
.csl-controls [data-csl-action="pulse"]{border-color:#b0a071;background:linear-gradient(#fff8dd,#e2d5ad);color:#7a693e;font-size:12px}
.csl-controls [data-csl-action="pulse"] b{display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 4px;margin-left:3px;border:1px solid #b6a878;border-radius:50%;font:600 9px Georgia,serif;color:#7b6d43;background:#fff4ce}
.csl-guide{font-size:10px;line-height:1.8;text-align:center;color:#6d7f71!important}
.csl-guide strong{display:block;font-size:11px;font-weight:500;color:#466455;margin-bottom:3px}
.csl-guide span{display:block}
.csl-toolbar{display:flex;align-items:center;gap:9px;margin-top:16px;padding-top:13px;border-top:1px solid #b0b09b70}
.csl-toolbar button{min-height:42px;padding:9px 13px;border:1px solid #b5b49b;border-radius:7px;background:#fffced9e;color:#536f61;font-size:11px}
.csl-toolbar>span{margin-left:auto;color:#738170;font-size:10px}
.csl-toolbar b{font:500 20px Georgia,serif;color:#8c7950;margin-left:7px}
.csl-save{margin-top:12px!important;text-align:center;font-size:9px;line-height:1.7;color:#7a8678!important}
.csl-notebook{padding-left:27px;border-left:1px solid #b5b29766;min-width:0}
.csl-notebook-title{padding-top:4px;margin-bottom:20px}
.csl-notebook-title .csl-eyebrow{font-size:8px;letter-spacing:.14em}
.csl-notebook-title h3{font:500 25px/1.5 'Noto Serif TC',Georgia,serif;letter-spacing:.04em;color:#476054;margin:10px 0 8px}
.csl-notebook-title p{font-size:11px;line-height:1.9;letter-spacing:.03em;color:#7a8373}
.csl-recipes{display:flex;flex-direction:column;gap:10px}
.csl-recipes>div{display:flex;align-items:center;gap:12px;min-height:90px;padding:13px 10px;border:1px solid #b7b8a78f;border-radius:11px;background:#f5f6ed85;position:relative}
.csl-recipes>div.is-active{border-color:#ac9970;background:linear-gradient(130deg,#fffff4,#dee8dba6);box-shadow:inset 0 1px #fff,0 5px 12px #79958112}
.csl-recipes>div.is-active::before{content:"";position:absolute;left:-1px;top:26%;bottom:26%;width:3px;border-radius:3px;background:#9caa84}
.csl-recipe-orb{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;border:1px solid #fffde5;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fffffc,var(--orb) 40%,var(--edge));box-shadow:0 0 0 3px #c9d2b74a,0 5px 8px #4e715f20;color:var(--edge);font:18px Georgia,serif;text-shadow:0 1px #fff8d5}
.csl-recipes>div>div{flex:1;min-width:0}
.csl-recipes small{font:500 7px Georgia,serif;letter-spacing:.08em;color:#89907b;display:block;white-space:nowrap}
.csl-recipes strong{font-size:13px;font-weight:500;color:#4a6556;display:block;margin:6px 0}
.csl-recipes [data-csl-count]{font:500 11px ui-monospace,monospace;color:#9b8755}
.csl-recipes i{font-style:normal;color:#a5b29b;font-size:14px;margin-left:auto}
.csl-recipes .is-complete i{color:#60816a}
.csl-note{display:flex;gap:10px;padding:16px 1px;border-top:1px solid #bdba9e73;border-bottom:1px solid #bdba9e73;margin:20px 0}
.csl-note>span{font-size:23px;color:#ae9253}
.csl-note strong{font-size:12px;font-weight:500;letter-spacing:.08em;color:#627259}
.csl-note p{font-size:10px;line-height:1.85;color:#7c8674;margin-top:7px}
.csl-library>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:8px}
.csl-library>div:first-child strong{font-size:12px;font-weight:500;color:#5c735f}
.csl-library>div:first-child small{font:10px ui-monospace,monospace;color:#8c8f78}
.csl-editions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:10px 0}
.csl-editions>div{text-align:center;filter:saturate(.2);opacity:.6;min-width:0}
.csl-editions>div.is-unlocked{filter:none;opacity:1}
.csl-editions svg{display:block;width:100%;height:auto;aspect-ratio:2/3;filter:drop-shadow(0 4px 5px #41655321)}
.csl-editions strong{display:block;font-size:9px;font-weight:500;white-space:nowrap;color:#5a735e}
.csl-editions small{display:block;margin-top:5px;font:5px Georgia,serif;color:#8b937c;letter-spacing:.06em}
.csl-library>p{font-size:9px;line-height:1.8;color:#818a76;text-align:center;margin-top:12px}
.csl-rules{border-top:1px solid #b5b29773;margin-top:24px;color:#5b7363}
.csl-rules summary{display:flex;justify-content:space-between;align-items:center;gap:10px;list-style:none;cursor:pointer;padding:17px 0 0;font-size:12px}
.csl-rules summary::-webkit-details-marker{display:none}
.csl-rules summary span{font-size:20px;font-weight:300;color:#ab9258}
.csl-rules[open] summary span{transform:rotate(45deg)}
.csl-rules>div{padding-top:12px}
.csl-rules p{font-size:11px;line-height:1.9;margin-bottom:9px;color:#748171}
.csl-overlay{position:absolute;z-index:5;inset:0;display:grid;place-items:center;padding:22px;background:#48695540;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.csl-overlay-card{width:100%;max-width:345px;padding:23px 17px;text-align:center;border:1px solid #b39e6c;border-radius:17px;background:radial-gradient(ellipse at 50% 0,#fffbe6,#eaf0e6 75%);box-shadow:inset 0 0 0 4px #fff9e6,0 15px 40px #34544847;animation:csl-reveal .45s ease-out}
.csl-result-bottle:empty{display:none}
.csl-result-bottle{width:90px;height:135px;margin:-4px auto 6px;filter:drop-shadow(0 5px 12px #9ea7713d)}
.csl-result-bottle svg{width:100%;height:100%}
.csl-overlay-card .csl-eyebrow{font-size:8px;letter-spacing:.18em}
.csl-overlay-card h3{font:500 24px/1.5 'Noto Serif TC',Georgia,serif;margin:8px 0;color:#3b6151}
.csl-overlay-card p{font-size:11px;line-height:1.8;color:#71816d}
.csl-result-stats:empty{display:none}
.csl-result-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:17px 0 0;padding:12px 0;border-top:1px solid #c1bd9c73;border-bottom:1px solid #c1bd9c73}
.csl-result-stats span{font-size:8px;display:block;color:#809179}
.csl-result-stats b{font:500 20px Georgia,serif;display:block;color:#937b48;margin-top:6px}
.csl-overlay-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:18px}
.csl-overlay-actions button{min-height:44px;padding:11px 16px;font-size:11px;border:1px solid #b3ab84;border-radius:7px;color:#667259;background:#fff8e5}
.csl-overlay-actions button.primary{color:#f6e8ba;border-color:#7c9176;background:linear-gradient(125deg,#5c7865,#2e534b);box-shadow:0 3px 0 #b5a16c}
.csl-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@keyframes csl-reveal{from{transform:translateY(10px) scale(.94);opacity:0}to{transform:none;opacity:1}}
@media(max-width:1050px){.cru-serum-lab{padding:26px}.csl-layout{grid-template-columns:minmax(0,1fr) 215px;gap:24px}.csl-notebook{padding-left:22px}.csl-notebook-title h3{font-size:22px}.csl-recipes>div{gap:9px;padding:11px 8px}.csl-recipe-orb{width:29px;height:29px}.csl-recipes strong{font-size:12px}.csl-recipes small{font-size:6px}.csl-intro h3{font-size:22px}.csl-heading h2{font-size:34px}}
@media(max-width:760px){.lucky-arcade-tabs:has([data-arcade-tab="serum"]){grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.cru-serum-lab{padding:22px 19px 18px;border-radius:22px}.cru-serum-lab::before{inset:8px;border-radius:16px}.csl-heading{align-items:flex-start;margin-bottom:20px;padding-bottom:19px;gap:10px}.csl-heading h2{font-size:29px}.csl-heading h2 small{font-size:7px;letter-spacing:.18em}.csl-heading p{font-size:10px;letter-spacing:.07em}.csl-eyebrow{font-size:7px;letter-spacing:.13em}.csl-mode{font-size:8px;padding:8px 9px;margin-top:5px;gap:5px}.csl-layout{grid-template-columns:1fr;gap:25px}.csl-main{max-width:460px}.csl-dashboard{padding:13px 7px;margin-bottom:21px}.csl-dashboard strong{font-size:29px}.csl-dashboard span{font-size:9px}.csl-dashboard strong small{font-size:11px}.csl-cabinet{padding:0 12px}.csl-engraving{height:31px;gap:7px}.csl-engraving b{font-size:12px}.csl-engraving span{font-size:5px;letter-spacing:.08em}.csl-baseplate{height:26px;font-size:5px;letter-spacing:.06em}.csl-hud>span,.csl-hud>strong{font-size:7px}.csl-intro{left:9%;right:9%;top:43%;padding:15px 11px}.csl-intro h3{font-size:21px;margin:7px 0 5px}.csl-intro p{font-size:9px}.csl-intro .csl-eyebrow{font-size:6px}.csl-intro button{margin-top:12px;min-height:44px;padding:9px 13px;font-size:11px}.csl-controls{gap:8px;margin-top:27px}.csl-controls button{min-height:62px}.csl-controls button small{font-size:8px}.csl-controls [data-csl-action="pulse"]{font-size:11px}.csl-guide strong{font-size:10px}.csl-guide{font-size:9px}.csl-toolbar button{font-size:10px;padding:8px 11px}.csl-toolbar>span{font-size:9px}.csl-toolbar b{font-size:18px}.csl-notebook{padding:22px 0 0;border-left:0;border-top:1px solid #b5b29766}.csl-notebook-title{margin-bottom:17px}.csl-notebook-title h3{font-size:23px;margin:7px 0}.csl-notebook-title p{font-size:10px}.csl-notebook-title br{display:none}.csl-recipes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.csl-recipes>div{display:flex;flex-direction:column;text-align:center;padding:13px 6px;gap:10px;min-height:150px}.csl-recipes>div>div{flex:none}.csl-recipes strong{font-size:11px;white-space:nowrap}.csl-recipes small{font-size:6px;letter-spacing:0}.csl-recipes i{position:absolute;right:6px;top:8px;font-size:10px}.csl-note{padding:15px 5px}.csl-note p{font-size:11px}.csl-editions{max-width:320px;margin:10px auto;gap:14px}.csl-editions svg{max-height:120px}.csl-editions strong{font-size:11px}.csl-editions small{font-size:6px}.csl-library>p{font-size:10px}.csl-overlay{padding:17px}.csl-overlay-card{padding:17px 12px}.csl-overlay-card h3{font-size:20px}.csl-result-bottle{width:67px;height:101px;margin-top:-3px}.csl-overlay-card p{font-size:10px}.csl-result-stats{margin-top:12px;padding:10px 0}.csl-result-stats b{font-size:18px}.csl-overlay-actions{margin-top:12px}.csl-overlay-actions button{padding:10px 13px;font-size:10px}}
@media(max-width:430px){.cru-serum-lab{padding:20px 14px 16px}.csl-heading h2{font-size:27px}.csl-heading h2 small{font-size:6px}.csl-mode i{display:none}.csl-mode{font-size:7px;padding:7px 8px}.csl-cabinet{padding:0 10px}.csl-engraving span{font-size:4.5px}.csl-hud>span,.csl-hud>strong{font-size:6px}.csl-intro{padding:12px 10px;top:42%}.csl-intro h3{font-size:19px}.csl-intro p{font-size:8px}.csl-intro .csl-eyebrow{font-size:5px}.csl-intro button{font-size:10px;margin-top:9px}.csl-controls{gap:6px}.csl-controls button small{font-size:7px}.csl-controls [data-csl-action="pulse"]{font-size:10px}.csl-controls [data-csl-action="pulse"] b{font-size:8px;width:14px;height:14px;min-width:14px}.csl-toolbar{gap:7px}.csl-toolbar button{font-size:9px;padding:8px 10px}.csl-guide strong{font-size:9px}.csl-guide{font-size:8px}.csl-save{font-size:8px}.csl-recipes strong{font-size:10px}.csl-recipes small{font-size:5px}.csl-overlay{padding:13px}.csl-overlay-card h3{font-size:18px}.csl-overlay-card .csl-eyebrow{font-size:6px}.csl-overlay-card p{font-size:9px}.csl-result-bottle{width:54px;height:81px}.csl-result-stats span{font-size:7px}.csl-result-stats b{font-size:16px}.csl-result-stats{padding:8px 0;margin-top:9px}.csl-overlay-actions{gap:6px;margin-top:10px}.csl-overlay-actions button{padding:9px 10px;min-height:41px;font-size:9px}}
@media(max-width:760px){.csl-hud>span,.csl-hud>strong{font-size:10px}.csl-intro p{font-size:11px}.csl-intro{top:36%}.csl-intro button{font-size:12px}.csl-guide,.csl-guide strong{font-size:10px}.csl-controls button small{font-size:9px}.csl-controls [data-csl-action="pulse"]{font-size:12px}.csl-toolbar button{font-size:11px}.csl-save{font-size:10px}.csl-overlay-card p{font-size:11px}.csl-overlay-actions button{font-size:11px;min-height:44px}}
@media(prefers-reduced-motion:reduce){.cru-serum-lab *,.cru-serum-lab *::before,.cru-serum-lab *::after{animation:none!important;transition:none!important}}
