/* WordWings app layer — additions on top of the prototype styles */
.boot{min-height:100vh;display:grid;place-items:center;font-family:Fredoka,Nunito,sans-serif;color:#74817b;font-size:18px}
.editorial-nav nav a.editorial-btn{margin-left:4px}
.editorial-nav nav .ghost-btn{border:1.5px solid #cfe3d9;border-radius:40px;padding:11px 18px;font-weight:800;font-size:12px;color:#357965;background:#fff}
.editorial-nav nav .ghost-btn:hover{background:#f1f7f3}
.legal-page{max-width:860px;margin:0 auto 60px;background:#fff;border-radius:23px;padding:44px;box-shadow:0 12px 45px #4a756406}
.legal-page h1{font-family:Georgia,'Times New Roman',serif;font-size:42px;letter-spacing:-1.2px;color:#263d33;margin-bottom:6px}
.legal-page h2{font-family:Fredoka,Nunito,sans-serif;font-size:21px;color:#263d33;margin:26px 0 8px}
.legal-page p,.legal-page li{color:#5f6f68;font-size:14px;line-height:1.75}
.legal-page ul{padding-left:20px;margin:8px 0}
.legal-page .meta{font-size:11px;letter-spacing:1.4px;font-weight:900;color:#7fad9b;text-transform:uppercase;margin-bottom:22px}
/* auth */
.form-field{position:relative}
.pw-wrap{position:relative}
.pw-wrap input{padding-right:70px}
.pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;font-size:11px;font-weight:900;color:#357965;letter-spacing:.6px;cursor:pointer;padding:6px 8px;border-radius:8px}
.pw-toggle:hover{background:#eef5f1}
.auth-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:10px;font-size:12px;flex-wrap:wrap}
.auth-row .check{margin:0}
.form-error{background:#fbe9e2;color:#9a4a2e;border-radius:12px;padding:10px 14px;font-size:13px;margin-top:12px;display:none}
.form-error.show{display:block}
.form-ok{background:#e9f5ee;color:#1f6b52;border-radius:12px;padding:10px 14px;font-size:13px;margin-top:12px}
.form-grid .wide{grid-column:1/-1}
.form-legend{grid-column:1/-1;font-size:10px;letter-spacing:1.6px;font-weight:900;color:#9aa69c;margin-top:10px}
/* dashboard */
.profile-card{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.profile-card .big-avatar{width:84px;height:84px;border-radius:50%;overflow:hidden;border:4px solid #f1efe7;flex-shrink:0;box-shadow:0 6px 18px #5f907c1f}
.profile-card .big-avatar .child-avatar{border-radius:50%}
.profile-card h2{font-size:26px}
.profile-card .sub{color:#74817b;font-size:13px;margin-top:3px}
.profile-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.profile-chips span{background:#eef5f1;color:#2c6a56;border-radius:30px;padding:5px 11px;font-size:11px;font-weight:800}
.skill-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.skill-mini div{background:#f6f8f3;border-radius:14px;padding:12px;text-align:center}
.skill-mini b{display:block;font:22px Fredoka,sans-serif;color:#233c36}
.skill-mini small{color:#74817b;font-size:10px;letter-spacing:.8px;font-weight:800}
.badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-top:12px}
.badge{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid #e7ebe4;border-radius:14px;padding:10px 12px}
.badge .tile-icon{width:36px;height:36px;border-radius:11px}
.badge b{display:block;font-size:12px}
.badge small{color:#8a958f;font-size:10px}
.badge.locked{opacity:.45;filter:grayscale(1)}
.status-box{display:flex;gap:10px;align-items:center;margin-top:14px}
.status-box input{flex:1;min-height:42px;border:1px solid #e7ebe4;border-radius:12px;padding:0 14px;background:#fffefb}
.status-now{font-size:13px;color:#4c6a5e;margin-top:8px;font-style:italic}
.feed-card .meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:11px;color:#8a958f}
.feed-card .meta b{color:#233c36;font-size:13px}
.feed-card .kind{background:#fdf1e6;color:#b4673f;border-radius:20px;padding:2px 8px;font-size:9px;font-weight:900;letter-spacing:.8px}
.feed-card .kind.status{background:#e9f3ff;color:#2f5f9a}
.feed-card .avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;padding:0;background:#dceee7;flex-shrink:0}
.feed-card .avatar .child-avatar{border-radius:50%}
.feed-sentinel{text-align:center;color:#9aa69c;font-size:12px;padding:16px}
.like-btn[aria-pressed="true"]{color:#bc765a}
.del-btn{margin-left:auto;font-size:10px;color:#9aa69c;background:none;border:0;cursor:pointer}
/* assessment */
.assess-progress{display:flex;gap:6px;margin:10px 0 18px}
.assess-progress i{flex:1;height:6px;border-radius:6px;background:#e7ebe4}
.assess-progress i.done{background:#5ec099}
.assess-progress i.now{background:#d49a48}
.teleprompter{background:#22342d;color:#fff;border-radius:18px;padding:22px;margin-top:14px}
.teleprompter p{color:#9db4a8;font:500 20px/1.5 Fredoka,sans-serif;margin:0 0 6px;padding:6px 10px;border-radius:10px;transition:.3s}
.teleprompter p.current{background:#f3f7ed;color:#254438}
.teleprompter .tp-bar{height:6px;border-radius:6px;background:#3a4f46;margin-bottom:12px}
.teleprompter .tp-bar i{display:block;height:6px;border-radius:6px;background:#f5cd88;width:0;transition:width 1s linear}
.tp-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
.tp-controls .timer{font:16px Fredoka,sans-serif;color:#f5cd88;margin-left:auto}
.mic-dot{width:10px;height:10px;border-radius:50%;background:#6d7c75;display:inline-block;margin-right:6px}
.mic-dot.on{background:#e04848;box-shadow:0 0 0 4px #e0484833;animation:pulse 1s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 8px #e0484811}}
.write-area{width:100%;min-height:120px;border:1px solid #e7ebe4;border-radius:14px;padding:12px;font:inherit;margin-top:10px;background:#fffefb}
/* report */
.plan-reco{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}
.plan-reco .plan{border:1px solid #e7ebe4;border-radius:18px;padding:20px;background:#fff}
.plan-reco .plan.reco{border:2px solid #d49a48;background:#fffaf1}
.plan-reco .price{font:34px Fredoka,sans-serif}
.plan-reco small{color:#74817b}
.plan-reco ul{list-style:none;padding:0;margin:10px 0 0;font-size:12px;color:#4c6a5e;display:grid;gap:5px}
.plan-reco li::before{content:"✓ ";color:#5ec099;font-weight:900}
.reco-tag{display:inline-block;background:#d49a48;color:#fff;border-radius:20px;padding:4px 10px;font-size:10px;font-weight:900;letter-spacing:.8px;margin-bottom:8px}
.history-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:10px}
.history-table th,.history-table td{padding:8px 6px;border-bottom:1px solid #eef1ea;text-align:left}
.passport-badges{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}
.passport-badges span{background:#f4f8ee;color:#2c6a56;border-radius:20px;padding:4px 9px;font-size:9px;font-weight:900}
/* library */
.lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px;margin-top:16px}
.lib-book{background:#fff;border:1px solid #e7ebe4;border-radius:16px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.lib-book:hover{transform:translateY(-3px);box-shadow:0 10px 24px #4a756414}
.lib-book .cv{aspect-ratio:3/4;background:#eef2e9;position:relative;overflow:hidden}
.lib-book .cv img{width:100%;height:100%;object-fit:cover;display:block}
.lib-book .cv svg{width:100%;height:100%}
.lib-book .cat{position:absolute;left:8px;top:8px;background:#ffffffe6;border-radius:20px;padding:3px 8px;font-size:9px;font-weight:900;color:#357965;letter-spacing:.6px}
.lib-book .bd{padding:10px 12px 12px}
.lib-book h3{font-size:14px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lib-book p{font-size:11px;margin-top:4px;color:#8a958f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lib-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.lib-chips button{border:1px solid #e7ebe4;background:#fff;border-radius:20px;padding:6px 11px;font-size:11px;font-weight:800;color:#5f6f68;cursor:pointer}
.lib-chips button.active{background:#357965;color:#fff;border-color:#357965}
.lib-count{font-size:12px;color:#74817b;margin-top:8px}
.book-detail{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:start}
.book-detail .cv{border-radius:12px;overflow:hidden;background:#eef2e9;aspect-ratio:3/4}
.book-detail .cv img{width:100%;height:100%;object-fit:cover}
.book-detail h2{font-size:22px}
.book-detail .subj{font-size:11px;color:#8a958f;margin-top:8px;line-height:1.6}
/* games */
.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-top:14px}
.game-card{background:#fff;border:1px solid #e7ebe4;border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:8px}
.game-card .g-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font:22px Fredoka,sans-serif}
.game-card h3{font-size:18px}
.game-card p{font-size:12px}
.game-card .best{font-size:11px;color:#357965;font-weight:800}
#game-stage{background:#22342d;color:#fff;border-radius:22px;padding:22px;min-height:380px;margin-top:16px;position:relative;overflow:hidden}
#game-stage h2{color:#fff;font-size:22px}
#game-stage .hud{display:flex;gap:18px;font:14px Fredoka,sans-serif;color:#f5cd88;margin-bottom:12px;flex-wrap:wrap}
#game-stage .hud b{color:#fff}
#game-stage input{min-height:46px;border-radius:12px;border:0;padding:0 14px;font:18px Fredoka,sans-serif;width:100%;max-width:420px;background:#fffefb;color:#233c36}
.g-word{font:48px Fredoka,sans-serif;text-align:center;margin:30px 0;letter-spacing:1px}
.g-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-top:14px}
.g-opts button{background:#fffefb;color:#233c36;border:0;border-radius:14px;padding:14px;font:600 15px Fredoka,sans-serif;cursor:pointer;transition:.15s}
.g-opts button:hover{background:#f5cd88}
.g-opts button.right{background:#5ec099;color:#fff}.g-opts button.wrong{background:#e07a59;color:#fff}
.g-bar{height:8px;background:#3a4f46;border-radius:8px;overflow:hidden;margin:10px 0}
.g-bar i{display:block;height:100%;background:#f5cd88;transition:width .2s linear}
.memory{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.memory button{aspect-ratio:1.4;background:#2f473d;color:#fff;border:2px solid #3f5a4f;border-radius:14px;font:600 14px Fredoka,sans-serif;cursor:pointer;padding:6px;transition:.2s}
.memory button.open{background:#fffefb;color:#233c36}.memory button.done{background:#5ec099;color:#fff;border-color:#5ec099}
.g-result{text-align:center;padding:30px 10px}
.g-result .big{font:64px Fredoka,sans-serif;color:#f5cd88}
.lb-table{width:100%;border-collapse:collapse;font-size:12px}
.lb-table td,.lb-table th{padding:8px 6px;border-bottom:1px solid #eef1ea;text-align:left}
.lb-table tr.me td{background:#fff8e6;font-weight:800}
.lb-table .rk{font:16px Fredoka,sans-serif;color:#d49a48;width:36px}
.lb-table .av{width:28px;height:28px;border-radius:50%;overflow:hidden;display:inline-block;vertical-align:middle;margin-right:8px}
.team-box{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.team-box input{flex:1;min-width:140px;min-height:40px;border:1px solid #e7ebe4;border-radius:12px;padding:0 12px}
.topbar .logout{font-size:11px;font-weight:800;color:#7e8982;background:none;border:0;cursor:pointer;padding:8px}
@media (max-width:900px){.skill-mini{grid-template-columns:repeat(2,1fr)}.plan-reco{grid-template-columns:1fr}.book-detail{grid-template-columns:1fr}.memory{grid-template-columns:repeat(3,1fr)}}
@media print{.sidebar,.topbar,.bottom-note,.btn,.text-btn,#toast,dialog{display:none!important}.shell{display:block}.main-wrap,.content{margin:0!important;padding:0!important}body{background:#fff}.card{break-inside:avoid;border:1px solid #ddd}}
/* ---- Tobi ---- */
.tobi-img{width:100%;max-width:170px;height:auto;display:block;margin:auto}
.robot-holder .tobi-img{max-width:150px}
.coach-row{display:flex;gap:14px;align-items:center}.coach-row .tobi-img{width:84px;max-width:84px;margin:0;flex-shrink:0}
.coach-row small{font-size:9px;letter-spacing:1.6px;font-weight:900;color:#9aa69c}.coach-row h4{font-size:15px;line-height:1.35;margin-top:4px}
.coach-card .btn{margin-top:12px}
.tobi-mini{width:56px;height:56px;object-fit:contain}
/* ---- one logo ---- */
.sidebar .editorial-brand.brand-side{font-size:30px;color:#d49a48;margin:0 4px 4px}.sidebar .editorial-brand.brand-side>span{color:#357965;font-size:26px}.sidebar .editorial-brand.brand-side small{font-size:7px;letter-spacing:1.9px;color:#7fad9b}
.topbar .editorial-brand.brand-mobile{font-size:22px;color:#d49a48}.topbar .editorial-brand.brand-mobile>span{font-size:18px;color:#357965}.topbar .editorial-brand.brand-mobile small{display:none}
/* ---- home / stories ---- */
.home-grid{display:grid;grid-template-columns:270px minmax(0,1fr) 300px;gap:22px;align-items:start}
.home-left,.home-right{display:flex;flex-direction:column;gap:16px;position:sticky;top:90px}
.home-left .card,.home-right .card{padding:18px 20px}
.home-left h4,.home-right h4{font-size:15px;margin-bottom:8px}
.muted{color:#74817b}.small{font-size:11px}
.profile-compact{text-align:center}.profile-compact .big-avatar{width:84px;height:84px;border-radius:50%;overflow:hidden;margin:0 auto 10px;border:4px solid #f1efe7;box-shadow:0 6px 18px #5f907c1f}
.profile-compact h3{font-size:20px}.profile-compact .profile-chips{justify-content:center}
.home-menu{display:flex;flex-direction:column;gap:2px}.home-menu a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;font-weight:700;font-size:13px;color:#4c6a5e}.home-menu a:hover{background:#f5f5ef}
.skill-list div{display:grid;grid-template-columns:70px 1fr 30px;gap:8px;align-items:center;font-size:12px;margin:5px 0}.skill-list i{height:6px;border-radius:6px;background:#eef1ea;display:block;overflow:hidden}.skill-list b{display:block;height:100%;background:#5ec099}.skill-list strong{text-align:right;font:14px Fredoka,sans-serif}
.composer{padding:16px 18px}.composer-row{display:flex;gap:12px;align-items:center}.composer-row input{width:100%;min-height:44px;border:0;background:#f3f5ef;border-radius:30px;padding:0 16px;font:inherit}
.composer-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:12px;border-top:1px solid #eef1ea;padding-top:10px}.composer-actions .btn{margin-left:auto;min-height:38px;padding:8px 18px}
.act-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:10px;font-size:12px;font-weight:800;color:#4c6a5e;background:none;border:0;cursor:pointer;text-decoration:none}.act-btn:hover{background:#f5f5ef}
.stories-tabs{margin:14px 0 10px}
.story-card{background:#fff;border:1px solid #e7ebe4;border-radius:16px;padding:16px 18px;margin-bottom:12px}
.story-head{display:flex;gap:12px;align-items:flex-start}.story-head b{font-size:14px}.story-head .avatar{width:42px;height:42px;border-radius:50%;overflow:hidden;background:#dceee7;padding:0;flex-shrink:0}.story-head .avatar .child-avatar{border-radius:50%}
.story-text{color:#233c36;font-size:15px;line-height:1.55;margin:10px 0 6px}
.story-actions{display:flex;gap:4px;align-items:center;border-top:1px solid #eef1ea;padding-top:8px;margin-top:6px}
.story-actions .like-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:8px 10px;border-radius:10px;font-size:12px;font-weight:800;color:#4c6a5e;cursor:pointer}.story-actions .like-btn:hover{background:#f5f5ef}
.kind.voice{background:#eaf4ec;color:#2c7a5c}
.voice-player{display:flex;gap:10px;align-items:center;background:#f3f5ef;border-radius:12px;padding:8px 10px;margin:6px 0}.voice-player audio{flex:1;height:36px}.voice-player span{font-size:11px;color:#74817b;white-space:nowrap}
.trail{list-style:none;padding:0;margin:0}.trail a{display:flex;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid #eef1ea;font-size:13px;font-weight:700;color:#233c36}.trail a span{margin-left:auto;font-size:11px;color:#9aa69c;font-weight:800}.trail li:last-child a{border:0}
.leaders{list-style:none;padding:0;margin:0 0 6px}.leaders li{display:flex;gap:10px;align-items:center;padding:6px 0;font-size:13px}.leaders .avatar{width:34px;height:34px;border-radius:50%;overflow:hidden;padding:0;background:#dceee7}.leaders .avatar .child-avatar{border-radius:50%}
/* ---- labs ---- */
.labs-hero{display:grid;grid-template-columns:190px 1fr 280px;gap:24px;align-items:center;background:#f0f3eb;border-radius:22px;padding:24px 28px;margin-bottom:18px}
.labs-hero h2{font-size:26px;margin:6px 0 8px}.labs-hero p{font-size:13px}
.labs-skills{display:grid;grid-template-columns:1fr 1fr;gap:10px}.labs-skills div{background:#fff;border-radius:14px;padding:10px 12px}.labs-skills small{font-size:10px;font-weight:900;letter-spacing:1px;color:#9aa69c}.labs-skills b{display:block;font:24px Fredoka,sans-serif}
.lab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-top:6px}
.lab-card{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid #e7ebe4;border-radius:18px;padding:16px 18px;text-align:left;cursor:pointer;transition:transform .2s,box-shadow .2s;font:inherit;color:inherit;width:100%}
.lab-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px #4a756414}.lab-card h3{font-size:17px;margin-top:6px}.lab-card p{font-size:12px;margin-top:4px}
.lab-tobi{width:92px;flex-shrink:0;background:#f3f6ee;border-radius:14px;padding:6px}.lab-tobi .tobi-img{max-width:100%}.lab-tobi.small{width:64px;padding:4px}
.labs-intro{display:flex;gap:20px;align-items:center;background:#f0f3eb;border-radius:22px;padding:20px 26px;margin-bottom:18px}.labs-intro .tobi-img{width:130px;max-width:130px;margin:0;flex-shrink:0}.labs-intro h2{font-size:24px;margin:4px 0 6px}
.level-path li.got{color:#9aa69c}.level-path li.now{font-weight:800}.level-path li.now .pill{background:#357965;color:#fff}
.two-grid-wide{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start}
.script-picker{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.chip{display:inline-flex;align-items:center;border:1px solid #e7ebe4;background:#fff;border-radius:20px;padding:7px 12px;font-size:12px;font-weight:800;color:#4c6a5e;text-decoration:none;cursor:pointer;font-family:inherit}.chip.active{background:#357965;color:#fff;border-color:#357965}.chip:hover{border-color:#357965}
.word-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.review{background:#f3f7ed;border-radius:16px;padding:18px;margin-top:16px}.review h3{font-size:18px}
.review-stats{display:flex;gap:18px;margin:10px 0}.review-stats div{text-align:center}.review-stats b{display:block;font:26px Fredoka,sans-serif;color:#233c36}.review-stats small{font-size:10px;color:#74817b;letter-spacing:.6px;font-weight:800}
.small-list li{font-size:12px}
.sound-card.today{border:2px solid #d49a48}
.g-result-light{text-align:center;padding:30px}.g-result-light .tobi-img{max-width:160px}.g-result-light h2{font:56px Fredoka,sans-serif;margin:10px 0 4px}
.feedback{background:#eaf4ec;border-radius:12px;padding:10px 14px;font-weight:700}
@media (max-width:1100px){.home-grid{grid-template-columns:240px 1fr}.home-right{display:none}.labs-hero{grid-template-columns:150px 1fr}.labs-skills{grid-column:1/-1;grid-template-columns:repeat(4,1fr)}.two-grid-wide{grid-template-columns:1fr}}
@media (max-width:760px){.home-grid{grid-template-columns:1fr}.home-left{position:static}.labs-hero{grid-template-columns:1fr}.labs-skills{grid-template-columns:repeat(2,1fr)}}
/* ---- habits ---- */
.habit-card{padding:18px 20px;margin-bottom:14px;background:linear-gradient(135deg,#fffdf7,#f3f7ed)}
.habit-top{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.habit-tobi{width:96px;flex-shrink:0}.habit-tobi .tobi-img{max-width:96px;margin:0}
.habit-top h3{font-size:22px;margin:4px 0 4px}
.big-mic-btn{background:linear-gradient(100deg,#e06a4a,#d49a48)!important;color:#fff!important;box-shadow:0 10px 24px #d46c4a33;min-height:50px;font-size:14px}
.habit-grid{display:grid;gap:8px;margin-top:14px;border-top:1px solid #eef1ea;padding-top:12px}
.habit-row{display:flex;gap:12px;align-items:center;padding:8px 10px;border-radius:12px;color:#233c36;text-decoration:none}.habit-row:hover{background:#fff}
.habit-row .tile-icon{width:36px;height:36px;border-radius:11px}.habit-row b{font-size:13px;display:block}.habit-row small{font-size:11px;color:#74817b}
.habit-row .dots{margin-left:auto;display:flex;gap:4px}.habit-row .dots i{width:10px;height:10px;border-radius:50%;background:#e7ebe4;display:block}.habit-row .dots i.on{background:#5ec099}
.habit-row.done .dots i:last-child{background:#5ec099}.habit-cta{font-weight:900;color:#357965;width:18px;text-align:center}
/* ---- my studio (immersive stage) ---- */
.studio-wrap{display:flex;flex-direction:column;gap:14px}
.studio-modes{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.studio-modes .chip{gap:6px}.studio-modes select.chip{appearance:auto;padding:6px 10px}
.stage{position:relative;min-height:620px;border-radius:28px;overflow:hidden;background:#0f1d19;perspective:900px;box-shadow:inset 0 0 120px #000a,0 30px 60px #0f1d1933;isolation:isolate}
.stage-sky{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 20%,#2b5d4c 0,#15302a 40%,#0b1613 75%)}
.stage-stars{position:absolute;inset:0;background-image:radial-gradient(#fff8 1px,transparent 1.5px),radial-gradient(#fff5 1px,transparent 1.5px);background-size:120px 120px,70px 70px;background-position:0 0,30px 50px;opacity:.5;animation:twinkle 6s ease-in-out infinite alternate}
@keyframes twinkle{to{opacity:.25}}
.stage-light{position:absolute;top:-10%;width:40%;height:120%;background:linear-gradient(180deg,#f5cd8866 0,#f5cd8822 40%,transparent 75%);clip-path:polygon(45% 0,55% 0,100% 100%,0 100%);mix-blend-mode:screen;animation:sway 9s ease-in-out infinite alternate}
.stage-light.left{left:2%;transform-origin:top}.stage-light.right{right:2%;animation-delay:-4s}
@keyframes sway{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}}
.stage-curtain{position:absolute;top:0;bottom:0;width:9%;background:repeating-linear-gradient(90deg,#7a2d2a 0 14px,#5a1f1d 14px 28px);box-shadow:inset -20px 0 40px #0008}
.stage-curtain.left{left:0;border-radius:0 40px 40px 0}.stage-curtain.right{right:0;border-radius:40px 0 0 40px;box-shadow:inset 20px 0 40px #0008}
.stage-floor{position:absolute;left:0;right:0;bottom:0;height:45%;transform:rotateX(62deg);transform-origin:bottom;background:linear-gradient(180deg,#1b3a30 0,#102520 100%);overflow:hidden}
.floor-grid{position:absolute;inset:-100% -50% 0 -50%;background-image:linear-gradient(#5ec09933 1px,transparent 1px),linear-gradient(90deg,#5ec09933 1px,transparent 1px);background-size:60px 60px;animation:gridmove 4s linear infinite}
@keyframes gridmove{from{background-position:0 0}to{background-position:0 60px}}
.stage-tobi{position:absolute;left:13%;bottom:18%;width:150px;text-align:center;z-index:3;animation:float 5s ease-in-out infinite}.stage-tobi .tobi-img{max-width:150px;filter:drop-shadow(0 20px 20px #000a)}.stage-tobi-label{display:block;color:#f5cd88;font-size:11px;font-weight:800;margin-top:4px;background:#0008;border-radius:20px;padding:4px 8px}
@keyframes float{50%{transform:translateY(-8px)}}
.stage-screen{position:absolute;right:11%;top:7%;width:40%;background:#071412e6;border:1px solid #5ec09966;border-radius:18px;padding:18px 22px;color:#fff;z-index:3;box-shadow:0 0 40px #5ec09933;max-height:48%;overflow:auto}
.stage-screen h2{color:#fff;font-size:22px;margin:4px 0 8px}.stage-screen p{color:#9db4a8;font:500 17px/1.5 Fredoka,sans-serif;margin:0 0 4px;padding:4px 8px;border-radius:8px}.stage-screen p.current{background:#f3f7ed;color:#254438}
.stage-tips{margin:6px 0 0;padding-left:18px;color:#c9d9d0;font-size:13px;line-height:1.7}
.stage-center{position:absolute;left:50%;bottom:9%;transform:translateX(-50%);z-index:4;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.wave{width:520px;max-width:80vw;height:90px;opacity:.25;transition:opacity .3s}.wave.on{opacity:1}
.mic-ring{width:110px;height:110px;border-radius:50%;border:0;background:radial-gradient(circle at 35% 30%,#ffd98c,#d49a48 60%,#a86d26);color:#1b2a24;display:grid;place-items:center;cursor:pointer;box-shadow:0 0 0 14px #f5cd8822,0 0 0 28px #f5cd8811,0 18px 40px #0008;transition:transform .2s}.mic-ring svg{width:46px;height:46px;stroke-width:2}
.mic-ring:hover{transform:scale(1.05)}.mic-ring.live{background:radial-gradient(circle at 35% 30%,#ff8a73,#e04848 60%,#8e1f1f);animation:livepulse 1.2s infinite}
.mic-ring.done{background:#5ec099;color:#fff}.stop-square{width:34px;height:34px;background:#fff;border-radius:6px;display:block}
@keyframes livepulse{50%{box-shadow:0 0 0 22px #e0484833,0 0 0 44px #e0484811,0 18px 40px #0008}}
.stage-timer{color:#f5cd88;font:16px Fredoka,sans-serif;background:#0008;border-radius:20px;padding:6px 14px}
.stage-audience{position:absolute;left:0;right:0;bottom:0;height:16%;display:flex;justify-content:center;gap:6px;align-items:flex-end;padding-bottom:6px;z-index:5;background:linear-gradient(transparent,#06100de6)}
.seat{width:46px;height:46px;border-radius:50%;overflow:hidden;border:2px solid #0b1613;filter:brightness(.45) saturate(.6);transform:translateY(calc(var(--i) % 3 * 3px));animation:bob 3s ease-in-out infinite;animation-delay:calc(var(--i) * -.3s)}.seat .child-avatar{border-radius:50%}
@keyframes bob{50%{transform:translateY(-3px)}}
.studio-review h3{font-size:20px}
.mood-pick{display:flex;gap:6px;flex-wrap:wrap}.mood-pick .chip{cursor:pointer}
.diary-list{margin-top:14px}
@media (max-width:900px){.stage{min-height:560px}.stage-screen{left:5%;right:5%;width:auto;top:4%;max-height:36%}.stage-tobi{display:none}.stage-curtain{width:5%}.wave{height:60px}.stage-audience{display:none}}