.c5-page{background:#171323;color:#ede1ee;background-image:linear-gradient(135deg,#37203d55,transparent 55%)}.c5-page>.audio-credit{color:#a99db4}.c5-page>.audio-credit a{color:#d1a4c3}.c5{max-width:1440px;margin:auto;padding:0 30px 35px;font-family:"Microsoft YaHei",sans-serif}.c5[hidden],.c5 [hidden]{display:none!important}.c5-head{padding:20px 0;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #89537b60;gap:15px}.c5-head a{color:#ded0e1;text-decoration:none;font-size:12px;letter-spacing:2px}.c5-controls{display:flex;gap:13px;align-items:center;font-size:10px;color:#c5b5ce;flex-wrap:wrap}.c5-controls label{display:flex;gap:5px;align-items:center}.c5-controls input{width:60px;accent-color:#ec8cba}.c5 button{font:inherit;cursor:pointer}.c5-controls button{color:#d1b9d1;border:1px solid #805b85;background:#2f243e;padding:7px 10px}.c5-intro{display:flex;justify-content:space-between;align-items:center;padding:24px 0}.c5-kicker{font:10px/1.7 monospace;letter-spacing:2px;color:#af8fba}.c5-intro h1{font:500 33px LocalSerif,serif;letter-spacing:5px;margin:8px 0;color:#f6cfdf;text-shadow:0 0 19px #e77cba44}.c5-intro p:last-child{font-size:11px;color:#ad9bb6}.c5-neon{border:1px solid #c276ab;color:#dfa4cf;padding:9px 15px;box-shadow:0 0 15px #c276ab22,inset 0 0 12px #c276ab22;font:11px/1.7 monospace;letter-spacing:2px}.c5-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:15px}.c5-screen,.c5-mixer{border:2px solid #72507e;box-shadow:4px 4px 0 #0e0d1c;background:#211a30;min-width:0}.c5-titlebar{display:flex;justify-content:space-between;align-items:center;background:#43304e;color:#e0cce5;font:10px monospace;letter-spacing:1px;padding:11px 15px;border-bottom:2px solid #71507b}.c5-titlebar button{background:transparent;color:#d4b3ce;border:0;font-size:10px}.c5-stage{position:relative;line-height:0}.c5-stage canvas{width:100%;display:block;image-rendering:pixelated;cursor:pointer}.c5-dialogue{border-top:2px solid #72507e;min-height:196px;padding:20px 25px;background:#292037}.c5-dialogue .c5-speaker{color:#f2aaac;letter-spacing:2px;font-size:12px;margin:0 0 10px}.c5-dialogue h2{color:#e4d4e4;font:600 21px LocalSerif,serif;margin:8px 0}.c5-dialogue p{color:#bcaec9;font-size:13px;line-height:1.9;white-space:pre-line;margin:8px 0}.c5-next{background:#785273;border:1px solid #c18ca9;color:#ffdfeb;padding:10px 16px;float:right;margin:8px 0}.c5-dialogue:after{content:"";display:table;clear:both}.c5-scoreboard{display:flex;justify-content:space-around;text-align:center;padding:17px 12px;border-top:1px solid #72507e;background:#1e192b}.c5-scoreboard span{font:10px monospace;color:#ad95bb;display:block}.c5-scoreboard strong{display:block;font:20px monospace;color:#e8cadb;margin-top:7px}.c5-book{margin-top:15px;border:1px solid #6b516d;background:#2e253b;padding:17px 20px}.c5-book h3{font-size:13px;color:#dabacf;letter-spacing:1px;margin:0 0 12px}.c5-book p{font-size:11px;line-height:1.9;color:#ac9ab8;margin:6px 0}.c5-recipe{display:flex;gap:8px;flex-wrap:wrap;margin:13px 0}.c5-recipe span{border:1px solid var(--tone);color:var(--tone);font:11px monospace;padding:6px 8px}.c5-order{padding:16px 18px 0}.c5-order h2{font:600 22px LocalSerif,serif;color:#edc6d8;margin:6px 0 10px}.c5-order p{color:#b7a3c3;font-size:11px;line-height:1.8}.c5-shaker{height:126px;display:flex;justify-content:center;align-items:center;position:relative;background:radial-gradient(ellipse,#77476244,transparent 65%);margin:2px 15px}.c5-glass{width:63px;height:87px;border:3px solid #cfc5dd;border-top:7px solid #dfd6e5;clip-path:polygon(0 0,100% 0,85% 100%,15% 100%);position:relative;background:#a797bf18;box-shadow:inset 8px 0 #ffffff09}.c5-liquid{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(#e299c7,#9168b9);transition:height .15s;opacity:.85}.c5-ice{position:absolute;top:27px;left:15px;width:17px;height:17px;border:1px solid #dbf6f8;background:#ade5ed55;transform:rotate(20deg);box-shadow:15px 22px #d8fcfc55}.c5-shaker small{position:absolute;right:18px;bottom:12px;color:#ae98bb;font:10px monospace}.c5-ingredients{padding:0 16px;display:grid;gap:7px}.c5-ingredient{display:grid;grid-template-columns:1fr 30px 24px 30px;gap:6px;align-items:center;border-left:3px solid var(--tone);padding:7px 8px;background:#31273e}.c5-ingredient strong{font-size:11px;color:var(--tone);display:block}.c5-ingredient small{font:8px monospace;color:#a48eae;display:block;margin-top:3px}.c5-ingredient button{border:1px solid #755880;color:#e8cbe1;background:#4b365b;height:29px;font:17px monospace}.c5-ingredient output{font:14px monospace;color:#ede0ed;text-align:center}.c5-tools{padding:15px 16px;display:flex;gap:10px;align-items:center;justify-content:space-between;font-size:11px;color:#c7b3d2}.c5-tools label{display:flex;align-items:center;gap:7px}.c5-tools input{accent-color:#bf8cbd}.c5-tools button{border:1px solid #765b83;background:transparent;color:#bba6c7;padding:7px 10px}.c5-mix-buttons{padding:0 16px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.c5-mix-buttons button{padding:12px 7px;color:#d7b8de;background:#493353;border:1px solid #8b6294;font-size:12px}.c5-serve{margin:10px 16px 14px;width:calc(100% - 32px);padding:13px;background:#976584;color:#ffdfeb;border:1px solid #d39bc0;font-size:13px;letter-spacing:2px}.c5 button:disabled{opacity:.35;cursor:default}.c5-mix-status{font-size:10px;line-height:1.8;color:#b9a8c4;min-height:32px;padding:0 18px 13px;margin:0}.c5-result{margin:15px 16px;padding:16px;background:#35283d;border:1px solid #c795ae;color:#d9b9d2;font-size:12px;line-height:1.9}.c5-result h3{color:#f3bfca;font:21px monospace;margin:0 0 10px}.c5-result button{width:100%;padding:11px;background:#805c80;border:1px solid #b68dad;color:#f5deef;margin-top:12px;font-size:12px}.c5-footer{margin:23px 0 0;display:flex;justify-content:space-between;gap:20px;color:#9e8da9;font-size:10px;line-height:1.9}.c5-footer button{background:transparent;border:1px solid #70547e;color:#cdb3d3;padding:6px 10px;margin-left:6px}.c5 button:focus-visible{outline:3px solid #7dd4df;outline-offset:3px}.c5-shaking .c5-glass{animation:c5shake .14s linear infinite}.c5-stirring .c5-liquid{animation:c5stir .3s linear infinite}@keyframes c5shake{0%,100%{transform:rotate(-12deg) translateX(-4px)}50%{transform:rotate(12deg) translateX(4px)}}@keyframes c5stir{50%{filter:brightness(1.35)}}@media(max-width:1050px){.c5{padding:0 18px 25px}.c5-layout{grid-template-columns:minmax(0,1fr) 340px}.c5-dialogue{padding:18px}.c5-intro h1{font-size:27px}}@media(max-width:760px){.c5-layout{grid-template-columns:1fr}.c5-head{flex-direction:column;align-items:flex-start}.c5-neon{display:none}.c5-intro h1{font-size:27px}.c5-dialogue{min-height:0}.c5-mixer{margin-top:6px}.c5-shaker{height:108px}.c5-footer{flex-direction:column}.c5-book{margin-top:12px}}@media(prefers-reduced-motion:reduce){.c5-shaking .c5-glass,.c5-stirring .c5-liquid{animation:none}.c5-liquid{transition:none}}
