:root{--ink:#382641;--purple:#8050bd;--muted:#88788e;--line:#e7d8df;--cream:#fffaf1}*{box-sizing:border-box}body{margin:0;background:#fff6e9;background-image:radial-gradient(ellipse at 100% 5%,#f1d8f1,transparent 38%),radial-gradient(ellipse at 0 65%,#dcf0dc,transparent 40%);color:var(--ink);font:15px/1.6 'Segoe UI',Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;touch-action:manipulation}a{color:inherit;text-decoration:none}button:disabled{cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #9a62d9;outline-offset:4px}h1,h2,h3,p,figure{margin-top:0}.app-wrap{width:calc(100% - 90px);max-width:1320px;margin:auto}.lab-header{display:flex;align-items:center;justify-content:space-between;gap:20px;height:96px;border-bottom:1px solid #e4d3dc}.brand{display:flex;align-items:center;font-size:26px;font-weight:900;letter-spacing:-1.3px;line-height:1}.brand>span:first-child{font-size:38px;margin-right:8px;color:var(--purple)}.brand>span:last-child{color:var(--purple)}.lab-header nav{display:flex;gap:25px;font-size:11px;font-weight:700}.lab-header nav a:hover{color:var(--purple)}.intro-row{display:flex;align-items:end;justify-content:space-between;gap:30px;padding:35px 0 30px}.eyebrow{font-size:9px;font-weight:800;letter-spacing:1.7px;line-height:1.7;margin-bottom:12px}.intro-row .eyebrow>span{font-size:7px;letter-spacing:.8px;color:#8755a8;background:#f1e3f5;padding:4px 6px;border-radius:4px;margin-left:8px;white-space:nowrap}h1{font-size:clamp(34px,4.4vw,58px);letter-spacing:-2.8px;line-height:1.04;font-weight:900;margin-bottom:12px}h1>span{color:var(--purple)}.intro{font-size:14px;color:var(--muted);margin:0}.save-button{flex-shrink:0;border:0;border-radius:9px;padding:13px 17px;background:var(--purple);color:white;font-size:12px;font-weight:750;box-shadow:0 4px 0 #613b8e;display:flex;align-items:center;gap:13px;white-space:nowrap}.save-button>span{font-size:20px;line-height:1}.save-button small{font:8px monospace;opacity:.7;letter-spacing:1px}.save-button:hover:enabled{background:#6f42a9}.save-button:disabled{opacity:.6}.studio{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(310px,1fr);align-items:start;gap:25px}.art-panel{border:1px solid #e8d3d7;border-radius:19px;background:#fffcf5;overflow:hidden;box-shadow:0 10px 35px #6c3c4909}.art-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 18px;border-bottom:1px solid #efdfdc}.history-controls,.zoom-controls{display:flex;align-items:center;gap:8px}.art-toolbar button{width:30px;height:30px;border:1px solid #dfcfdc;background:white;color:#7a4f98;border-radius:7px;font-size:21px;line-height:1}.art-toolbar button:disabled{opacity:.3}.history-controls>span{font-size:9px;color:var(--muted);margin-left:4px}.zoom-controls>span{font-size:10px;color:var(--muted);width:32px;text-align:center}.zoom-controls button{font-size:16px}.art-frame{max-height:680px;overflow:auto;position:relative;background:#fff8e9;scrollbar-width:thin;scrollbar-color:#d0b0d9 #fff7eb;overscroll-behavior:contain}.art-sheet{width:100%;line-height:0;transform-origin:top left;transition:width .2s}.art-sheet svg{display:block;width:100%;height:auto}.art-bottom{border-top:1px solid #ebdbdc;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:19px 22px 13px}.art-bottom .eyebrow{font-size:8px;letter-spacing:1px;color:var(--purple);margin:0}.art-bottom p{font-size:12px;margin:4px 0 0;color:var(--muted)}.wake-button{background:#e7f0bc;border:1px solid #cbd998;color:#435028;border-radius:30px;padding:10px 19px;font-size:13px;font-weight:850;display:flex;gap:16px;align-items:center;box-shadow:0 3px 0 #c7d1a5;white-space:nowrap}.wake-button>span{font-size:20px}.wake-button:hover:enabled{background:#dbeaaa}.wake-button:disabled{opacity:.7}.status{font-size:10px;color:#8a718c;min-height:34px;text-align:center;line-height:1.8;margin:0;padding:0 20px 17px}.paint-panel{border:1px solid #e6d7e2;background:#fffdfb;border-radius:19px;padding:25px 24px;box-shadow:0 10px 30px #5a3f5605}.panel-heading .eyebrow{color:var(--purple);font-size:8px;letter-spacing:1.4px;margin-bottom:8px}.panel-heading h2{font-size:27px;letter-spacing:-1px;line-height:1.1;font-weight:900;margin-bottom:22px}.palette-picker{display:grid;grid-template-columns:1fr 1fr;gap:8px}.palette-picker button{display:flex;align-items:center;justify-content:start;gap:9px;background:transparent;color:var(--ink);border:1px solid #e2d2dd;border-radius:8px;padding:10px;font-size:10px;font-weight:700}.palette-picker button[aria-pressed=true]{background:#f2e8fb;border-color:#b68fcf;color:#6e3993}.mini-palette{display:flex;align-items:center;padding-left:3px}.mini-palette i{width:12px;height:12px;border:1px solid #fffaef;border-radius:50%;margin-left:-3px}.try-palette{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:9px;font-weight:750;border:0;border-bottom:1px solid #e9dfe8;background:transparent;color:var(--purple);width:100%;padding:14px 0 19px;text-align:left}.try-palette>span{font-size:16px}.swatch-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:19px 0 12px}.swatch-heading h3,.pattern-section h3,.paper-section h3{font-size:11px;font-weight:800;margin:0}.swatch-heading>span{font:7px monospace;letter-spacing:.8px;color:#9a82a2;white-space:nowrap}.swatches{display:grid;grid-template-columns:repeat(8,1fr);gap:9px}.swatches button{position:relative;aspect-ratio:1;padding:0;border-radius:50%;border:2px solid #fff;background:var(--swatch);box-shadow:0 0 0 1px #e7dce3;min-width:0;transition:transform .15s}.swatches button:hover{transform:scale(1.13)}.swatches button[aria-pressed=true]{box-shadow:0 0 0 2px #67458e;transform:scale(.92)}.swatches button[aria-pressed=true]::after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;font-size:14px;color:white;font-weight:900;text-shadow:0 1px 3px #0009}.selected-color{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:17px 0 22px;padding:10px 11px;background:#f7f1f8;border-radius:8px}.selected-color label{display:flex;align-items:center;gap:9px;font-size:9px;font-weight:700;cursor:pointer}.selected-color input{width:31px;height:31px;border:1px solid #ddc9e2;border-radius:6px;padding:2px;background:white;cursor:pointer}.selected-color>div{text-align:right}.selected-color strong{display:block;font-size:9px;font-weight:750}.selected-color>div>span{display:block;font:8px monospace;color:#a38ca9;margin-top:2px}.pattern-section{border-top:1px solid #e9dfe8;padding-top:18px}.pattern-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:12px}.pattern-picker button{background:white;border:1px solid #e1d3e1;border-radius:7px;padding:7px 4px;color:#8c6e9e;font-size:8px;font-weight:700;text-align:center}.pattern-picker button>span{display:block;font-size:20px;line-height:1.2;margin-bottom:4px}.pattern-picker button[aria-pressed=true]{background:#f4eafa;border-color:#b28aca;color:#79469d}.section-paint{margin-top:20px}.section-paint>label{display:block;font-size:10px;font-weight:800;margin-bottom:9px}.section-paint>div{display:flex;gap:8px}.section-paint select{width:100%;min-width:0;flex:1;background:#fff;border:1px solid #ddcde0;border-radius:7px;font:10px 'Segoe UI',sans-serif;color:var(--ink);padding:10px}.section-paint button{border:0;border-radius:7px;background:#8050bd;color:white;font-size:10px;font-weight:750;padding:9px 13px;white-space:nowrap}.paper-section{margin-top:20px;border-top:1px solid #e9dfe8;padding-top:18px}.papers{display:flex;gap:10px;margin-top:12px}.papers button{height:29px;width:37px;background:var(--paper);border:2px solid white;border-radius:5px;box-shadow:0 0 0 1px #e3d4e2}.papers button[aria-pressed=true]{box-shadow:0 0 0 2px #a276b9}.quiet-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;padding-top:18px;border-top:1px solid #e9dfe8}.quiet-tools button{font-size:8px;font-weight:650;color:#99819d;background:none;border:0;padding:3px 0}.quiet-tools button:hover{color:var(--purple)}.book-cues{margin-top:45px;display:grid;grid-template-columns:160px minmax(0,1fr) 190px;align-items:center;gap:35px;border:1px solid #e5d6d9;border-radius:17px;background:#fffaf4;padding:25px}.book-cues h2{font-size:30px;letter-spacing:-1.1px;line-height:1.1;font-weight:900;margin-bottom:14px}.book-cues h2>span{color:var(--purple)}.book-cues .eyebrow{font-size:7px;letter-spacing:1px;color:#a88563;margin-bottom:9px}.book-cues p:not(.eyebrow){font-size:11px;color:var(--muted);max-width:420px;line-height:1.8;margin-bottom:9px}.book-cues .fine-print{font-size:9px!important}.original-preview{border:1px solid #d7c9d9;background:white;padding:8px;border-radius:7px;transform:rotate(-4deg);box-shadow:3px 5px 0 #eadbe8;text-align:left}.original-preview>img{width:100%;height:auto;display:block}.original-preview>span{display:flex;align-items:center;justify-content:space-between;font:6px monospace;letter-spacing:.5px;color:#9f80a7;padding-top:8px}.book-cues figure{margin:0;transform:rotate(3deg);border-radius:8px;background:#fff;padding:7px;border:1px solid #e7d8cb}.book-cues figure img{display:block;width:100%;height:185px;object-fit:cover;object-position:center 30%;border-radius:3px}.book-cues figcaption{font:5.5px/1.7 monospace;letter-spacing:.1px;color:#9c7a70;padding-top:7px;text-align:center}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:35px;border-top:1px solid #e1d0d7;padding:23px 0 27px;color:var(--muted);font-size:10px}footer a{font-weight:650;color:var(--purple)}.skip{position:fixed;top:-100px;left:15px;z-index:99;background:var(--purple);color:white;padding:10px}.skip:focus{top:10px}dialog{width:min(680px,calc(100% - 30px));max-height:92dvh;border:0;border-radius:13px;padding:20px;background:#fffaf4;color:var(--ink)}dialog::backdrop{background:#342443c4;backdrop-filter:blur(4px)}dialog>div{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:15px}dialog h2{font-size:19px;line-height:1.3;margin:0;letter-spacing:-.5px}dialog button{border:1px solid #ddcce4;background:white;border-radius:5px;width:35px;height:35px;flex-shrink:0;color:var(--ink)}dialog>img{max-height:72dvh;width:100%;object-fit:contain;display:block;background:white}dialog>p{font-size:10px;text-align:center;color:var(--muted);margin:12px 0 0}.no-script{padding:20px;text-align:center}[hidden]{display:none!important}
.waking #rabbit-character{transform-origin:320px 690px;animation:happy-body 2.8s ease-in-out}.waking .left-ear{transform-origin:270px 175px;animation:ear-left 2.8s ease-in-out}.waking .right-ear{transform-origin:350px 180px;animation:ear-right 2.8s ease-in-out}.waking .left-arm{transform-origin:220px 402px;animation:friendly-wave 2.8s ease-in-out}.waking .blink-eye{transform-box:fill-box;transform-origin:center;animation:blink 2.8s ease-in-out}.waking #wake-sparks{animation:sparkle 2.8s ease-in-out}.waking .art-bottom{background:#fff0cf}@keyframes happy-body{0%,100%{transform:translateY(0) rotate(0)}20%,60%{transform:translateY(-6px) rotate(-1deg)}40%,80%{transform:translateY(-2px) rotate(1deg)}}@keyframes ear-left{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-9deg)}40%,80%{transform:rotate(4deg)}}@keyframes ear-right{0%,100%{transform:rotate(0)}25%,65%{transform:rotate(7deg)}45%,85%{transform:rotate(-4deg)}}@keyframes friendly-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(7deg)}40%,80%{transform:rotate(-5deg)}}@keyframes blink{0%,18%,24%,58%,64%,100%{transform:scaleY(1)}21%,61%{transform:scaleY(.08)}}@keyframes sparkle{0%,100%{opacity:0}20%,70%{opacity:1}}.motion-paused *,.motion-paused *::before,.motion-paused *::after{animation:none!important;transition:none!important}.motion-paused .waking #wake-sparks{opacity:1}
@media(min-width:1500px){.art-frame{max-height:780px}.paint-panel{padding:30px}.swatches{gap:11px}}
@media(max-width:1100px){.app-wrap{width:calc(100% - 50px)}.studio{grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:20px}.paint-panel{padding:22px 20px}.swatches{gap:8px}.swatch-heading>span{font-size:6px;letter-spacing:.4px}.palette-picker button{padding:9px 8px;font-size:9px;gap:6px}.mini-palette i{width:11px;height:11px}.art-toolbar{padding:12px 14px}.history-controls>span{font-size:8px}.art-bottom{padding-inline:17px}.art-bottom p{font-size:11px}.wake-button{padding:9px 14px;font-size:11px;gap:10px}.book-cues{grid-template-columns:140px minmax(0,1fr) 150px;gap:25px}.book-cues figure img{height:160px}.book-cues h2{font-size:27px}.intro-row .eyebrow>span{display:table;margin:7px 0 0}.intro-row{align-items:center}}
@media(max-width:800px){.app-wrap{width:calc(100% - 34px)}.lab-header{height:80px}.brand{font-size:23px}.brand>span:first-child{font-size:32px}.lab-header nav{font-size:9px;gap:17px}.intro-row{padding:28px 0 25px;gap:20px}h1{font-size:43px;letter-spacing:-2px;max-width:460px}.intro{font-size:12px;max-width:370px}.intro-row .eyebrow{font-size:7px;letter-spacing:1px}.intro-row .eyebrow>span{font-size:6px}.save-button{font-size:10px;padding:11px 13px;gap:10px}.save-button small{font-size:7px}.studio{grid-template-columns:minmax(0,1.2fr) minmax(270px,1fr);gap:15px}.paint-panel{padding:20px 17px}.panel-heading h2{font-size:24px}.history-controls>span{display:none}.art-toolbar{padding:10px 12px}.zoom-controls{gap:5px}.art-toolbar button{width:27px;height:27px}.art-bottom{flex-direction:column;align-items:stretch;text-align:center;gap:12px;padding:15px 12px 10px}.wake-button{justify-content:center;align-self:center;min-width:150px}.art-bottom p{font-size:10px}.art-bottom .eyebrow{font-size:7px}.status{font-size:9px;padding:0 12px 15px}.swatches{gap:8px;grid-template-columns:repeat(6,1fr)}.selected-color{padding:9px}.selected-color label{font-size:8px}.selected-color strong{font-size:8px}.selected-color>div>span{font-size:7px}.swatch-heading>span{font-size:6px}.pattern-picker{gap:5px}.section-paint button{font-size:9px;padding-inline:10px}.book-cues{grid-template-columns:120px minmax(0,1fr);gap:25px;padding:22px}.book-cues figure{display:none}.book-cues p:not(.eyebrow){font-size:10px}.book-cues h2{font-size:26px}.book-cues .eyebrow{font-size:6px}}
@media(max-width:620px){.lab-header nav a:first-child{display:none}.studio{grid-template-columns:1fr}.intro-row{align-items:start;gap:15px}.intro-row>div{max-width:65%}h1{font-size:35px;letter-spacing:-1.7px}.intro{font-size:11px;line-height:1.8}.intro-row .eyebrow{font-size:6px;letter-spacing:.8px;max-width:240px}.save-button{font-size:9px;padding:12px 10px;gap:7px;margin-top:37px}.save-button small{display:none}.save-button>span{font-size:17px}.paint-panel{padding:23px}.panel-heading h2{font-size:28px}.swatches{grid-template-columns:repeat(8,1fr);gap:11px}.swatches button{max-height:42px}.swatch-heading>span{font-size:7px}.palette-picker{gap:9px}.palette-picker button{font-size:11px;padding:11px;gap:12px}.mini-palette i{width:14px;height:14px}.try-palette{font-size:10px}.selected-color{padding:11px}.selected-color label{font-size:10px}.selected-color strong{font-size:10px}.selected-color>div>span{font-size:8px}.pattern-picker button{font-size:9px;padding:9px 5px}.pattern-picker button>span{font-size:23px}.section-paint>label,.pattern-section h3,.paper-section h3,.swatch-heading h3{font-size:12px}.section-paint select{font-size:11px;padding:12px}.section-paint button{font-size:10px;padding-inline:17px}.quiet-tools button{font-size:9px}.papers{gap:12px}.papers button{width:42px;height:33px}.art-frame{max-height:600px}.art-bottom{flex-direction:row;align-items:center;text-align:left;padding:17px 20px 12px}.art-bottom p{font-size:11px}.wake-button{font-size:12px;min-width:0;gap:15px;padding:10px 17px}.history-controls>span{display:inline;font-size:9px}.art-toolbar{padding:12px 17px}.art-toolbar button{width:29px;height:29px}.book-cues{margin-top:25px;padding:20px;gap:20px;grid-template-columns:100px minmax(0,1fr)}.book-cues h2{font-size:23px}.book-cues p:not(.eyebrow){font-size:9px}.book-cues .fine-print{font-size:8px!important}.book-cues .eyebrow{font-size:5.5px;letter-spacing:.6px}.original-preview{padding:5px}.original-preview>span{font-size:5px;letter-spacing:0}.status{padding-inline:17px;font-size:9px}footer{flex-direction:column;gap:8px;font-size:9px;margin-top:25px;padding-block:20px}}
@media(max-width:370px){.app-wrap{width:calc(100% - 24px)}.lab-header{gap:10px}.brand{font-size:21px}.brand>span:first-child{font-size:28px}.lab-header nav{font-size:8px}h1{font-size:31px}.intro-row{gap:10px}.save-button{font-size:8px;padding:10px 8px;gap:6px}.intro-row .eyebrow{font-size:5.6px}.intro{font-size:10px}.paint-panel{padding:20px}.swatches{gap:9px}.swatch-heading>span{font-size:6px}.pattern-picker button{font-size:8px}.art-bottom{padding:15px 14px 10px;gap:9px}.art-bottom .eyebrow{font-size:6px}.art-bottom p{font-size:9px}.wake-button{font-size:10px;padding:9px 12px;gap:10px}.history-controls>span{font-size:7px}.art-toolbar{padding:10px 12px}.art-toolbar button{width:26px;height:26px}.zoom-controls{gap:4px}.book-cues{grid-template-columns:86px minmax(0,1fr);gap:15px;padding:17px}.book-cues h2{font-size:21px}.quiet-tools button{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.waking #wake-sparks{opacity:1}}
.mobile-paint-dock{display:none}
@media(max-width:620px){body{padding-bottom:76px}.mobile-paint-dock{position:fixed;z-index:20;bottom:0;left:0;right:0;display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fffaf3f5;border-top:1px solid #dbc6dd;box-shadow:0 -4px 20px #633b510c;backdrop-filter:blur(8px)}.mobile-paint-dock>span{font:700 7px monospace;letter-spacing:1px;color:#a78aaf}.mobile-paint-dock>div{display:flex;flex:1;gap:9px;overflow-x:auto;padding:3px;scrollbar-width:none}.mobile-paint-dock>div::-webkit-scrollbar{display:none}.mobile-paint-dock button{border:2px solid white;box-shadow:0 0 0 1px #e3d3df;background:var(--swatch);width:40px;height:40px;flex-shrink:0;border-radius:50%;position:relative}.mobile-paint-dock button[aria-pressed=true]{box-shadow:0 0 0 2px #71458f}.mobile-paint-dock button[aria-pressed=true]::after{content:'✓';color:white;font-size:15px;text-shadow:0 1px 3px #0008}.mobile-paint-dock>a{font:700 6px/1.7 monospace;letter-spacing:.4px;text-align:center;color:#895d9b;white-space:nowrap;flex-shrink:0}}
/* Five characters, with independent artwork and coloring sessions. */
.character-picker{padding:19px 20px 15px;border-bottom:1px solid #eadce4;background:#fffaf7}.character-navigation{display:grid;grid-template-columns:43px 1fr 43px;align-items:center;gap:15px}.character-navigation>button{width:43px;height:43px;border-radius:50%;border:1px solid #dbc5e5;background:#f4e7fa;color:#81539f;font-size:22px;line-height:1;transition:background .15s,transform .15s}.character-navigation>button:hover{background:#e8d5f3;transform:translateY(-2px)}.character-navigation>div{text-align:center}.character-navigation .eyebrow{font-size:7px;letter-spacing:1.1px;color:#ac8ab1;margin:0 0 4px}.character-navigation .eyebrow>span{margin-left:7px;color:#80618e;font-family:monospace}.character-navigation h2{font-size:25px;letter-spacing:-.7px;line-height:1.1;margin:0;font-weight:850}.character-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-top:15px}.character-choices button{background:white;border:1px solid #e4d4e6;border-radius:6px;font-size:9px;color:#a285ab;padding:8px 3px;white-space:nowrap}.character-choices button[aria-pressed=true]{background:#8050bd;color:#fff;border-color:#8050bd;font-weight:700}.save-button>#save-label{font-size:inherit;line-height:inherit}.waking .soft-wiggle{animation:soft-wiggle 2.8s ease-in-out}.waking .wing-wiggle{animation:wing-wiggle 2.8s ease-in-out}.waking .tentacle-wiggle{animation:tentacle-wave 2.8s ease-in-out}.waking .tentacle-wiggle:nth-child(even){animation-direction:reverse}@keyframes soft-wiggle{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-3deg)}40%,80%{transform:rotate(3deg)}}@keyframes wing-wiggle{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-4deg)}40%,80%{transform:rotate(3deg)}}@keyframes tentacle-wave{0%,100%{transform:rotate(0)}25%,65%{transform:rotate(-3deg)}45%,85%{transform:rotate(3deg)}}
@media(max-width:800px){.character-picker{padding:17px 14px 13px}.character-navigation{gap:10px}.character-navigation h2{font-size:23px}.character-choices{gap:5px}.character-choices button{font-size:8px;padding:8px 2px}}
@media(max-width:370px){.character-picker{padding-inline:12px}.character-navigation{grid-template-columns:41px 1fr 41px;gap:7px}.character-navigation>button{width:41px;height:41px}.character-navigation .eyebrow{font-size:6px;letter-spacing:.6px}.character-navigation h2{font-size:22px}.character-choices{gap:4px}.character-choices button{font-size:7px;padding:8px 1px}}
@media(prefers-reduced-motion:reduce){.waking .soft-wiggle,.waking .wing-wiggle,.waking .tentacle-wiggle{animation:none!important}}