#studioSplash[open] {position:fixed;inset:0;box-sizing:border-box;display:grid;place-items:center;margin:0;padding:24px 16px;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#fff 0%,#e9f7ee 49%,#b7dace 100%);color:#24394e;opacity:1;transition:opacity var(--splash-fade,700ms) ease;font-family:"Trebuchet MS",Arial,sans-serif;}
#studioSplash::backdrop {background:#e9f7ee;opacity:1;transition:opacity var(--splash-fade,700ms) ease;backdrop-filter:none;}
#studioSplash.splash-leaving,#studioSplash.splash-leaving::backdrop {opacity:0;}
#studioSplash .splash-skip {position:absolute;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));min-height:44px;padding:9px 16px;border:1px solid #335e5230;border-radius:22px;background:#ffffffc9;color:#315749;box-shadow:none;font:600 13px Arial,sans-serif;}
#studioSplash .splash-center {width:min(100%,460px);text-align:center;}
#studioSplash .splash-turtle {position:relative;display:grid;place-items:center;width:100%;margin:0 auto 25px;}
#studioSplash .splash-turtle img {display:block;width:94%;height:auto;filter:drop-shadow(0 18px 12px #35534021);}
#studioSplash h1 {margin:0 0 8px;color:#24394e;font-size:clamp(27px,5vw,38px);font-weight:800;line-height:1.15;letter-spacing:-1px;}
#studioSplash p {margin:0;color:#456657;font-size:16px;line-height:1.5;}
#studioSplash .splash-orbit {position:absolute;inset:0 3%;z-index:1;pointer-events:none;transform:rotate(var(--angle));animation:splash-swirl 12s linear both;}
#studioSplash .splash-orbit>span {position:absolute;left:50%;top:-5px;display:block;font-size:29px;text-shadow:0 2px 1px #fff9;transform:translate(-50%,-50%) rotate(calc(-1 * var(--angle)));animation:splash-unswirl 12s linear both;}
#studioSplash .splash-orbit:nth-child(2n)>span {font-size:35px;}
#studioSplash .splash-orbit:nth-child(1)>span {color:#159f91;}
#studioSplash .splash-orbit:nth-child(2)>span {color:#2a8bcf;}
#studioSplash .splash-orbit:nth-child(3)>span {color:#8e55d3;}
#studioSplash .splash-orbit:nth-child(4)>span {color:#db4d9b;}
#studioSplash .splash-orbit:nth-child(5)>span {color:#e5981a;}
#studioSplash .splash-dots {display:flex;justify-content:center;gap:8px;margin-top:28px;}
#studioSplash .splash-dots span {width:7px;height:7px;border-radius:50%;background:#698c7b;opacity:.35;}
#studioSplash .splash-dots span:nth-child(2) {opacity:.65;}
#studioSplash .splash-dots span:last-child {opacity:1;}
@keyframes splash-swirl {to{transform:rotate(calc(var(--angle) + 360deg));}}
@keyframes splash-unswirl {to{transform:translate(-50%,-50%) rotate(calc(-1 * var(--angle) - 360deg));}}
@media(prefers-reduced-motion:reduce){#studioSplash .splash-orbit,#studioSplash .splash-orbit>span {animation:none;}#studioSplash[open],#studioSplash::backdrop {transition:none;}}
@media(max-height:500px){#studioSplash .splash-center {width:min(68%,290px);}#studioSplash .splash-turtle {margin-bottom:10px;}#studioSplash h1 {font-size:25px;}#studioSplash p {font-size:13px;}#studioSplash .splash-dots {margin-top:12px;}}

@view-transition {navigation:auto;}
::view-transition-old(root),::view-transition-new(root) {animation-duration:.18s;}
.app-choice {view-transition-name:studio-switch;}
::view-transition-group(studio-switch) {animation:none;}
::view-transition-old(studio-switch) {animation:none;opacity:0;}
::view-transition-new(studio-switch) {animation:none;opacity:1;}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none;}.app-slider .rail:after {transition:none!important;}}
body[data-studio-layout]>header {position:relative;padding:12px 80px;justify-content:center;gap:14px;}
body[data-studio-layout]>header #openStudioMenu {position:absolute;left:16px;top:50%;transform:translateY(-50%);}
.app-choice {display:grid;grid-template-columns:minmax(0,1fr) 132px minmax(0,1fr);align-items:center;justify-content:center;gap:22px;padding:12px 20px;border:1px solid #abc5b9;border-radius:22px;background:linear-gradient(145deg,#fafff8,#dceee3);box-shadow:0 3px 0 #b6cfc2;order:1;width:min(100%,820px);margin:0 auto;box-sizing:border-box;font:bold 24px/1.2 'Trebuchet MS',Arial,sans-serif;color:#688178;}
.app-choice .studio-label {display:flex;align-items:center;justify-content:center;gap:9px;text-align:center;min-width:0;}
.app-choice .studio-label.active {color:#174e3e;}
.app-choice .studio-label.communication.active {color:#684294;}
.app-slider {display:block;position:relative;flex-shrink:0;width:132px;height:64px;cursor:pointer;}
.app-slider input {position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2;}
.app-slider .rail {display:block;position:absolute;inset:0;border-radius:13px;background:linear-gradient(#27775e,#134d3b);box-shadow:inset 0 4px 7px #102f3e60,0 1px 0 #fff;border:2px solid #164f3e;transition:background .2s;}
.app-slider .rail:after {content:'';position:absolute;left:5px;top:5px;width:55px;height:50px;border-radius:8px;background:repeating-linear-gradient(90deg,transparent 0 4px,#67807320 4px 5px,transparent 5px 8px) center/22px 24px no-repeat,linear-gradient(#fffefa,#dbe6df);box-shadow:0 4px 6px #102f3e80,inset 0 2px 0 #fff,inset 0 -2px 0 #9cae9f;transition:transform .2s cubic-bezier(.2,.85,.25,1);}
.app-slider input:checked+.rail {background:linear-gradient(#9970c3,#684294);border-color:#62408b;}
.app-slider input:checked+.rail:after {transform:translateX(63px);}
.app-slider input:focus-visible+.rail {outline:3px solid #1d72bd;outline-offset:4px;}
.app-choice img {width:40px;height:34px;object-fit:contain;}
.app-choice .bubble {font-size:27px;line-height:1;}
.preview-launch {position:fixed;bottom:14px;right:18px;z-index:20;background:#fffdf5;padding:9px 12px;border-radius:12px;color:#35614f;font-size:12px;white-space:nowrap;}
#studioSplash .splash-center {width:min(100%,520px);}
#studioSplash h1 {font-size:clamp(29px,4vw,42px);max-width:620px;margin:0 auto 14px;line-height:1.1;letter-spacing:-1px;}
#studioSplash .splash-center {width:min(100%,740px);position:relative;z-index:1;}
#studioSplash[open] {background:radial-gradient(ellipse at 50% 20%,#fff9d9 0%,#e3fff0 38%,#b8f2e4 72%,#92deeb 100%);}
#studioSplash .splash-symbols {position:absolute;inset:0;pointer-events:none;overflow:hidden;}
#studioSplash .splash-symbols figure {position:absolute;width:clamp(150px,19vw,260px);height:clamp(180px,22vw,290px);margin:0;display:grid;place-content:center;justify-items:center;border-radius:32px;background:#fff5b9;border:2px solid #e4ba38;opacity:.32;box-shadow:0 10px 0 #7ba49330;}
#studioSplash .splash-symbols figure:nth-child(1){left:calc(50% - 430px);top:14%;transform:rotate(-10deg);}
#studioSplash .splash-symbols figure:nth-child(2){left:calc(50% + 200px);top:14%;transform:rotate(10deg);background:#b8eaff;border-color:#42abd4;}
#studioSplash .splash-symbols figure:nth-child(3){right:7%;bottom:5%;width:190px;height:215px;transform:rotate(-7deg);background:#ffd3ba;border-color:#ea9464;}
#studioSplash .splash-symbols img {width:80%;height:170px;object-fit:contain;}
#studioSplash .splash-symbols figcaption {font-size:28px;font-weight:bold;color:#285a49;}
#studioSplash button.welcome-sound {appearance:none;display:flex;align-items:center;justify-content:center;gap:7px;margin:0 auto 16px;border:0;border-radius:0;padding:5px 2px;min-height:34px;background:none;box-shadow:none;color:#416655;font:500 12px/1.3 'Trebuchet MS',Arial,sans-serif;cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#92b6a4;}
#studioSplash button.welcome-sound:hover {background:none;color:#174e3e;box-shadow:none;transform:none;}
#studioSplash button.welcome-sound:focus-visible {outline:2px solid #397a65;outline-offset:4px;}
#studioSplash .splash-orbit,#studioSplash .splash-orbit>span {animation-iteration-count:infinite;}
#studioSplash .splash-turtle {width:min(100%,400px);margin-bottom:2px;}
#studioSplash .tutu-name {display:block;margin:0 auto 13px;color:#537768;font-size:13px;line-height:1.2;letter-spacing:.3px;font-weight:600;}
#studioSplash .splash-product-pair {display:flex;justify-content:center;align-items:stretch;gap:14px;margin:2px auto 17px;}
#studioSplash .splash-product-pair a {display:flex;align-items:center;justify-content:flex-start;gap:12px;width:360px;border:2px solid #009781;border-top-color:#a1fff0;border-radius:20px;background:linear-gradient(145deg,#54f1d3,#13c1a6);box-shadow:0 6px 0 #087b68,0 11px 22px #008e6d32,inset 0 2px 0 #ffffff70;padding:18px;color:#073f3a;font-size:22px;line-height:1.18;font-weight:800;min-height:112px;box-sizing:border-box;text-align:left;text-decoration:none;transition:transform .15s,box-shadow .15s,filter .15s;}
#studioSplash .splash-product-pair a:last-child {background:linear-gradient(145deg,#9d4fe0,#722dbe);border-color:#7836bc;border-top-color:#e9caff;color:#fff;box-shadow:0 6px 0 #50207f,0 11px 22px #7930ae32,inset 0 2px 0 #ffffff50;}
#studioSplash .splash-product-pair a .studio-option-icon {font-size:29px;flex-shrink:0;line-height:1;}
#studioSplash .splash-product-pair .mini-instrument {display:block;width:52px;height:55px;object-fit:contain;filter:drop-shadow(0 2px 2px #123a3438);}
#studioSplash .splash-product-pair .mini-word-card {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:48px;height:58px;border:1px solid #e5ddc7;border-radius:9px;background:linear-gradient(#fffef7,#eaf4e8);color:#285344;box-shadow:0 3px 0 #4b356448;transform:rotate(-6deg);box-sizing:border-box;}
#studioSplash .splash-product-pair .mini-word-card img {display:block;width:39px;height:38px;object-fit:contain;}
#studioSplash .splash-product-pair .mini-word-card b {font-size:10px;line-height:1;font-weight:700;letter-spacing:0;}
#studioSplash .splash-product-pair a .studio-option-copy {flex:1;}
#studioSplash .splash-product-pair a small {display:block;margin-top:8px;font-size:14px;font-weight:600;letter-spacing:.1px;color:#073f3a;}
#studioSplash .splash-product-pair a:last-child small {color:#fff;}
#studioSplash .splash-product-pair a .studio-option-arrow {font-size:20px;font-weight:400;opacity:.85;}
#studioSplash .splash-product-pair a:hover {transform:translateY(-2px);filter:brightness(1.04);}
#studioSplash .splash-product-pair a:active {transform:translateY(3px);}
#studioSplash .splash-product-pair a:focus-visible {outline:3px solid #397a65;outline-offset:4px;}
#studioSplash p {font-size:17px;}
#studioSplash .splash-preview-note {position:absolute;bottom:22px;font:12px Arial,sans-serif;color:#527365;}
@media(max-width:650px){
body[data-studio-layout]>header {padding:10px 10px 10px 64px;gap:8px;}
body[data-studio-layout]>header #openStudioMenu {width:44px;height:52px;min-height:52px;padding:8px;left:10px;}
.app-choice {grid-template-columns:minmax(0,1fr) 80px minmax(0,1fr);border-radius:16px;gap:7px;padding:9px 7px;max-width:none;min-width:0;font-size:13px;}
.app-choice .studio-label {gap:4px;flex:1;}.app-choice .studio-label img {display:none;}
.app-slider {width:80px;height:48px;}.app-slider .rail:after {width:33px;height:36px;left:4px;top:4px;background-size:17px 18px,auto;}.app-slider input:checked+.rail:after {transform:translateX(35px);}
.app-choice img {width:24px;height:26px;}.app-choice .bubble {font-size:22px;}
.preview-launch {display:none;}
#studioSplash h1 {font-size:32px;}
#studioSplash .splash-product-pair {flex-direction:column;gap:12px;width:min(100%,340px);margin-bottom:10px;}
#studioSplash .splash-product-pair a {width:100%;font-size:22px;padding:16px;gap:10px;min-height:116px;}
#studioSplash .splash-symbols figure {width:170px;height:210px;}.splash-symbols figure img {height:130px!important;}
#studioSplash .splash-symbols figure:nth-child(1){left:-35px;top:12%;}#studioSplash .splash-symbols figure:nth-child(2){left:auto;right:-35px;top:12%;}#studioSplash .splash-symbols figure:nth-child(3){right:-55px;bottom:3%;width:150px;height:170px;opacity:.12;}
}


*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:"Trebuchet MS",Arial,sans-serif;color:#24394e;background:#f7f3e8;overflow:hidden}[hidden]{display:none!important}
#shellHeader{position:fixed;inset:0 0 auto;height:112px;display:flex;align-items:center;justify-content:center;padding:12px 18px;z-index:20;background:linear-gradient(135deg,#fffdf3,#eef6ed);border-bottom:1px solid #ccdcd0;}
#shellHeader .app-choice{margin:0 auto;}
.app-choice .studio-toggle-card{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;flex-shrink:0;width:44px;height:54px;padding:3px;border:1px solid #d5dcbf;border-radius:9px;background:linear-gradient(#fffef4,#e5f5df);box-shadow:0 3px 0 #9fae923d;transform:rotate(-4deg);color:#285344;}
.app-choice .studio-toggle-card img{display:block!important;width:34px;height:36px;object-fit:contain;}
.app-choice .studio-toggle-card b{font:700 10px/1 'Trebuchet MS',Arial,sans-serif;}
#studios{position:fixed;inset:112px 0 0;}
.studio-pane{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease;}
.studio-pane.active{opacity:1;visibility:visible;pointer-events:auto;}
.studio-pane iframe{display:block;border:0;width:100%;height:100%;background:#f7f3e8;}
#studioSplash[open]{z-index:30;overflow-y:auto;}
#studioSplash .splash-center{padding-top:18px;padding-bottom:36px;}
#studioSplash .splash-preview-note{bottom:14px;}
#shellStatus{position:fixed;bottom:15px;left:50%;transform:translateX(-50%);z-index:40;background:#fffdf5;color:#345e4a;border-radius:15px;padding:10px 16px;font-size:13px;box-shadow:0 3px 18px #23433320;}
@media(max-width:650px){#shellHeader{height:88px;padding:8px 10px}#studios{top:88px}#studioSplash[open]{display:block;padding:18px 14px 36px;}#studioSplash .splash-center{margin:0 auto;padding:0 0 28px;}#studioSplash .splash-turtle{width:min(82vw,300px);}#studioSplash h1{font-size:29px;}#studioSplash p{font-size:15px;line-height:1.4;}#studioSplash .splash-preview-note{position:static;display:block;text-align:center;}#studioSplash .splash-symbols{position:fixed;}#studioSplash .splash-product-pair{margin-top:0;}}
@media(max-width:650px){.app-choice .studio-toggle-card{width:34px;height:44px;padding:2px;}.app-choice .studio-toggle-card img{width:27px;height:29px;}.app-choice .studio-toggle-card b{font-size:8px;}}
@media(max-width:380px){#shellHeader{height:116px}#studios{top:116px}.app-choice .studio-label.communication{flex-direction:column;font-size:12px;gap:4px}.app-choice{grid-template-columns:minmax(0,1fr) 80px minmax(0,1fr);}}
@media(prefers-reduced-motion:reduce){.studio-pane,.app-slider .rail:after{transition:none!important}}

/* Welcome copy stays in document flow so it cannot overlap at short heights. */
#studioSplash[open]{overflow-y:auto;display:block;padding:24px 16px 32px;}
#studioSplash .splash-center{margin:0 auto;padding-bottom:12px;}
#studioSplash h1{margin:26px auto 16px;line-height:1.12;}
#studioSplash .splash-center>p{margin:0 auto 18px;line-height:1.5;}
#studioSplash .splash-preview-note{position:static;display:block;bottom:auto;margin:0 auto;line-height:1.5;}
#studioSplash .splash-preview-note .main-site-return{display:inline-block;margin-top:12px!important;padding:8px 5px!important;line-height:1.5;}
#studioSplash .splash-dots{margin-top:20px;}
@media(max-width:650px){#studioSplash[open]{padding:18px 14px 28px;}#studioSplash h1{margin-top:24px;margin-bottom:14px;}#studioSplash .splash-center>p{margin-bottom:18px;}}