:root{--ink:#17332e;--ink-soft:#45615a;--muted:#8b9a94;--line:#e7e9e1;--paper:#fbfaf5;--canvas:#f2f3ed;--white:#fff;--green:#b8f4cd;--green-deep:#21745e;--lime:#e2fb86;--violet:#8e7cf6;--violet-soft:#eeeafd;--blue:#77bdea;--blue-soft:#e5f3fc;--orange:#ffad6e;--orange-soft:#fff0df;--shadow:0 20px 50px #1f393114}*{box-sizing:border-box}html,body{background:var(--canvas);min-width:320px;min-height:100%}body{color:var(--ink);background:var(--canvas);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,Avenir Next,PingFang SC,Microsoft YaHei,sans-serif;overflow:hidden auto}button,input,textarea,select{font:inherit}button{cursor:pointer}.studio-shell{background:var(--canvas);width:100%;min-height:100vh;display:flex;overflow:visible}.sidebar{background:#e6f4ea;border-right:1px solid #3b66551c;flex-direction:column;flex:0 0 clamp(226px,13vw,280px);align-self:flex-start;width:clamp(226px,13vw,280px);height:100vh;min-height:100vh;max-height:100vh;padding:34px 21px 22px;display:flex;position:sticky;top:0;overflow:visible}.brand-lockup{align-items:center;gap:11px;padding:0 12px 36px;display:flex}.brand-mark{color:#f9fbef;background:var(--ink);border-radius:10px 10px 10px 3px;place-items:center;width:31px;height:31px;font-size:17px;display:grid;transform:rotate(-8deg)}.brand-lockup strong{letter-spacing:.14em;font-size:13px;line-height:1.2;display:block}.brand-lockup small{color:#6b837a;letter-spacing:.2em;margin-top:4px;font-size:8px;font-weight:700;display:block}.main-nav{gap:4px;display:grid}.nav-item{color:#5c756d;text-align:left;background:0 0;border:0;border-radius:10px;align-items:center;gap:12px;width:100%;padding:12px 13px;font-size:12px;font-weight:700;transition:all .18s;display:flex}.nav-item span{color:#84a297;text-align:center;width:18px;font-size:16px}.nav-item:hover,.nav-item.active{color:var(--ink);background:#ffffffb3;box-shadow:0 5px 15px #2e59470f}.nav-item.active span{color:var(--green-deep)}.sidebar-divider{background:#557b6c26;height:1px;margin:25px 10px 23px}.sidebar-section-label{color:#91a89f;letter-spacing:.15em;text-transform:uppercase;padding:0 13px 12px;font-size:9px;font-weight:800}.mini-stage-list{gap:2px;display:grid}.mini-stage{color:#657b73;text-align:left;background:0 0;border:0;border-radius:9px;grid-template-columns:24px 1fr 20px;align-items:center;gap:8px;width:100%;padding:8px 11px;font-size:11px;transition:all .18s;display:grid}.mini-stage:hover,.mini-stage.selected{color:var(--ink);background:#ffffff8f}.mini-stage b{color:#96a9a1;text-align:right;font-size:10px;font-weight:700}.mini-stage-icon{border-radius:7px;place-items:center;width:23px;height:23px;font-size:12px;font-weight:800;display:grid}.mini-stage-icon.violet,.stage-chip.violet,.focus-stage.violet{color:#6959d8;background:var(--violet-soft)}.mini-stage-icon.blue,.stage-chip.blue,.focus-stage.blue{color:#3987ba;background:var(--blue-soft)}.mini-stage-icon.orange,.stage-chip.orange,.focus-stage.orange{color:#cb7332;background:var(--orange-soft)}.mini-stage-icon.green,.stage-chip.green,.focus-stage.green{color:#277d60;background:#e3f7e8}.sidebar-spacer{flex:1;min-height:38px}.side-tip{background:#ffffff78;border:1px solid #6f987930;border-radius:15px;margin:0 5px 18px;padding:15px 14px 14px;position:relative;overflow:hidden}.side-tip:after{content:"";border:1px solid #6599792e;border-radius:50%;width:65px;height:65px;position:absolute;bottom:-19px;right:-19px}.tip-spark{color:#77a989;font-size:16px}.side-tip p{color:#648176;margin:9px 0 0;font-size:10px;line-height:1.65}.profile-chip{align-items:center;gap:9px;padding:10px 8px 1px;display:flex}.avatar{color:#f8fff4;letter-spacing:.06em;background:#789e8e;border-radius:9px;place-items:center;width:29px;height:29px;font-size:9px;font-weight:800;display:grid}.profile-chip strong,.profile-chip small{display:block}.profile-chip strong{color:#426258;font-size:10px}.profile-chip small{color:#94a9a0;letter-spacing:.12em;margin-top:3px;font-size:8px}.online-dot{background:#62bf7c;border:2px solid #d5edda;border-radius:50%;width:6px;height:6px;margin-left:auto}.studio-content{flex:auto;width:auto;min-width:0;max-width:2200px;height:auto;min-height:100vh;padding:0 clamp(32px,3.2vw,72px) 42px;overflow:visible}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;min-height:83px;display:flex}.breadcrumb,.topbar-actions,.quest-topline,.quest-progress-row,.level-xp-line,.level-footer,.section-heading,.filters-row,.script-card-topline,.focus-header,.focus-meta,.focus-actions,.editor-header,.editor-footer{justify-content:space-between;align-items:center;display:flex}.breadcrumb{color:var(--ink);gap:9px;font-size:11px;font-weight:700}.breadcrumb .muted{color:#9ba6a1;font-weight:500}.slash{color:#b4beb8;font-weight:400}.status-dot,.tiny-pulse{background:#78bf86;border-radius:50%;width:7px;height:7px;display:inline-block;box-shadow:0 0 0 4px #78bf861f}.topbar-actions{gap:15px}.persistence-pill{border:1px solid var(--line);color:#789086;background:#ffffff75;border-radius:999px;align-items:center;gap:8px;padding:8px 11px;font-size:10px;font-weight:700;display:flex}.persistence-pill.cloudflare-d1{color:#26785c;background:#effaf0;border-color:#c9e7d1}.persistence-pill.demo{color:#8a7a62;background:#fffaf0;border-color:#ece3cf}.persistence-pill.demo .tiny-pulse{background:#d7a85e;box-shadow:0 0 0 4px #d7a85e1f}.new-button{color:var(--paper);background:var(--ink);border:0;border-radius:9px;align-items:center;gap:8px;padding:10px 15px;font-size:11px;font-weight:750;transition:all .18s;display:flex;box-shadow:0 6px 15px #17332e21}.new-button:hover{background:#2a5349;transform:translateY(-1px)}.new-button span{color:var(--lime);font-size:16px;line-height:10px}.page-intro{justify-content:space-between;align-items:end;padding:52px 0 34px;display:flex}.eyebrow{color:#97a29d;letter-spacing:.19em;margin:0 0 9px;font-size:9px;font-weight:800}.eyebrow span{color:#b2c2b9}.page-intro h1{letter-spacing:-.055em;margin:0;font-size:clamp(32px,3.2vw,48px);line-height:1.08}.intro-copy{color:#7c8b85;margin:14px 0 0;font-size:14px}.streak-badge{color:#aa7e3b;background:#fff9ea;border:1px solid #f3e6c9;border-radius:10px;align-items:center;gap:8px;padding:10px 13px 10px 10px;font-size:10px;font-weight:750;display:flex}.streak-badge b{color:#855e27;font-size:13px}.flame{color:#fff;background:#f2b968;border-radius:8px;place-items:center;width:25px;height:25px;font-size:13px;display:grid}.hero-grid{grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr);gap:20px;display:grid}.quest-card{color:#f6ffed;min-height:270px;box-shadow:var(--shadow);background:#1a3b34;border-radius:20px;padding:30px 34px 26px;position:relative;overflow:hidden}.quest-card:before{content:"";pointer-events:none;background:radial-gradient(circle at 92% 18%,#cbff862e,#0000 29%),radial-gradient(circle at 78% 90%,#78dba529,#0000 32%);position:absolute;inset:0}.quest-card>*{z-index:1;position:relative}.quest-topline{justify-content:flex-start;gap:15px}.quest-label{color:#a7c3a8;letter-spacing:.15em;font-size:10px;font-weight:800}.quest-label span{color:var(--lime);margin-right:6px}.quest-xp{color:#d9f994;letter-spacing:.06em;background:#e2fb861a;border:1px solid #e2fb862e;border-radius:7px;padding:6px 9px;font-size:10px;font-weight:800}.quest-card h2{letter-spacing:-.04em;max-width:500px;margin:27px 0 9px;font-size:26px;line-height:1.2}.quest-card p{color:#a3bdb1;max-width:470px;margin:0;font-size:13px;line-height:1.7}.quest-progress-row{color:#b7cbbd;justify-content:flex-start;gap:12px;max-width:480px;margin-top:28px;font-size:10px}.progress-track,.level-track{background:#d6f2cd26;border-radius:999px;height:5px;position:relative;overflow:hidden}.progress-track{flex:1;height:6px}.progress-track span,.level-track span{border-radius:inherit;background:var(--lime);height:100%;display:block}.quest-button{color:var(--ink);background:var(--lime);border:0;border-radius:9px;align-items:center;gap:18px;margin-top:24px;padding:11px 13px 11px 16px;font-size:12px;font-weight:800;transition:all .18s;display:inline-flex}.quest-button:hover{background:#efffae;transform:translateY(-1px)}.button-arrow{background:#17332e1f;border-radius:7px;place-items:center;width:24px;height:24px;font-size:14px;display:grid}.quest-doodle{color:#e2fb8659;position:absolute}.doodle-one{font-size:25px;top:41px;right:32px;transform:rotate(14deg)}.doodle-two{letter-spacing:5px;font-size:15px;bottom:34px;right:62px;transform:rotate(-12deg)}.level-card{border:1px solid var(--line);background:var(--paper);border-radius:20px;min-height:270px;padding:32px 30px 27px;box-shadow:0 12px 28px #1f393108}.level-heading{align-items:center;gap:11px;display:flex}.level-orb{color:#4c681d;background:#eff9cb;border:1px solid #d5e5a0;border-radius:15px 15px 15px 4px;place-items:center;width:47px;height:47px;font-size:18px;font-weight:800;display:grid;transform:rotate(-6deg)}.level-orb span{transform:rotate(6deg)}.small-label{color:#9aa7a1;letter-spacing:.15em;font-size:8px;font-weight:800;display:block}.level-heading h3{letter-spacing:-.02em;margin:5px 0 0;font-size:16px}.level-rank{color:#9ca99f;letter-spacing:.1em;margin-left:auto;font-size:9px;font-weight:800}.level-xp-line{color:#81918b;margin-top:38px;font-size:11px}.level-xp-line b{color:var(--ink);font-size:11px}.level-track{background:#edf0e6;height:7px;margin-top:9px}.level-track span{background:#a7d964}.level-footer{color:#a1aaa5;margin-top:11px;font-size:9px}.section-block{margin-top:52px}.section-heading{align-items:end}.section-heading h2{letter-spacing:-.045em;margin:0;font-size:22px}.section-heading h2 span{color:#79948a;vertical-align:3px;background:#e5eee6;border-radius:7px;place-items:center;width:21px;height:21px;margin-left:6px;font-size:10px;display:inline-grid}.section-note{color:#9aa6a1;margin:0 0 1px;font-size:10px}.map-track{grid-template-columns:repeat(4,1fr);align-items:center;gap:0;margin-top:21px;padding:4px 0;display:grid}.map-step-wrap{align-items:center;display:flex;position:relative}.map-step{text-align:left;background:0 0;border:1px solid #0000;border-radius:15px;flex:1;align-items:center;gap:12px;min-width:0;padding:16px;transition:all .18s;display:flex;position:relative}.map-step:hover,.map-step.active{border-color:var(--line);background:var(--paper);box-shadow:0 8px 20px #1f39310a}.step-number{color:#b3beb8;letter-spacing:.1em;align-self:flex-start;font-size:8px;font-weight:800}.step-icon{border-radius:11px;place-items:center;width:38px;height:38px;margin-left:-2px;font-size:17px;font-weight:800;display:grid}.map-step.violet .step-icon{color:#6e61d8;background:var(--violet-soft)}.map-step.blue .step-icon{color:#3987ba;background:var(--blue-soft)}.map-step.orange .step-icon{color:#cb7332;background:var(--orange-soft)}.map-step.green .step-icon{color:#277d60;background:#e3f7e8}.step-copy{min-width:0}.step-copy b,.step-copy small{display:block}.step-copy b{color:var(--ink);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.step-copy small{color:#9ba9a2;white-space:nowrap;text-overflow:ellipsis;margin-top:5px;font-size:10px;overflow:hidden}.step-count{color:#789187;background:#f0f3ec;border-radius:8px;place-items:center;min-width:24px;height:24px;margin-left:auto;font-size:10px;font-weight:800;display:grid}.map-connector{z-index:1;color:#c0cbc4;letter-spacing:2px;margin:0 -6px;font-size:12px;position:relative}.workspace-grid{grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:20px;margin-top:52px;display:grid}.scripts-panel,.focus-panel{min-width:0}.scripts-heading{margin-bottom:17px}.text-button{color:#739287;background:0 0;border:0;padding:0;font-size:10px}.text-button span{color:var(--green-deep);margin-left:6px;font-size:13px}.filters-row{align-items:center;gap:14px;margin-bottom:13px}.search-box{background:#ffffff8c;border:1px solid #e2e6dd;border-radius:10px;flex:1;align-items:center;gap:9px;min-width:150px;padding:11px 14px;display:flex}.search-box span{color:#9aa9a1;font-size:20px;line-height:12px;transform:rotate(-15deg)}.search-box input{width:100%;color:var(--ink);background:0 0;border:0;outline:0;padding:0;font-size:12px}.search-box input::placeholder{color:#b1bbb5}.filter-tabs{background:#eaede5;border:1px solid #e2e6dd;border-radius:9px;gap:3px;padding:3px;display:flex}.filter-tabs button{color:#82918b;background:0 0;border:0;border-radius:7px;padding:7px 9px;font-size:10px}.filter-tabs button.active{color:var(--ink);background:#fff;font-weight:700;box-shadow:0 3px 7px #2841370d}.script-list{gap:8px;display:grid}.script-card{border:1px solid var(--line);cursor:pointer;background:#ffffff8a;border-radius:15px;grid-template-columns:1fr 36px;min-height:160px;transition:all .18s;display:grid;position:relative}.script-card:hover,.script-card.selected{background:var(--paper);border-color:#d3e4d6;box-shadow:0 9px 22px #1f39310b}.script-card.selected{border-left:3px solid #8ac19b}.script-card-main{text-align:left;cursor:pointer;background:0 0;border:0;width:100%;min-width:0;height:100%;padding:19px 7px 18px 21px;display:block}.script-card-topline{justify-content:flex-start;gap:9px}.stage-chip{border-radius:6px;align-items:center;gap:5px;padding:5px 7px;font-size:9px;font-weight:800;display:inline-flex}.stage-chip span{font-size:11px}.script-time{color:#b0bab5;font-size:10px}.script-card h3{letter-spacing:-.03em;white-space:nowrap;text-overflow:ellipsis;margin:13px 0 6px;font-size:16px;overflow:hidden}.script-card p{color:#86958e;white-space:nowrap;text-overflow:ellipsis;max-width:92%;margin:0;font-size:12px;line-height:1.6;overflow:hidden}.tag-row{gap:6px;margin-top:10px;display:flex;overflow:hidden}.tag-row span,.focus-tags span{color:#a1ada5;font-size:10px}.card-edit{color:#aab5ae;letter-spacing:2px;background:0 0;border:0;border-radius:8px;align-self:start;width:29px;height:31px;margin:13px 8px 0 0;padding:0;font-size:15px}.card-edit:hover{color:var(--ink);background:#edf2eb}.empty-state{text-align:center;border:1px dashed #d4ddd4;border-radius:13px;place-items:center;min-height:180px;padding:25px;display:grid}.empty-state>span{color:#aac7af;font-size:23px}.empty-state h3{margin:9px 0 4px;font-size:13px}.empty-state p{color:#96a49e;margin:0;font-size:10px}.empty-state button{color:var(--ink);background:var(--green);border:0;border-radius:7px;margin-top:13px;padding:7px 11px;font-size:10px;font-weight:700}.focus-panel{background:var(--paper);border:1px solid #e3e7de;border-radius:17px;align-self:start;min-height:420px;padding:25px 24px 19px;box-shadow:0 10px 26px #1f393109}.focus-header{align-items:start}.focus-header h2{letter-spacing:-.04em;margin:0;font-size:21px}.focus-icon{color:#7ea48b;background:#edf6eb;border-radius:9px;place-items:center;width:27px;height:27px;font-size:19px;display:grid}.focus-stage{border-radius:6px;align-items:center;gap:5px;margin-top:27px;padding:5px 7px;font-size:8px;font-weight:800;display:inline-flex}.focus-stage span{font-size:11px}.focus-panel h3{letter-spacing:-.04em;margin:16px 0 8px;font-size:20px;line-height:1.25}.focus-excerpt{color:#84928b;min-height:38px;margin:0;font-size:12px;line-height:1.7}.focus-divider{background:#e9ece5;height:1px;margin:18px 0 15px}.focus-meta{color:#a1aca6;margin-top:9px;font-size:9px}.focus-meta b{color:#65786f;font-weight:700}.focus-meta .xp-text{color:#7ca651}.focus-tags{flex-wrap:wrap;gap:6px;margin-top:19px;display:flex}.focus-actions{gap:7px;margin-top:22px}.focus-primary,.focus-secondary{border-radius:9px;justify-content:center;align-items:center;gap:9px;min-height:40px;padding:0 14px;font-size:11px;font-weight:800;transition:all .18s;display:inline-flex}.focus-primary{color:var(--ink);background:var(--green);border:0;flex:1}.focus-primary:hover{background:#cefadc;transform:translateY(-1px)}.focus-primary span{font-size:13px}.focus-secondary{color:#71857b;background:0 0;border:1px solid #e0e7df}.focus-secondary:hover{color:var(--ink);background:#f0f5ed}.focus-empty{color:#a8b7ac;text-align:center;place-items:center;min-height:260px;display:grid}.focus-empty span{font-size:26px}.focus-empty p{margin:10px 0 0;font-size:11px}.focus-footer{color:#a9b3ad;border-top:1px solid #edf0e9;align-items:center;gap:7px;margin-top:23px;padding-top:13px;font-size:9px;display:flex}.mini-lock{color:#9fc1aa}.notice-bar{color:#7d9187;background:#eaf7e6ab;border:1px solid #e0e9de;border-radius:10px;align-items:center;gap:9px;margin:36px 0 0;padding:12px 14px;font-size:11px;display:flex}.notice-dot{background:#83bd88;border-radius:50%;width:5px;height:5px}.notice-shortcut{color:#a3b2a8;letter-spacing:.08em;margin-left:auto;font-size:8px}.modal-backdrop{z-index:10;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#17332e6b;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.editor-modal{background:var(--paper);border:1px solid #fff9;border-radius:17px;width:min(620px,100%);max-height:calc(100vh - 40px);padding:24px 25px 20px;overflow:auto;box-shadow:0 25px 80px #0e262042}.editor-header{align-items:start;margin-bottom:22px}.editor-header h2{letter-spacing:-.05em;margin:0;font-size:21px}.modal-close{color:#82918a;background:#eef2eb;border:0;border-radius:8px;width:30px;height:30px;padding:0;font-size:21px;line-height:20px}.modal-close:hover{color:var(--ink);background:#e2eae1}.field-label{color:#72847b;margin-top:14px;font-size:10px;font-weight:750;display:block}.field-label input,.field-label textarea,.field-label select{width:100%;color:var(--ink);background:#fff;border:1px solid #e1e6dd;border-radius:8px;outline:0;margin-top:7px;padding:10px 11px;font-size:11px;transition:all .15s;display:block}.field-label input:focus,.field-label textarea:focus,.field-label select:focus{border-color:#9bc9a9;box-shadow:0 0 0 3px #9bc9a929}.field-label input::placeholder,.field-label textarea::placeholder{color:#b9c2bc}.field-label textarea{resize:vertical;min-height:52px;line-height:1.65}.field-label .body-input{min-height:145px}.field-hint{color:#adb8b2;margin-left:7px;font-size:9px;font-weight:500}.field-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.editor-footer{border-top:1px solid #e8ece4;align-items:center;margin-top:21px;padding-top:15px}.editor-footer>div{gap:7px;display:flex}.editor-tip{color:#9baa9f;font-size:9px}.editor-footer .focus-primary{min-width:102px}.focus-primary:disabled{cursor:wait;opacity:.65;transform:none}@media (max-width:1100px){.studio-content{padding:0 28px 28px}.sidebar{flex-basis:214px;width:214px}.map-track{grid-template-columns:repeat(2,1fr);row-gap:6px}.map-connector{display:none}.workspace-grid{grid-template-columns:minmax(0,1fr)}.focus-panel{min-height:0}.focus-footer{margin-top:20px}}@media (max-width:760px){html,body{height:auto}body{overflow:auto}.studio-shell{height:auto;min-height:100vh;display:block;overflow:visible}.sidebar{border-bottom:1px solid #3b66551c;border-right:0;width:100%;height:auto;min-height:auto;max-height:none;padding:17px 16px 13px;position:relative;overflow:visible}.brand-lockup{padding:0 2px 14px}.main-nav{gap:4px;display:flex;overflow-x:auto}.nav-item{flex:none;width:auto;padding:8px 10px}.sidebar-divider,.sidebar-section-label,.mini-stage-list,.side-tip,.profile-chip,.sidebar-spacer{display:none}.studio-content{width:100%;height:auto;padding:0 16px 24px;overflow:visible}.topbar{min-height:66px}.breadcrumb .muted,.slash{display:none}.topbar-actions{gap:7px}.persistence-pill{padding:7px 8px;font-size:9px}.new-button{padding:8px 10px;font-size:10px}.page-intro{align-items:start;gap:16px;padding:30px 0 22px}.page-intro h1{font-size:30px}.intro-copy{font-size:11px;line-height:1.6}.streak-badge{flex:none;padding:8px}.streak-badge span:last-child{display:none}.hero-grid{grid-template-columns:1fr}.quest-card,.level-card{min-height:0}.quest-card{padding:21px 20px}.quest-card h2{margin-top:20px;font-size:20px}.quest-card p{font-size:12px}.level-card{padding:21px 20px}.section-block,.workspace-grid{margin-top:30px}.section-heading{align-items:start;gap:8px}.section-note{display:none}.map-track{flex-direction:column;align-items:stretch;gap:5px;display:flex}.map-step-wrap{display:block}.map-step{width:100%}.filters-row{display:block}.filter-tabs{margin-top:8px;overflow-x:auto}.filter-tabs button{flex:none}.script-card{min-height:132px}.script-card-main{padding:15px 5px 14px 17px}.script-card h3{margin:11px 0 5px;font-size:14px}.script-card p{max-width:100%;font-size:10px}.notice-bar{align-items:flex-start;line-height:1.5}.notice-shortcut{display:none}.editor-modal{padding:20px 17px 17px}.field-grid{grid-template-columns:1fr;gap:0}.editor-footer{display:block}.editor-footer>div{justify-content:flex-end;margin-top:13px}}