/* skyvison Kids — illustrated desktop/tablet/mobile studio. Replaces the approximation. */
:root{--sky:#91d9ff;--blue:#168cf3;--ink:#17375e;--edge:#dce5ef;--shadow:0 5px 14px #2a689328}
*{box-sizing:border-box}
body.aqua-studio{margin:0;min-height:100dvh;background:#aeeb9d;color:var(--ink);font-family:ui-rounded,"Trebuchet MS",system-ui,sans-serif}
body.aqua-studio button{touch-action:manipulation;font:inherit;cursor:pointer}
body.aqua-studio button:focus-visible,body.aqua-studio a:focus-visible{outline:3px solid #e8418d;outline-offset:3px}
.aqua-studio header{height:103px;display:flex;gap:10px;align-items:center;position:relative;z-index:30;padding:6px 18px;background:#9cddfa url("/kids/studio/sky-header.svg") center/cover no-repeat;border:0;border-bottom:5px solid #f9fcf4;box-shadow:0 2px 12px #568aab38}
.aqua-studio header .brand{display:flex;align-items:center;flex-wrap:wrap;gap:0;color:#243d9b;font-size:31px;font-weight:1000;text-decoration:none;text-shadow:1px 2px white;letter-spacing:-.045em;min-width:335px;line-height:1.1}
.aqua-studio header .brand .brand-star{font-size:59px;line-height:1;filter:drop-shadow(0 3px 1px #df9415);margin-right:9px}
.aqua-studio header .brand b{font-weight:1000}
.aqua-studio header .brand b span{color:#f15e8c}
.aqua-studio header .brand small{font-size:19px;font-weight:900;flex-basis:100%;padding-left:74px;letter-spacing:0;color:#243c86;text-shadow:none}
.aqua-studio header .sky-decoration{display:none}
.aqua-studio header .topright{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:nowrap;flex:1;overflow-x:auto;scrollbar-width:thin;min-width:0}
.aqua-studio header .action{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:78px;height:81px;padding:7px 10px;border-radius:17px;background:linear-gradient(#ffffffec,#e9f7ffef);border:1.5px solid #b0d9ff;box-shadow:0 3px 0 #83bcd8;color:#172f69;font-size:12px;font-weight:800;white-space:nowrap;gap:1px}
.aqua-studio header .action .button-icon{font-size:30px;line-height:1.2}
.aqua-studio header .action.primary{background:linear-gradient(#fff,#e4f6ff);color:#24488a;border-color:#accffe}
.aqua-studio header .action[disabled]{opacity:.45;cursor:default}
.aqua-studio main.layout{display:grid;grid-template-columns:132px 286px minmax(330px,1fr) 207px;grid-template-rows:71px minmax(540px,1fr) 103px;gap:9px;max-width:none;width:100%;min-height:calc(100dvh - 103px);padding:10px 9px 7px;background:linear-gradient(to bottom,#d9f5fa 0%,#fefef5 55%,#c8e99e 93%,#8dd457 100%);position:relative;align-items:stretch}
.aqua-studio .hero,.aqua-studio main.layout>aside.panel{display:none}
.aqua-studio .art-catalog-tabs{grid-column:1/3;grid-row:1;display:grid;grid-template-columns:repeat(4,1fr);gap:3px;background:#fff;border:2px solid #e8f0fc;border-radius:20px;padding:6px;box-shadow:var(--shadow);min-width:0}
.aqua-studio .art-catalog-tabs button{background:linear-gradient(#fff,#f4f9ff);border:0;border-radius:13px;color:#264a79;font-weight:800;font-size:11px;min-width:0;padding:4px 3px}
.aqua-studio .art-catalog-tabs button span{display:block;font-size:26px;line-height:1.3}
.aqua-studio .art-catalog-tabs button[aria-pressed=true]{background:#178efd;color:#fff;box-shadow:0 3px 7px #167ecd42}
.aqua-studio .art-categories{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:6px;overflow-y:auto;min-height:0;padding:5px;background:#fff;border:2px solid #ebeff6;border-radius:18px;box-shadow:var(--shadow);scrollbar-width:thin}
.aqua-studio .category-item{display:flex;align-items:center;gap:8px;flex:0 0 auto;text-align:left;min-height:58px;padding:7px 9px;border:1px solid #d9e8f8;border-radius:12px;background:linear-gradient(100deg,#f4fbff,#e9f3fc);color:#254e83;font-weight:850;line-height:1.2;box-shadow:0 2px 0 #d9e5f1}
.aqua-studio .category-item span{font-size:23px;line-height:1}
.aqua-studio .category-item small{font-size:12px;font-weight:800}
.aqua-studio .category-item[aria-pressed=true]{color:white;background:linear-gradient(110deg,#269efb,#137eeb);border-color:#299bff;box-shadow:0 3px 4px #258fe440}
.aqua-studio .art-library{grid-column:2;grid-row:2;background:linear-gradient(#fff,#fefefd);border:2px solid #e8eff5;border-radius:17px;padding:12px 9px;box-shadow:var(--shadow);min-height:0;overflow-y:auto;scrollbar-width:thin}
.aqua-studio .art-library h2{font-size:17px;letter-spacing:-.025em;font-weight:950;line-height:1.2;margin:6px 3px}
.aqua-studio .art-library h3{font-size:15px;margin:15px 2px 8px;color:#1c344f}
.aqua-studio .art-subtitle{color:#68788e;font-size:11px;margin:4px 2px 9px}
.aqua-studio .art-library-tabs{display:none}
.aqua-studio .art-library .collection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.aqua-studio .art-library .collection-grid[hidden]{display:none}
.aqua-studio .art-library .collection-grid button,.aqua-studio .mini-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:98px;padding:5px 3px;background:linear-gradient(#fff,#f9fbff);border:2px solid #e9eef6;border-radius:12px;box-shadow:0 2px 0 #e9edf4;color:#2f496b;font-size:11px;font-weight:850;line-height:1.1;white-space:normal;overflow-wrap:anywhere}
.aqua-studio .art-library .collection-grid button[aria-pressed=true]{background:#def4ff;border-color:#1590f5}
.aqua-studio .art-library .collection-grid button span{display:flex;justify-content:center;align-items:center;min-height:65px;margin:0 auto 2px}
.aqua-studio .art-library .collection-grid button canvas{width:70px!important;height:58px!important;max-width:100%}
.aqua-studio .art-library .collection-grid button span:not(:has(canvas)){font-size:38px}
.aqua-studio .mini-collection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.aqua-studio .mini-tile{min-height:96px;font-size:34px;background:#fffefc}
.aqua-studio .art-extra-stamps{margin-top:7px;border-top:1px solid #f1f2f7;padding-top:3px}
.aqua-studio .art-extra-stamps .stamps{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.aqua-studio .art-extra-stamps .stamp{height:44px;font-size:24px}
.aqua-studio .art-guided-lessons{background:#fbf5ff;border-radius:12px;padding:9px;margin-top:12px}
.aqua-studio .art-guided-lessons .lesson-buttons{display:grid;grid-template-columns:repeat(2,1fr)}
.aqua-studio .art-stage{grid-column:3;grid-row:1/3;background:transparent;min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0}
.aqua-studio .art-stage-title{display:none}
.aqua-studio .canvas-box{position:relative;min-height:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;border:8px solid #fff;border-radius:25px;background:#fff;box-shadow:0 6px 18px #376b9740;overflow:hidden;display:flex;align-items:center;justify-content:center;touch-action:none}
.aqua-studio .canvas-box canvas{display:block;width:auto;height:auto;max-width:100%;max-height:100%;aspect-ratio:1000/875;object-fit:contain;touch-action:none}
.aqua-studio .canvas-box .canvas-tag{display:none}
.aqua-studio .art-stage .tip{color:#466188;font-size:11px;font-weight:750;margin:4px 0;max-width:90%;text-align:center}
.aqua-studio .art-controls{grid-column:4;grid-row:1/3;background:#fff;border:2px solid #ecedf5;border-radius:22px;min-width:0;overflow-y:auto;min-height:0;padding:16px 12px;box-shadow:var(--shadow)}
.aqua-studio .art-controls h2{margin:0 0 14px;font-size:19px;font-weight:950;color:#1a2b40}
.aqua-studio .art-controls h3{margin:21px 0 12px;font-size:16px;font-weight:950;color:#24344d}
.aqua-studio .art-controls #tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.aqua-studio .art-controls .tool{background:linear-gradient(#fff,#f7f8ff);border:2px solid #e1e8f0;border-radius:17px;min-height:86px;padding:8px 2px;color:#162f54;font-size:29px;font-weight:900;box-shadow:0 2px 0 #e5ebf2}
.aqua-studio .art-controls .tool div{font-size:12px;font-weight:850}
.aqua-studio .art-controls .tool.active{background:#178ff7;color:white;border-color:#2e9ffd}
.aqua-studio .art-controls #size{width:100%;accent-color:#057fe8;height:26px}
.aqua-studio .art-controls .palette{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 9px}
.aqua-studio .art-controls .color{display:block;width:43px;height:43px;margin:auto;border:2px solid #fff;box-shadow:0 1px 4px #43577a34;border-radius:50%}
.aqua-studio .art-controls .color.active{outline:3px solid #6e45d1}
.aqua-studio .art-controls .art-settings{padding-top:8px}
.aqua-studio .art-controls .select{font-size:13px;padding:8px;width:100%}
.aqua-studio .art-taskbar{grid-column:1/-1;grid-row:3;background:linear-gradient(#fff,#f3fffc);border:4px solid #fff;border-radius:24px;min-width:0;display:flex;align-items:center;justify-content:center;padding:7px 11px;box-shadow:0 7px 0 #77c76d;position:relative}
.aqua-studio .art-taskbar .under{display:flex;align-items:center;justify-content:center;gap:7px;margin:0;flex-wrap:wrap}
.aqua-studio .art-taskbar button{font-weight:900;font-size:13px;min-height:63px;padding:12px 14px;border-radius:15px;color:#58318c;background:linear-gradient(#f4e6ff,#e7d5ff);border:2px solid #e7d0ff;box-shadow:0 3px 0 #b9a0e0;white-space:nowrap}
.aqua-studio .art-taskbar button:nth-child(2){color:#925514;background:linear-gradient(#fff5d2,#ffe5a4);border-color:#ffe3a3}
.aqua-studio .art-taskbar button:nth-child(3){color:#26683d;background:linear-gradient(#d9ffd8,#c8f8d0);border-color:#adedd1}
.aqua-studio .art-taskbar #savePng{color:white;background:linear-gradient(#3aaeff,#0879ec);border-color:#54abff}
.aqua-studio .art-taskbar #savePdf{color:white;background:linear-gradient(#ff76a5,#fa3c86);border-color:#ff7aa8}
.aqua-studio .art-taskbar .quick-stickers{display:flex;gap:5px;align-items:center;overflow-x:auto;max-width:45%;scrollbar-width:thin}
.aqua-studio .art-taskbar .quick-stickers button{min-width:52px;font-size:28px;padding:5px;background:#fff;border:2px solid #edf0f1;color:#333}
.aqua-studio main.layout:after{content:"";position:absolute;left:0;right:0;bottom:-15px;height:44px;pointer-events:none;z-index:0;background:url("/kids/studio/garden.svg") center bottom/cover no-repeat}
.aqua-studio .art-taskbar{z-index:2}
.aqua-studio .canvas-box:fullscreen{width:100vw!important;height:100dvh!important;max-height:none!important;aspect-ratio:auto!important;position:fixed;inset:0;border:0;border-radius:0;box-shadow:none;background:#fff}
.aqua-studio .canvas-box:fullscreen canvas{width:auto;height:auto;max-width:100vw;max-height:100dvh;aspect-ratio:1000/875}
@media(max-width:1370px){.aqua-studio main.layout{grid-template-columns:105px 240px minmax(280px,1fr) 183px}.aqua-studio header .brand{font-size:25px;min-width:285px}.aqua-studio header .brand small{font-size:15px}.aqua-studio header .action{min-width:65px;padding:6px}.aqua-studio .art-library .collection-grid{gap:4px}.aqua-studio .art-controls{padding:10px 8px}.aqua-studio .art-controls .color{width:36px;height:36px}.aqua-studio .art-taskbar button{font-size:12px;padding:8px}}
@media(max-width:1050px){.aqua-studio header{height:82px}.aqua-studio header .brand{min-width:195px;font-size:21px}.aqua-studio header .brand .brand-star{font-size:40px}.aqua-studio header .brand small{padding-left:50px;font-size:12px}.aqua-studio header .action{min-width:52px;height:62px;font-size:10px}.aqua-studio header .action .button-icon{font-size:22px}.aqua-studio main.layout{grid-template-columns:90px 185px minmax(220px,1fr) 137px;grid-template-rows:60px minmax(500px,1fr) 95px;min-height:calc(100dvh - 82px);gap:5px;padding:6px}.aqua-studio .art-library{padding:7px 4px}.aqua-studio .art-library .collection-grid{grid-template-columns:repeat(2,1fr)}.aqua-studio .category-item{min-height:50px;gap:3px;padding:4px}.aqua-studio .category-item span{font-size:18px}.aqua-studio .category-item small{font-size:10px}.aqua-studio .art-controls .tool{min-height:65px;font-size:22px}.aqua-studio .art-controls .palette{gap:7px 2px}.aqua-studio .art-controls .color{width:32px;height:32px}.aqua-studio .art-controls h3{font-size:13px}.aqua-studio .art-taskbar .quick-stickers{display:none}.aqua-studio .art-taskbar button{min-height:50px;font-size:11px}}
@media(max-width:760px){.aqua-studio header{height:63px;padding:4px 6px;gap:5px}.aqua-studio header .brand{min-width:116px;font-size:14px}.aqua-studio header .brand .brand-star{font-size:29px;margin-right:3px}.aqua-studio header .brand small{font-size:9px;padding-left:34px}.aqua-studio header .topright{gap:4px}.aqua-studio header .action{min-width:45px;height:49px;font-size:9px;padding:3px;gap:0;border-radius:10px}.aqua-studio header .action .button-icon{font-size:20px}.aqua-studio main.layout{display:flex;flex-direction:column;gap:6px;padding:5px;min-height:calc(100dvh - 63px)}.aqua-studio .art-catalog-tabs{order:0;flex:0 0 auto;min-height:55px;grid-template-columns:repeat(4,1fr);padding:3px}.aqua-studio .art-catalog-tabs button{font-size:9px;padding:3px}.aqua-studio .art-catalog-tabs button span{font-size:20px}.aqua-studio .art-categories{order:1;display:flex;flex-direction:row;flex:0 0 auto;max-height:60px;overflow-x:auto;overflow-y:hidden;gap:5px;padding:4px;border-radius:12px}.aqua-studio .category-item{flex:0 0 86px;min-height:45px;justify-content:center;flex-direction:column;gap:0;padding:2px;font-size:10px}.aqua-studio .category-item span{font-size:19px}.aqua-studio .art-stage{order:2;min-height:0;flex:0 0 auto;width:100%}.aqua-studio .canvas-box{width:100%;height:auto;min-height:0;max-height:calc(100dvh - 250px);aspect-ratio:1000/650;border-width:3px;border-radius:13px}.aqua-studio .canvas-box canvas{width:100%;height:100%}.aqua-studio .art-stage .tip{font-size:10px;line-height:1.2;margin:3px}.aqua-studio .art-controls{order:3;display:flex;align-items:center;gap:7px;overflow-x:auto;overflow-y:hidden;min-height:65px;flex:0 0 auto;padding:5px 7px;border-radius:12px}.aqua-studio .art-controls h2,.aqua-studio .art-controls h3,.aqua-studio .art-controls .art-settings{display:none}.aqua-studio .art-controls #tools{display:flex;flex:0 0 auto;gap:4px}.aqua-studio .art-controls .tool{min-height:49px;min-width:53px;font-size:16px;border-radius:9px;padding:3px}.aqua-studio .art-controls .tool div{font-size:9px}.aqua-studio .art-controls #size{width:90px;flex:0 0 90px}.aqua-studio .art-controls .palette{display:flex;flex:0 0 auto;gap:5px}.aqua-studio .art-controls .color{min-width:30px;width:30px;height:30px}.aqua-studio .art-taskbar{order:4;position:sticky;bottom:0;flex:0 0 auto;justify-content:flex-start;min-height:61px;padding:4px 5px;border-radius:12px;overflow-x:auto;z-index:12}.aqua-studio .art-taskbar .under{display:flex;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;gap:4px}.aqua-studio .art-taskbar button{min-height:42px;padding:7px 9px;white-space:nowrap;border-radius:9px;font-size:10px}.aqua-studio .art-library{order:5;max-height:360px;min-height:120px;padding:10px;border-radius:13px}.aqua-studio .art-library .collection-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.aqua-studio .art-library .collection-grid button{min-height:80px}.aqua-studio .art-library .collection-grid button canvas{height:47px!important}.aqua-studio .art-library h2{font-size:15px}.aqua-studio .art-extra-stamps{display:none}.aqua-studio .art-taskbar .quick-stickers{display:none}.aqua-studio main.layout:after{height:28px;bottom:0}}
@media(max-width:400px){.aqua-studio header .brand{min-width:103px;font-size:12px}.aqua-studio header .action{min-width:41px;font-size:8px}.aqua-studio header .action .button-icon{font-size:17px}.aqua-studio .art-library .collection-grid{grid-template-columns:repeat(3,1fr)}}
@media print{body.aqua-studio header,body.aqua-studio .art-categories,body.aqua-studio .art-library,body.aqua-studio .art-controls,body.aqua-studio .art-taskbar,body.aqua-studio .art-catalog-tabs{display:none!important}body.aqua-studio main.layout{display:block;background:#fff;padding:0}.aqua-studio .art-stage{display:block}.aqua-studio .canvas-box{border:0;box-shadow:none;width:100%;height:auto}.aqua-studio .art-stage .tip{display:none}}
@media(prefers-reduced-motion:reduce){.aqua-studio *{transition:none!important;scroll-behavior:auto!important}}
/* Detail polish to match the approved mockup: layered controls and tile illustrations. */
.aqua-studio .preview-vehicles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:9px}
.aqua-studio .preview-vehicles .mini-tile{min-height:91px}
.aqua-studio .mini-icon{display:flex;align-items:center;justify-content:center;width:100%;min-height:57px;font-size:36px;line-height:1;filter:drop-shadow(0 2px 1px #46618920)}
.aqua-studio .mini-title{font-size:11px;line-height:1.1;font-weight:800;color:#2c426a}
.aqua-studio .art-library button:hover{background:#eaf6ff;border-color:#6bb8ff}
.aqua-studio .art-template-grid,.aqua-studio .art-background-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.aqua-studio .art-template-grid[hidden],.aqua-studio .art-background-grid[hidden]{display:none}
.aqua-studio .art-template-grid h2,.aqua-studio .art-background-grid h2{grid-column:1/-1}
.aqua-studio .art-guided-lessons[hidden]{display:none}
.aqua-studio .art-guided-lessons{margin-top:10px;padding:12px;border-radius:14px;background:#f5edff}
.aqua-studio .art-guided-lessons .lesson-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.aqua-studio .art-guided-lessons button{min-height:45px;border-radius:12px;background:#e6dfff;color:#6341a6;font-weight:800}
.aqua-studio .art-taskbar .under{display:contents}
.aqua-studio .art-taskbar .action,.aqua-studio .art-taskbar button{display:flex;align-items:center;justify-content:center;gap:9px;flex-direction:column;line-height:1.1}
.aqua-studio .art-taskbar .button-icon{font-size:28px;line-height:1.1}
.aqua-studio .art-taskbar .button-label{font-size:12px;font-weight:900}
.aqua-studio .art-taskbar .quick-stickers{max-width:none;display:flex;min-width:0;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:thin}
.aqua-studio .art-taskbar .quick-sticker{min-height:62px;min-width:55px;flex:0 0 auto;padding:4px;font-size:29px;background:#fff;color:#23436e;border:2px solid #e9e8ed;box-shadow:0 2px 0 #d4d5e5}
.aqua-studio .art-taskbar button:active,.aqua-studio .art-catalog-tabs button:active,.aqua-studio .category-item:active{transform:translateY(2px)}
.aqua-studio .art-controls .tool:focus-visible,.aqua-studio .art-library .mini-tile:focus-visible{outline:3px solid #fa5994}
.aqua-studio .art-taskbar #savePng{order:20}.aqua-studio .art-taskbar #savePdf{order:21}
.aqua-studio .art-taskbar .quick-stickers{order:15}
.kids-settings{border:4px solid #d5bcff;border-radius:24px;max-width:min(460px,94vw);padding:25px;background:#fffdf8;box-shadow:0 15px 80px #1b23599c;color:#25436c}
.kids-settings::backdrop{background:#102342b3}.kids-settings h2{margin:0 0 9px}
.kids-settings p{font-size:14px;color:#617089}.kids-settings .setting-content{display:grid;gap:12px;margin-top:18px}
.kids-settings .setting-content label{font-weight:850;font-size:13px;margin:0}
.kids-settings .setting-content button,.kids-settings .close-settings{border-radius:13px;background:#e7e6ff;padding:12px;color:#473c94;border:2px solid #d1c8fd;font-weight:850}
.kids-settings .close-settings{margin-top:16px;background:#6d4ce4;color:#fff;width:100%}
@media(max-width:1370px){.aqua-studio .art-taskbar .quick-sticker{min-width:44px;font-size:23px}.aqua-studio .art-taskbar .button-icon{font-size:23px}.aqua-studio .art-taskbar .button-label{font-size:10px}}
@media(max-width:1050px){.aqua-studio .art-taskbar .quick-stickers{display:none}.aqua-studio .art-taskbar .button-icon{font-size:21px}}
@media(max-width:760px){.aqua-studio .art-taskbar .under{display:contents}.aqua-studio .art-taskbar button{display:flex;flex-direction:row;gap:4px}.aqua-studio .art-taskbar .button-icon{font-size:16px}.aqua-studio .art-taskbar .button-label{font-size:10px}.aqua-studio .art-library .preview-vehicles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.aqua-studio .art-library .mini-tile{min-height:80px}.aqua-studio .mini-icon{min-height:45px;font-size:28px}}