/* Paper dreams: stable controls, stepped frames and gentle shared motion. */
:root{--dream-duration:5.6s;--dream-ease:cubic-bezier(.42,0,.58,1);--dream-ink:#9475ac;--dream-pink:#bd8bb2;--dream-mint:#98b8ba;--frame-lavender:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23d0bddc%22%20d%3D%22M6%200H18V2H22V6H24V18H22V22H18V24H6V22H2V18H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23b19ac5%22%20d%3D%22M6%200H18V2H22V6H24V17H22V21H18V23H6V21H2V17H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23f7f0fd%22%20d%3D%22M6%202H18V4H20V6H22V17H20V19H18V21H6V19H4V17H2V6H4V4H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fffafc%22%20fill-opacity%3D%22.75%22%20d%3D%22M6%202H18V3H6ZM4%204H6V5H4ZM2%206H3V17H2Z%22%2F%3E%3C%2Fsvg%3E");--frame-mint:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23c7ddd0%22%20d%3D%22M6%200H18V2H22V6H24V18H22V22H18V24H6V22H2V18H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%239ebaac%22%20d%3D%22M6%200H18V2H22V6H24V17H22V21H18V23H6V21H2V17H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23e8f4ee%22%20d%3D%22M6%202H18V4H20V6H22V17H20V19H18V21H6V19H4V17H2V6H4V4H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fffafc%22%20fill-opacity%3D%22.75%22%20d%3D%22M6%202H18V3H6ZM4%204H6V5H4ZM2%206H3V17H2Z%22%2F%3E%3C%2Fsvg%3E");--frame-pink:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23e1c2d5%22%20d%3D%22M6%200H18V2H22V6H24V18H22V22H18V24H6V22H2V18H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23c3a1b9%22%20d%3D%22M6%200H18V2H22V6H24V17H22V21H18V23H6V21H2V17H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fae8f1%22%20d%3D%22M6%202H18V4H20V6H22V17H20V19H18V21H6V19H4V17H2V6H4V4H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fffafc%22%20fill-opacity%3D%22.75%22%20d%3D%22M6%202H18V3H6ZM4%204H6V5H4ZM2%206H3V17H2Z%22%2F%3E%3C%2Fsvg%3E");--frame-peach:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23e3cac0%22%20d%3D%22M6%200H18V2H22V6H24V18H22V22H18V24H6V22H2V18H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23c8aaa6%22%20d%3D%22M6%200H18V2H22V6H24V17H22V21H18V23H6V21H2V17H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fff0e4%22%20d%3D%22M6%202H18V4H20V6H22V17H20V19H18V21H6V19H4V17H2V6H4V4H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fffafc%22%20fill-opacity%3D%22.75%22%20d%3D%22M6%202H18V3H6ZM4%204H6V5H4ZM2%206H3V17H2Z%22%2F%3E%3C%2Fsvg%3E");--frame-cream:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23e5d6de%22%20d%3D%22M6%200H18V2H22V6H24V18H22V22H18V24H6V22H2V18H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23bda8c3%22%20d%3D%22M6%200H18V2H22V6H24V17H22V21H18V23H6V21H2V17H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fff9ee%22%20d%3D%22M6%202H18V4H20V6H22V17H20V19H18V21H6V19H4V17H2V6H4V4H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fffafc%22%20fill-opacity%3D%22.75%22%20d%3D%22M6%202H18V3H6ZM4%204H6V5H4ZM2%206H3V17H2Z%22%2F%3E%3C%2Fsvg%3E");--frame-selected:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23bea4d0%22%20d%3D%22M6%200H18V2H22V6H24V18H22V22H18V24H6V22H2V18H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%239473aa%22%20d%3D%22M6%200H18V2H22V6H24V17H22V21H18V23H6V21H2V17H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23e8dcf4%22%20d%3D%22M6%202H18V4H20V6H22V17H20V19H18V21H6V19H4V17H2V6H4V4H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fffafc%22%20fill-opacity%3D%22.75%22%20d%3D%22M6%202H18V3H6ZM4%204H6V5H4ZM2%206H3V17H2Z%22%2F%3E%3C%2Fsvg%3E");--frame-guided:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23bbd7c7%22%20d%3D%22M6%200H18V2H22V6H24V18H22V22H18V24H6V22H2V18H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%2389ad99%22%20d%3D%22M6%200H18V2H22V6H24V17H22V21H18V23H6V21H2V17H0V6H2V2H6Z%22%2F%3E%3Cpath%20fill%3D%22%23d9eee2%22%20d%3D%22M6%202H18V4H20V6H22V17H20V19H18V21H6V19H4V17H2V6H4V4H6Z%22%2F%3E%3Cpath%20fill%3D%22%23fffafc%22%20fill-opacity%3D%22.75%22%20d%3D%22M6%202H18V3H6ZM4%204H6V5H4ZM2%206H3V17H2Z%22%2F%3E%3C%2Fsvg%3E");}
body.pixel-dream{background-color:#f7edf8;background-image:radial-gradient(ellipse at 12% 18%,#f9dfed88,transparent 48%),radial-gradient(ellipse at 88% 72%,#dcefeaaa,transparent 50%),repeating-linear-gradient(0deg,transparent 0 31px,#c8b5d412 31px 32px),repeating-linear-gradient(90deg,transparent 0 31px,#c8b5d412 31px 32px);--dream-frame:var(--frame-lavender)}
/* Filled nine-slice borders keep real stepped corners without clipping controls or focus rings. */
body.pixel-dream :is(.panel,.game-window,#gallery,#paw-editor){border:4px solid transparent;border-image-source:var(--dream-frame);border-image-slice:8 fill;border-image-width:8px;border-image-repeat:stretch;background:transparent;box-shadow:none}
body.pixel-dream .panel{padding:18px}
body.pixel-dream .fold-panel{--dream-frame:var(--frame-peach)}
body.pixel-dream .paper-panel{--dream-frame:var(--frame-mint)}
body.pixel-dream .paw-wardrobe,body.pixel-dream #paw-editor{--dream-frame:var(--frame-pink)}
body.pixel-dream :is(.mode-switch button,.primary,.next-model,.model-choice button,.orientation-choice button,.guided-style-buttons button,.create-style,.effect-switch,#free-mode,.gallery-heading button,.view-tools button,.site-header .quiet,.paw-choice button,.model-card,.saved-paw-style,.custom-preview-wrap,.guided-style,.custom-extras,.custom-field input,.custom-field select){border:3px solid transparent;border-image-source:var(--dream-frame);border-image-slice:8 fill;border-image-width:6px;border-image-repeat:stretch;background:transparent;box-shadow:none}
body.pixel-dream button,body.pixel-dream :is(.custom-field input,.custom-field select){--dream-frame:var(--frame-cream)}
body.pixel-dream :is(.primary,.create-style,#free-mode){--dream-frame:var(--frame-selected)}
body.pixel-dream :is(.guided-style,.custom-extras,.custom-preview-wrap){--dream-frame:var(--frame-mint)}
body.pixel-dream .mode-switch button{--dream-frame:var(--frame-lavender);gap:10px;padding:12px 10px;align-items:center;transition:color .25s ease}
body.pixel-dream .mode-switch button[data-mode=guided]{--dream-frame:var(--frame-mint)}
body.pixel-dream .mode-switch button[data-mode=interactive]{--dream-frame:var(--frame-pink)}
body.pixel-dream :is(.mode-switch button,.orientation-choice button,.guided-style-buttons button,.paw-choice button,.effect-switch,.model-choice button)[aria-pressed=true]{--dream-frame:var(--frame-selected)}
body.pixel-dream .mode-switch button[data-mode=guided][aria-pressed=true]{--dream-frame:var(--frame-guided)}
body.pixel-dream :is(.mode-switch button,.orientation-choice button,.guided-style-buttons button,.paw-choice button,.model-card):hover:not(:disabled){--dream-frame:var(--frame-selected)}
body.pixel-dream .model-card:nth-child(3n + 2){--dream-frame:var(--frame-mint)}
body.pixel-dream .model-card:nth-child(3n){--dream-frame:var(--frame-peach)}
body.pixel-dream .model-card:hover:not(:disabled){--dream-frame:var(--frame-selected)}
body.pixel-dream .paw-choice button{padding-top:3px}
body.pixel-dream .paw-preview{margin:0 2px 9px}
body.pixel-dream .guided-style legend,body.pixel-dream .custom-extras legend{background:#e8f4ee;padding:0 6px}
body.pixel-dream .swatch{clip-path:polygon(4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,100% 2px,100% calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),0 calc(100% - 2px),0 2px,4px 2px)}
body.pixel-dream .swatch:focus-visible{outline-offset:-5px}
body.pixel-dream .window-bar{background:linear-gradient(90deg,#e2d4f0,#efdeef 55%,#dbebe5);border-bottom:3px double #b8a2c9;padding-top:10px;padding-bottom:10px}
body.pixel-dream .below{border-top:3px double #c2afd0;background:#f8f0fc}
body.pixel-dream .stage-hint{border:2px solid #c3d9ce;box-shadow:2px 0 #c3d9ce,-2px 0 #c3d9ce,0 2px #c3d9ce,0 -2px #c3d9ce;background:#f8fff3f2}
body.pixel-dream .section-title #count{box-shadow:2px 0 #e4bfb5,-2px 0 #e4bfb5,0 2px #e4bfb5,0 -2px #e4bfb5}
body.pixel-dream .corner{width:12px;height:12px;border-width:3px;opacity:.65;z-index:2}
body.pixel-dream .c1{border-right:0;border-bottom:0}body.pixel-dream .c2{border-left:0;border-bottom:0}body.pixel-dream .c3{border-right:0;border-top:0}body.pixel-dream .c4{border-left:0;border-top:0}
/* The board and its pointer coordinates never move. Only these decorative layers breathe. */
#stage::before,#stage::after{content:"";position:absolute;inset:0;pointer-events:none}
#stage::before{z-index:0;background:radial-gradient(ellipse at 16% 24%,#e7c8ed88,transparent 55%),radial-gradient(ellipse at 84% 77%,#fff1c780,transparent 54%);animation:dream-breathe 7.8s var(--dream-ease) infinite;transform-origin:center}
#paper{position:relative;z-index:1}
.stage-label{z-index:2}
#stage::after{z-index:2;opacity:0;background:linear-gradient(90deg,transparent 0 12%,#c5abd0aa 12% 30%,transparent 30% 63%,#b3d0c5aa 63% 86%,transparent 86%),linear-gradient(90deg,transparent 0 30%,#e7bbd6aa 30% 44%,transparent 44% 77%,#d8c39aaa 77% 91%,transparent 91%);background-size:100% 3px,100% 2px;background-position:0 28%,0 73%;background-repeat:no-repeat;animation:dream-glitch 23s linear infinite}
#stage.guided-folding::after,#stage.busy::after{animation:none;opacity:0}
.window-pixels{animation:frame-breathe 7.8s var(--dream-ease) infinite}
.brand-stars{animation:star-drift 7.8s var(--dream-ease) infinite}
@keyframes dream-breathe{0%,100%{opacity:.28;transform:translateY(2px) scale(1)}50%{opacity:.72;transform:translateY(-3px) scale(1.025)}}
@keyframes frame-breathe{0%,100%{opacity:.5;filter:brightness(1)}50%{opacity:1;filter:brightness(1.13)}}
@keyframes star-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes dream-glitch{0%,77%,79%,100%{opacity:0;transform:translateX(0)}77.3%,77.7%{opacity:.16;transform:translateX(2px)}78%,78.5%{opacity:.08;transform:translateX(-2px)}}
/* One illustrated icon family, one rhythm, one shared four-point spark. */
body.pixel-dream .mode-switch button[data-mode] .mode-icon{position:relative;display:block;flex:0 0 40px;width:40px;height:44px;pointer-events:none;color:var(--dream-ink)}
.dream-icon-art{display:block;width:40px;height:44px;overflow:visible;animation:icon-breathe var(--dream-duration) var(--dream-ease) infinite}
.dream-line{fill:none;stroke:var(--dream-ink);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.dream-star{fill:var(--dream-ink);stroke:none}
.dream-dust .dream-star{fill:var(--dream-ink)}
.dream-dust.tone-1 .dream-star{fill:var(--dream-pink)}
.dream-dust.tone-2 .dream-star{fill:var(--dream-mint)}
.dream-paw{fill:#c6afd8;stroke:var(--dream-ink);stroke-width:1.35;stroke-linejoin:round;stroke-linecap:round}
.dream-paw ellipse{fill:#d9c6e7}
.dream-still{display:none}
@keyframes icon-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}
@media(max-width:560px){body.pixel-dream .panel{padding:15px}body.pixel-dream .mode-switch button{padding:10px;gap:10px}.mode-switch small{font-size:12px}body.pixel-dream .stage-hint{left:14px;right:14px}}
@media(prefers-reduced-motion:reduce){#stage::before,#stage::after,.window-pixels,.brand-stars,.dream-icon-art{animation:none;transform:none}#stage::before{opacity:.28}#stage::after{display:none}.dream-motion{display:none}.dream-still{display:inline}}
body.pixel-dream :is(.panel,.game-window){position:relative}
body.pixel-dream :is(.panel,.game-window)::after{content:"";position:absolute;inset:3px;pointer-events:none;background:linear-gradient(#fffaff,#fffaff) left 9px top 0/28px 2px no-repeat,linear-gradient(#fffaff,#fffaff) right 0 bottom 9px/2px 25px no-repeat;animation:frame-breathe 7.8s var(--dream-ease) infinite;opacity:.5}
#stage::after{animation-delay:-10s}
.window-bar>span:first-child{animation:dream-type-glitch 23s linear -10s infinite}
@keyframes dream-type-glitch{0%,77%,79%,100%{text-shadow:none}77.3%,77.7%{text-shadow:1px 0 #b38ca4aa,-1px 0 #83aa9c88}78%,78.5%{text-shadow:-1px 0 #b38ca466,1px 0 #83aa9c66}}
@media(prefers-reduced-motion:reduce){body.pixel-dream :is(.panel,.game-window)::after,.window-bar>span:first-child{animation:none;text-shadow:none}}
