/* Actual ImageGen artwork, exported from design-skin-v15. Live content sits on it. */
body{display:block;background:#eaf0e4;color:#153e55}
#game.game{position:relative;display:block;width:100%;max-width:1920px;height:max(100svh,clamp(1130px,86vw,1440px));min-height:0;aspect-ratio:auto;margin:0 auto;padding:0;container-type:inline-size;animation:none;background:url('assets/skin-v15-desktop.webp') center/100% 100% no-repeat}
#game .app-header{position:absolute;inset:1.2% 10% auto;height:15%;display:flex;align-items:center;justify-content:space-between;padding:0}
#game .mobile-brand{position:static;display:block;width:clamp(165px,19cqw,275px);height:100%;min-height:0;max-height:none;padding:0;margin:0;aspect-ratio:auto;background:url('assets/catalog-v11-logo-alpha.webp') center/contain no-repeat;border:0;border-radius:0;mask-image:none;filter:drop-shadow(0 3px 3px #ffffffb0)}
#game .parents.nav-sprite{position:static;display:flex;align-items:center;justify-content:center;gap:8px;width:154px;height:52px;min-height:44px;max-height:none;margin:0;padding:0 15px;border:0;border-radius:24px;box-shadow:none;background:transparent url('assets/skin-v15-button-navy.webp') center/100% 100% no-repeat;color:#fff7de;font:700 14px Georgia,serif;filter:none}
#game .ui-icon{display:inline-block;width:22px;height:22px;flex-shrink:0;fill:currentColor;vertical-align:middle;pointer-events:none}
#game .sketchbook{position:absolute;inset:19.4% 11% 10.7%;display:flex;flex-direction:column;padding:0;margin:0;border:0;border-radius:0;background:none;box-shadow:none;color:#173f5b}
#game .sketchbook::before{content:none}
#game .catalog-toolbar{display:flex;flex:0 0 53px;align-items:center;justify-content:space-between;gap:18px;margin:0;padding:0;border:0}
#game .categories{position:static;display:flex;flex:0 1 660px;flex-direction:row;width:auto;height:53px;gap:0;margin:0;padding:5px 6px;border:0;border-radius:0;background:url('assets/skin-v15-tabs.webp') center/100% 100% no-repeat;box-shadow:none}
#game .categories .nav-sprite{position:relative;display:flex;align-items:center;justify-content:center;flex:1;gap:8px;width:auto;height:43px;min-height:43px;max-height:none;aspect-ratio:auto;margin:0;padding:4px 10px;border:0;border-radius:0;background:none;color:#41657c;box-shadow:none;filter:none;font:700 clamp(12px,1.12cqw,16px) Georgia,serif;transition:filter .15s}
#game .categories .nav-sprite::after{content:'';position:absolute;right:0;top:30%;bottom:30%;border-right:1px solid #d7c7a5}
#game .categories .nav-sprite:last-child::after,#game .categories .nav-sprite.active::after{display:none}
#game .categories .nav-sprite.active{background:transparent url('assets/skin-v15-button-blue.webp') center/100% 100% no-repeat;color:#fff9e3;box-shadow:none}
#game .categories .nav-sprite.active .ui-icon{color:#ffe199}
#game .categories .nav-sprite:hover,#game .parents:hover{filter:brightness(1.07);box-shadow:none}
#game #my-colors{position:static;display:flex;align-items:center;justify-content:center;flex-shrink:0;gap:8px;width:184px;height:51px;min-height:44px;margin:0;padding:8px 12px;border:0;border-radius:0;background:transparent url('assets/skin-v15-button-gold.webp') center/100% 100% no-repeat;color:#785322;outline:none;box-shadow:none}
#game #my-colors .progress-title{font:700 13px Georgia,serif}
#game #my-colors .ui-icon{width:18px;height:18px}
#game #my-colors .collection-track{display:none}
#game #collection-count{display:grid;place-items:center;position:static;visibility:visible;opacity:1;width:25px;height:25px;border-radius:50%;background:#f2d183;color:#714713;font:700 13px 'Trebuchet MS',sans-serif;text-shadow:none}
#game #my-colors[aria-pressed=true]{background-image:url('assets/skin-v15-button-blue.webp');color:#fff9df}
#game .catalog,#game .catalog.filtered{position:static;display:flex;flex:1;flex-direction:column;min-height:0;width:100%;height:auto;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
#game .catalog-title{display:flex;align-items:center;justify-content:space-between;flex:0 0 77px;gap:10px;margin:0;padding:6px 10px 8px}
#game .catalog-heading{min-width:0}
#game .catalog-title h2{margin:0;color:#123e5f;font:700 clamp(23px,2.45cqw,38px)/1.18 Georgia,serif;letter-spacing:-.6px}
#game .catalog-title h2::before{content:'✦';color:#c3973c;font-size:.8em;margin-right:9px}
#game .catalog-subtitle{margin:4px 0 0 31px;color:#687e84;font:13px/1.2 'Trebuchet MS',sans-serif}
#game .catalog-title #catalog-count{flex-shrink:0;align-self:end;margin:0 2px 8px;padding:0;border:0;background:none;color:#738182;font:700 12px 'Trebuchet MS',sans-serif}
#game .grid,#game .catalog.filtered .grid{position:static;display:grid;flex:1;min-height:0;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));grid-auto-rows:auto;align-content:start;gap:12px}
#game .art-card,#game .catalog:not(.filtered) .art-card{position:relative;display:flex;flex-direction:column;width:100%;height:100%;min-height:0;max-height:none;aspect-ratio:auto;margin:0;padding:11px 13px 10px;border:0 solid transparent;border-image:url('assets/skin-v15-card.webp') 125 fill / 33px stretch;border-radius:0;background:none;overflow:visible;isolation:isolate;box-shadow:none;transition:transform .15s,filter .15s}
#game .art-card:hover{transform:translateY(-2px);filter:brightness(1.025);box-shadow:none}
#game .card-art,#game .card-art.saved-preview,#game .card-art:not(.saved-preview):not(:has(img[src$='-thumb.webp'])){position:relative;inset:auto;display:block;flex:1;min-height:0;width:100%;height:auto;aspect-ratio:auto;overflow:hidden;border-radius:0;background:transparent;isolation:isolate}
#game .card-art img,#game .art-card .card-art img{position:static;display:block;width:100%;height:100%;object-fit:contain;object-position:center;mix-blend-mode:multiply}
#game .art-card .card-art img.saved-paint{position:absolute;inset:0;mix-blend-mode:multiply}
#game .card-art,#game .card-art.saved-preview{isolation:auto}
#game .card-caption{display:flex;align-items:center;justify-content:space-between;flex:0 0 36px;gap:5px;min-height:0;width:100%;margin:0;padding:5px 0 0;border:0;background:none}
#game .card-name{position:static;display:block;width:auto;height:auto;padding:0;background:none;color:#163e5a;font:700 clamp(12px,1.32cqw,20px)/1.1 Georgia,serif;text-align:left;white-space:normal}
#game .card-action{display:flex;align-items:center;justify-content:center;gap:4px;flex-shrink:0;min-width:89px;height:32px;padding:0 10px;background:url('assets/skin-v15-button-light.webp') center/100% 100% no-repeat;color:#16466a;font:700 11px Georgia,serif;white-space:nowrap}
#game .in-progress .card-action{background-image:url('assets/skin-v15-button-blue.webp');color:#fff9df}
#game .card-action span{font:700 19px/1 Georgia,serif;margin:0}
#game .card-progress{position:absolute;left:13px;right:13px;bottom:45px;width:auto;height:5px;padding:0;border:0;border-radius:4px;background:#d7dfd7;overflow:hidden}
#game .card-progress>span{display:block;width:var(--progress);height:100%;border-radius:4px;background:linear-gradient(90deg,#04bdd2,#66ebc9)}
#game .art-card:not(.in-progress) .card-progress{visibility:hidden}
#game .card-percent{position:absolute;top:12px;right:13px;padding:5px 8px;border:1px solid #ece2c9;border-radius:15px;background:#fffdf7f2;color:#255570;box-shadow:0 2px 8px #7b643016;font:700 11px 'Trebuchet MS',sans-serif}
#game .complete .card-percent{color:#317458;background:#e9f9ed}
#game .pager{position:static;display:flex;visibility:visible;align-items:center;justify-content:center;flex:0 0 55px;gap:18px;width:100%;height:55px;margin:6px 0 0;padding:0}
#game .pager button,#game .pager #next{position:static;display:block;width:84px;min-width:64px;height:45px;min-height:44px;aspect-ratio:auto;margin:0;padding:0;border:0;border-radius:0;background:transparent url('assets/skin-v15-button-blue.webp') center/100% 100% no-repeat;color:#fff5d6;font:700 19px Georgia,serif;box-shadow:none}
#game .pager button:disabled{opacity:.3;filter:saturate(.25);box-shadow:none}
#game .pager span,#game[data-pages='1'] #page-count{position:static;display:block;flex:0 0 auto;width:auto;margin:0;padding:0;opacity:1;border:0;background:none;color:#3b6574;font:700 15px 'Trebuchet MS',sans-serif}
#game[data-pages='1'] .pager{display:flex;visibility:hidden;pointer-events:none}
#game #empty{flex:1;padding:60px 15px;text-align:center;color:#315a68;font:15px 'Trebuchet MS',sans-serif}
#game #empty p{color:#647a80}
#game button:focus-visible{outline:3px solid #087eae;outline-offset:2px;border-radius:12px}
#game .categories .nav-sprite:focus-visible{outline:2px solid #087eae;outline-offset:1px;border-radius:24px}
#game .categories .nav-sprite{min-height:44px;height:44px}
@media(max-width:900px){
 #game.game{width:100%;max-width:900px;height:auto;min-height:max(720px,210.76vw);aspect-ratio:auto;background-image:url('assets/skin-v15-mobile.webp')}
 #game .app-header{inset:1.1% 7.7% auto;height:13.5%}
 #game .mobile-brand{width:47%;max-width:260px;height:100%;padding:0}
 #game .parents.nav-sprite{gap:4px;width:clamp(98px,25vw,150px);height:45px;min-height:44px;font-size:clamp(11px,2.6vw,15px);padding:5px 10px;transform:translateY(-8px)}
 #game .parents .ui-icon{width:17px;height:17px}
 #game .sketchbook{inset:17.1% 9.1% 9.1%;padding:0;border-radius:0;box-shadow:none}
 #game .catalog-toolbar{display:flex;flex-wrap:wrap;flex:0 0 auto;gap:4px;min-height:49px;margin:0;padding:0}
 #game .categories{flex:0 0 100%;width:100%;height:49px;padding:3px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
 #game .categories .nav-sprite{flex-direction:column;gap:2px;width:100%;height:44px;min-height:44px;padding:3px 1px;font-size:clamp(10px,2.75vw,16px);border-radius:0}
 #game .categories .ui-icon{width:18px;height:18px}
 #game #my-colors{position:absolute;right:0;top:-8.5%;width:142px;height:44px;min-height:44px;margin:0;gap:5px;padding:5px 11px}
 #game #my-colors .progress-title{font-size:11px}#game #collection-count{width:21px;height:21px;font-size:11px}
 #game .catalog-title{flex:0 0 49px;align-items:center;gap:4px;margin:0;padding:6px 1px 10px}
 #game .catalog-title h2{font-size:clamp(21px,5.45vw,35px);letter-spacing:-.5px}
 #game .catalog-title h2::before{display:none}
 #game .catalog-subtitle{display:none}
 #game .catalog-title #catalog-count{font-size:clamp(9px,2.2vw,12px);margin:0;align-self:center}
 #game .grid,#game .catalog.filtered .grid{gap:7px}
 #game .art-card,#game .catalog:not(.filtered) .art-card{padding:8px 5px 8px;border-image-width:20px;border-radius:0}
 #game .card-art{aspect-ratio:auto;height:auto}
 #game .card-caption{flex:0 0 43px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-height:0;padding:4px 0 0}
 #game .card-name{font-family:'Trebuchet MS',sans-serif;font-size:clamp(10px,2.6vw,17px);line-height:1.05;text-align:center;white-space:nowrap}
 #game .card-action{min-width:0;width:90%;height:23px;max-width:120px;flex-shrink:0;padding:0 3px;font-size:clamp(9px,2.3vw,14px);gap:2px}
 #game .card-action span{font-size:14px}
 #game .card-percent{top:7px;right:6px;padding:3px 5px;font-size:9px;border-radius:10px}
 #game .card-progress{left:7px;right:7px;bottom:52px;height:3px}
 #game .pager{flex:0 0 53px;height:53px;gap:22px;margin-top:6px}
 #game .pager button,#game .pager #next{width:74px;height:44px;min-height:44px}
 #game .pager span{font-size:14px}
}
@media(min-width:551px) and (max-width:900px){
 #game.game{min-height:max(980px,155vw)}
 #game .sketchbook{inset:17.1% 9.1% 9.1%}
 #game .catalog-toolbar{flex-wrap:nowrap;gap:8px;min-height:58px}
 #game .categories{flex:1;min-width:0}
 #game .categories .nav-sprite{font-size:12px;flex-direction:row;gap:4px}
 #game #my-colors{position:static;width:145px}
 #game .catalog-title{flex-basis:70px}
 #game .card-caption{flex-basis:57px}
 #game .card-action{height:30px;font-size:13px}
 #game .card-progress{bottom:66px}
}
@media(max-width:350px){
 #game .sketchbook{left:8.7%;right:8.7%}
 #game .catalog-title h2{font-size:19px}
 #game .catalog-title #catalog-count{font-size:8px}
 #game .grid,#game .catalog.filtered .grid{gap:4px}
 #game .card-name{font-size:9px}
 #game .card-action{font-size:8.5px;width:96%}
}
@media(prefers-reduced-motion:reduce){#game .art-card{transition:none}}