:root{font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#273c33;background:#f7f8f2;font-synthesis:none;--green:#245b47;--border:#dfe5da;--muted:#66766c;--cream:#f7f8f2}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.4;cursor:default}button,input,select,summary{outline-offset:4px}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #d79c32}button{transition:background .15s,transform .15s}button:not(:disabled):active{transform:translateY(1px)}button:hover:not(:disabled){filter:brightness(.96)}button{border:0}h1,h2,h3,p{margin:0}p{line-height:1.8}h1,h2,h3{letter-spacing:.025em}button,input,select{min-height:36px}a{color:var(--green)}[hidden]{display:none!important}
.site-header{height:94px;max-width:1280px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 40px;border-bottom:1px solid var(--border)}.brand{display:flex;gap:12px;align-items:center;background:none;text-align:left;font-weight:800;font-size:22px;letter-spacing:.08em;padding:0}.brand small{display:block;font-size:9px;letter-spacing:.24em;margin-top:3px;color:var(--muted)}.brand-mark{background:var(--green);color:white;border-radius:13px;width:46px;height:46px;display:grid;place-items:center;font-size:32px;font-weight:400}.site-header nav{display:flex;gap:24px;align-items:center;font-size:13px}.quiet{background:transparent;font-weight:700}.help-button{background:white;border:1px solid var(--border);border-radius:50%;width:36px;font-size:18px}.progress-label{font-variant-numeric:tabular-nums;color:var(--green);font-weight:700}.warning{max-width:1200px;margin:12px auto;background:#fff0cc;padding:12px 20px;font-size:14px}
main{max-width:1200px;margin:auto;padding:0 0 48px}.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:40px;align-items:center;padding:60px 36px 64px}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:800;color:#647a67}.tiny-leaf{color:#729957;font-size:18px;margin-right:8px}.hero h1{font-size:clamp(28px,3.2vw,40px);line-height:1.65;margin-top:15px;letter-spacing:.04em;font-weight:800}.hero em{font-style:normal;color:var(--green)}.hero-description{font-size:14px;color:var(--muted);margin-top:18px}.primary{background:var(--green);color:white;border-radius:10px;padding:13px 24px;font-weight:700;box-shadow:0 3px 0 #173f30;min-height:46px}.hero-cta{margin-top:26px;display:inline-flex;gap:44px;align-items:center}.hero-cta span{font-size:22px;line-height:1}.hero-note{display:block;font-size:11px;color:var(--muted);margin-top:16px}
.hero-art{position:relative;background:#e9efdf;border-radius:46% 42% 40% 45%;height:320px;display:grid;place-items:center;margin:10px 18px}.art-label{position:absolute;top:9px;left:36px;font-size:9px;letter-spacing:.18em;color:#69826b;transform:rotate(-6deg)}.mini-map{display:grid;grid-template-columns:repeat(5,1fr);width:260px;height:240px;gap:5px;transform:rotate(-9deg);padding:10px;background:#cbd9bc;border-radius:18px;box-shadow:0 12px 0 #b5c8a6,0 24px 30px #647b4220}.mini-map>span{background:#e3ecd7;border-radius:5px;position:relative;display:grid;place-items:center}.mini-map>span:nth-child(even){background:#dbe7cb}.mini-map .trail{background:#f9f3da!important}.art-command{position:absolute;bottom:15px;right:-5px;padding:15px 20px;background:white;box-shadow:0 6px 20px #30472d15;border-radius:10px;font-size:13px;transform:rotate(5deg)}.art-command b{margin-left:20px;color:#9ab677}.art-spark{position:absolute;font-size:44px;color:#7c9c58;right:15px;top:24px}.tree{font-size:42px;line-height:1;color:#739265}
.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:25px}.section-heading h2{font-size:24px;margin-top:10px}.section-heading>p{font-size:12px;color:var(--muted)}.journey-section{padding:0 36px}.journey-progress{background:#edf0e7;border:1px solid #e1e7d9;border-radius:12px;padding:17px 22px;display:flex;align-items:center;gap:28px;font-size:12px;margin-bottom:25px}.journey-progress b{font-size:18px;margin-left:14px;color:var(--green)}.journey-progress small{font-size:12px;color:var(--muted)}.progress-track{flex:1;height:6px;background:#d7dfce;border-radius:8px;overflow:hidden}.progress-track i{height:100%;background:#6b9163;display:block}.theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.theme-card{background:#fff;border:1px solid var(--border);padding:24px 26px;border-radius:16px;--accent:#557950;--tint:#eef3e8}.theme-card.blue{--accent:#4e7c9b;--tint:#eaf2f6}.theme-card.orange{--accent:#a57635;--tint:#faf0df}.theme-card.purple{--accent:#806999;--tint:#f1edf6}.theme-card.pink{--accent:#a2677d;--tint:#f8edf1}.theme-top{display:flex;align-items:center;gap:12px}.theme-icon{height:40px;width:40px;background:var(--tint);color:var(--accent);font-size:25px;border-radius:12px;display:grid;place-items:center}.theme-number{font-size:10px;letter-spacing:.14em;color:var(--muted)}.theme-count{font-size:11px;color:var(--muted);margin-left:auto}.theme-card h3{font-size:19px;margin-top:17px;display:flex;align-items:center;gap:12px}.theme-card h3>span{font-size:10px;color:var(--accent);background:var(--tint);padding:4px 9px;border-radius:6px;white-space:nowrap}.theme-card>p{font-size:12px;color:var(--muted);margin-top:7px}.stage-buttons{display:flex;gap:9px;margin-top:22px}.stage-chip{flex:1;background:#f7f8f5;border:1px solid #e5e9e1;border-radius:9px;padding:8px 4px;color:#586659}.stage-chip>span{font-size:17px;font-weight:700}.stage-chip small{display:block;font-size:9px;margin-top:4px;font-weight:400}.stage-chip.recommended{border:1px solid #86a079;background:#eef4e7;color:var(--green);box-shadow:0 0 0 2px #eef4e7}.stage-chip.completed{background:#e7f0e6;color:var(--green)}
footer{max-width:1128px;margin:auto;padding:25px 0 35px;border-top:1px solid var(--border);display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}
.lesson{padding:24px 24px 0}.lesson-breadcrumb{display:flex;gap:18px;align-items:center;font-size:12px;color:var(--muted)}.text-button{background:none;padding:3px 0;font-size:12px;color:var(--green);text-decoration:underline;text-underline-offset:4px}.pill{border:1px solid var(--border);border-radius:20px;font-size:10px;padding:3px 10px}.lesson-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 0 18px}.lesson-heading h1{font-size:27px;margin-top:7px}.lesson-heading h1>span{font-size:15px;font-weight:500;color:#6e8c65;margin-right:10px}.objective{font-size:14px;margin-top:9px;max-width:760px}.hint-button{background:#fff5dc;border:1px solid #e6d9b5;color:#846526;border-radius:10px;padding:10px 16px;font-size:12px;white-space:nowrap}.hint-box{background:#fff5dc;border-radius:10px;padding:12px 18px;margin-bottom:15px;font-size:13px}.hint-box b{color:#846526;margin-right:8px}.lesson-tip{font-size:12px;color:var(--muted);margin-bottom:22px;background:#edf1e7;border-radius:8px;padding:11px 16px}.lesson-tip summary{cursor:pointer;color:#486146}.lesson-tip p{margin-top:10px}
.workspace{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr);gap:22px;align-items:start}.world-panel,.code-panel{border:1px solid var(--border);border-radius:16px;background:white;padding:22px;min-width:0}.world-panel{position:sticky;top:16px}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.panel-heading h2{font-size:16px}.panel-heading>span{font-size:10px;letter-spacing:.08em;color:var(--muted)}
.board-wrap{padding:15px 9px 28px 30px;position:relative;max-width:480px;margin:auto}.board{display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:4px;padding:6px;background:#bfcca9;border-radius:12px;box-shadow:0 7px 0 #aabd94;position:relative}.tile{aspect-ratio:1;background:#e7efd9;position:relative;display:grid;place-items:center;border-radius:5px;min-width:0}.tile.alternate{background:#dde8cd}.tile.goal-tile{background:#f4e7b7;box-shadow:inset 0 0 0 2px #dbc67a}.tile.robot-tile{background:#f7f4dc}.x-label,.y-label{position:absolute;font-size:10px;color:#697e60;line-height:1}.x-label{bottom:-24px;left:50%}.y-label{left:-24px;top:50%}.axis-x{position:absolute;right:0;bottom:-5px;font-size:11px;font-weight:700;color:#6a8063}.axis-y{position:absolute;left:0;top:-4px;font-size:11px;font-weight:700;color:#6a8063}.robot{display:block;width:34px;height:30px;background:#fdf9ea;border:2px solid #6d8661;border-radius:9px 9px 7px 7px;box-shadow:0 3px 0 #90a47a;position:relative;z-index:1}.robot:before{content:"";position:absolute;top:7px;left:5px;right:5px;background:#456451;border-radius:5px;height:12px}.robot:after{content:"";width:3px;height:8px;background:#6d8661;position:absolute;left:14px;top:-8px}.robot i,.robot b{position:absolute;top:11px;background:#dcebd2;width:3px;height:4px;z-index:2;border-radius:2px}.robot i{left:10px}.robot b{right:9px}.flag{font-size:38px;line-height:1;color:#b48b30}.gem{font-size:26px;color:#66a4b6;text-shadow:1px 2px #34758c}.rock{color:#7c8774;font-size:37px;text-shadow:0 3px #65715f}.flower{font-size:31px;color:#cf9a70}.flower.watered{color:#8666b5}.map-legend{display:flex;justify-content:center;gap:18px;font-size:10px;color:var(--muted);margin:18px 0}.position-row{display:flex;justify-content:space-between;gap:8px;background:#f6f8f1;padding:13px;border-radius:8px;font-size:12px}.position-row b{font-size:15px;margin-left:12px;font-variant-numeric:tabular-nums}.variable-boxes{display:flex;gap:8px;margin-top:12px}.variable-boxes>div{flex:1;border:1px solid #e3ddeb;border-radius:8px;overflow:hidden;text-align:center}.variable-boxes span{display:block;background:#f6f2f9;font-size:10px;padding:5px}.variable-boxes b{display:block;font-size:20px;padding:7px;color:#785a94}.array-panel{margin-top:16px;font-size:11px}.array-boxes{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.array-boxes>div{background:#f3f4fa;border:1px solid #dddfea;border-radius:6px;padding:6px;min-width:40px;text-align:center}.array-boxes b{font-size:16px;display:block}.array-boxes small{font-size:8px;display:block;margin-top:5px;color:#717b94}.array-boxes .reading{outline:2px solid #c49c44;background:#fff4d7}.muted{color:var(--muted);font-size:11px}.message{font-size:13px;line-height:1.7;margin-top:18px;padding:14px;background:#f4f6f0;border-radius:10px;border-left:3px solid #b1c3a2}.message.success{background:#eaf4e7;border-color:#6a965e;color:#32622b}.message.retry{background:#fff4df;border-color:#d6ae5d;color:#785c2e}#success-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:16px}#success-actions span{font-size:11px;color:var(--muted)}
.palette-header{display:flex;justify-content:space-between;font-size:11px;margin-bottom:10px}.palette-header>span{color:var(--muted)}.palette{display:flex;flex-wrap:wrap;gap:7px;padding-bottom:17px;border-bottom:1px solid var(--border);max-height:200px;overflow:auto}.palette-command{font-size:11px;border-radius:7px;min-height:37px;padding:8px 11px;text-align:left;border:1px solid var(--card-border);background:var(--card-bg);color:var(--card-text)}.palette-command span{padding-left:8px}.movement{--card-border:#ccdfd0;--card-bg:#edf5ee;--card-text:#3a6b50}.control{--card-border:#e9d8b1;--card-bg:#fff6e4;--card-text:#876324}.values{--card-border:#ded4e8;--card-bg:#f5eff9;--card-text:#7b5f91}.action{--card-border:#cddfe8;--card-bg:#edf5f8;--card-text:#476e86}.program-label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;margin:13px 0 9px}.program-label button{font-size:10px}.program{min-height:210px;max-height:510px;overflow:auto;background:#fafbf8;border:1px dashed #d7dfd0;border-radius:10px;padding:10px}.empty-program{text-align:center;color:#83907d;font-size:12px;padding:24px 8px}.empty-program>span{display:block;font-size:30px;font-weight:200;margin-bottom:10px}.empty-program small{display:block;font-size:10px;margin-top:3px}.command-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:8px;padding:8px;margin-bottom:7px}.command-line{display:flex;align-items:center;gap:7px}.card-number{font-size:9px;color:var(--muted);align-self:flex-start;padding-top:8px;min-width:10px}.card-fields{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:11px;flex:1;color:var(--card-text);min-width:0}.card-fields select,.card-fields input{border:1px solid var(--card-border);border-radius:5px;background:#ffffffba;padding:4px;font-size:11px;color:inherit;min-height:30px;max-width:100%}.number-input{width:54px}.list-input{width:145px}.card-tools{display:flex;align-self:flex-start}.card-tools button{font-size:13px;background:none;padding:3px;color:var(--card-text);min-height:30px;min-width:23px}.card-tools button:hover{background:#ffffff90;border-radius:4px}.nested{border-left:2px solid var(--card-border);padding-left:9px;margin:8px 0 0 11px}.branch-label{font-size:10px;margin:7px 0;color:var(--card-text)}.insert-target{font-size:10px;color:#7b8876;min-height:30px;padding:6px 9px;background:transparent;border:1px dashed #d3dbcc;border-radius:5px;width:100%;text-align:left}.insert-target.selected{background:#e8efdd;border-color:#a6bb91;color:#49683a}.command-card.executing>.command-line{outline:2px solid #d6a83d;outline-offset:4px;background:#fff6d3;border-radius:4px}.run-controls{display:flex;gap:7px;flex-wrap:wrap;margin-top:16px}.run-controls .primary{flex:1;padding:11px 16px;font-size:12px;min-width:120px}.secondary{border:1px solid var(--border);background:#f8faf5;border-radius:8px;padding:8px 10px;font-size:11px}.speed-row{display:flex;justify-content:space-between;align-items:center;margin-top:13px;font-size:10px;color:var(--muted)}.speed-row select{background:transparent;border:0;color:var(--green);font-size:11px}.lesson-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:24px;font-size:11px;color:var(--muted)}
dialog{border:1px solid var(--border);border-radius:20px;max-width:550px;width:calc(100% - 32px);padding:34px;color:#273c33;box-shadow:0 25px 90px #1c382833}dialog::backdrop{background:#183c3266;backdrop-filter:blur(3px)}dialog h2{font-size:22px;margin:10px 0 22px}dialog p{font-size:13px;margin-top:12px}.dialog-close{position:absolute;right:14px;top:10px;background:none;font-size:26px}.help-steps{padding-left:24px}.help-steps li{padding-left:5px;margin-bottom:16px}.help-steps p{margin-top:4px}
@media(min-width:1300px){.hero{padding-top:70px;padding-bottom:76px}}
@media(max-width:1000px){main{padding:0 16px 35px}.site-header{padding:0 24px;height:80px}.hero{padding:45px 15px;gap:18px}.hero-art{margin:0;height:290px}.hero h1{font-size:30px}.mini-map{width:230px;height:220px}.journey-section{padding:0 15px}.workspace{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:14px}.world-panel,.code-panel{padding:15px}.lesson{padding:22px 0}.theme-card{padding:20px}.section-heading>p{max-width:180px}footer{margin:0 30px}}
@media(max-width:760px){.hero{grid-template-columns:1fr;padding:36px 10px}.hero h1{font-size:31px}.hero-art{display:none}.hero-description{font-size:13px}.hero-note{font-size:10px}.site-header{padding:0 18px;height:76px}.brand{font-size:18px}.brand-mark{width:39px;height:39px}.site-header nav{gap:12px}.quiet{font-size:11px}.progress-label{display:none}.section-heading{display:block}.section-heading>p{max-width:none;margin-top:10px}.section-heading h2{font-size:22px}.journey-section{padding:0 5px}.journey-progress{gap:14px;padding:14px;font-size:10px}.journey-progress>span:last-child{display:none}.theme-grid{grid-template-columns:1fr;gap:14px}.theme-card{padding:20px}.theme-card h3{font-size:18px}.workspace{grid-template-columns:1fr}.world-panel{position:static}.board-wrap{max-width:360px}.lesson-heading h1{font-size:23px}.lesson-heading{align-items:flex-start;gap:10px;flex-wrap:wrap}.hint-button{font-size:11px}.lesson-breadcrumb{gap:10px;flex-wrap:wrap}.objective{font-size:13px}.code-panel{padding:18px}.program{max-height:520px}.lesson-bottom{display:block}.lesson-bottom button{display:block;margin-top:10px}footer{display:block;margin:0 22px;line-height:2}footer span{display:block}.card-tools button{min-width:27px;min-height:36px}.palette-command{min-height:42px}.hero-cta{width:100%;justify-content:space-between}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Focused learning interface */
.site-header { height: 78px; }
.brand { font-size: 22px; letter-spacing: .025em; }
.site-header nav, .quiet { font-size: 14px; }
.journey-section { padding-top: 38px; }
.section-heading { align-items: center; margin-bottom: 28px; }
.section-heading h1 { font-size: 28px; }
.theme-card { padding: 22px 26px; }
.theme-top h2 { font-size: 22px; }
.theme-count { font-size: 14px; }
.stage-buttons { margin-top: 20px; gap: 12px; }
.stage-chip { position: relative; height: 58px; padding: 8px; }
.stage-chip > span { font-size: 22px; }
.stage-chip .stage-check { position: absolute; right: 7px; top: 4px; font-size: 13px; }
.lesson { padding-top: 18px; }
.lesson-breadcrumb, .text-button { font-size: 14px; }
.lesson-heading { padding: 15px 0 12px; align-items: center; }
.lesson-heading h1 { font-size: 23px; }
.lesson-assistance { display: flex; gap: 9px; flex-wrap: wrap; }
.hint-button { font-size: 14px; padding: 9px 15px; background: white; border-color: var(--border); color: var(--green); }
.hint-button[aria-expanded="true"] { background: #e8efdd; border-color: #a6bb91; }
.objective { max-width: none; margin: 0 0 22px; padding: 20px 24px; border-left: 5px solid #6d9063; border-radius: 0 12px 12px 0; background: #edf2e4; font-size: 23px; line-height: 1.65; font-weight: 700; }
.hint-box { font-size: 16px; margin-bottom: 18px; }
.world-panel, .code-panel { padding: 20px; }
.panel-heading { margin-bottom: 14px; }
.panel-heading h2 { font-size: 19px; }
.panel-heading > span { font-size: 14px; }
.position-row { font-size: 14px; margin-top: 18px; }
.variable-boxes span, .array-panel { font-size: 13px; }
.array-boxes small { font-size: 11px; }
.array-boxes b { font-size: 19px; }
.message { font-size: 16px; }
.palette { display: flex; flex-direction: column; flex-wrap: nowrap; gap: 12px; max-height: 245px; margin-bottom: 16px; padding-bottom: 16px; }
.palette-group { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 10px; align-items: start; }
.palette-group h3 { font-size: 13px; padding-top: 11px; color: var(--card-text); }
.palette-group > div { display: flex; flex-wrap: wrap; gap: 7px; }
.palette-command { font-size: 14px; min-height: 42px; touch-action: none; cursor: grab; }
.arrays { --card-border: #cdddeb; --card-bg: #edf3fb; --card-text: #45688c; }
.functions { --card-border: #e5d4c3; --card-bg: #f9f0e7; --card-text: #8c653f; }
.program { min-height: 200px; padding: 8px 12px; max-height: 470px; }
.program.is-empty { display: grid; align-items: stretch; }
.program.is-empty > .command-group { display: grid; align-items: stretch; }
.program.is-empty .end-slot { min-height: 172px; font-size: 36px; background: transparent; border: 0; }
.command-card { margin-bottom: 0; padding: 9px 7px; }
.command-line { gap: 5px; }
.card-fields { font-size: 14px; gap: 5px; }
.card-fields select, .card-fields input { font-size: 14px; min-height: 34px; }
.number-input { width: 62px; }
.card-number { font-size: 12px; padding-top: 10px; }
.card-tools button { min-width: 27px; min-height: 34px; font-size: 16px; }
.drag-handle { padding: 0; min-width: 25px; min-height: 34px; align-self: start; background: none; color: var(--card-text); font-size: 22px; cursor: grab; touch-action: none; }
.branch-label { font-size: 13px; }
.drop-slot { display: block; height: 12px; min-height: 12px; width: 100%; border: 0; padding: 0; background: transparent; border-radius: 5px; pointer-events: none; }
.drop-slot.end-slot { height: 30px; min-height: 30px; margin-top: 7px; border: 1px dashed #cbd7c4; color: #7a9071; font-size: 20px; pointer-events: auto; }
.drop-slot.selected { border-color: #7e9c6b; background: #edf3e7; }
.drop-slot.drop-over { background: #b6d599 !important; box-shadow: inset 0 0 0 2px #5c8645; }
.command-dragging .drop-slot { pointer-events: auto; }
.command-dragging, .command-dragging * { cursor: grabbing !important; user-select: none; }
.drag-origin { opacity: .45; }
.drag-ghost { position: fixed; z-index: 1000; pointer-events: none; border-radius: 10px; border: 2px solid #729557; background: #f3f7eb; padding: 14px 22px; box-shadow: 0 8px 24px #28432c30; font-size: 16px; max-width: 250px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.run-controls .primary, .secondary { font-size: 14px; min-height: 44px; }
.speed-row, .speed-row select { font-size: 14px; }
.lesson-bottom { justify-content: flex-end; }
.clear-dialog { overflow: hidden; text-align: center; padding: 45px 35px 35px; max-width: 470px; border: 2px solid #d4e3c4; background: #fbfcf6; }
.clear-medal { position: relative; display: grid; place-items: center; width: 112px; height: 112px; margin: 5px auto 24px; border-radius: 50%; color: #fff9d7; background: #d3a441; border: 7px solid #f0d986; box-shadow: 0 7px 0 #a77c2d, 0 0 0 12px #f8edc9; font-size: 66px; animation: medal-pop .65s cubic-bezier(.2,1.6,.5,1) both; }
.clear-dialog h2 { position: relative; font-size: 28px; margin: 0 0 10px; }
.clear-dialog p { position: relative; font-size: 16px; color: var(--muted); }
.clear-buttons { position: relative; display: grid; gap: 12px; margin-top: 30px; }
.clear-buttons .primary { font-size: 17px; }
.confetti { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.confetti i { position: absolute; left: var(--x); top: -25px; width: 10px; height: 17px; border-radius: 2px; background: var(--color); animation: confetti-fall 2.3s var(--delay) ease-out both; }
@keyframes medal-pop { from { transform: scale(.25) rotate(-25deg); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes confetti-fall { 0% { transform: translateY(-30px) rotate(0); opacity: 1; } 100% { transform: translateY(550px) rotate(var(--turn)); opacity: 0; } }
@media (max-width: 1000px) { .palette-group { grid-template-columns: 1fr; gap: 5px; } .palette-group h3 { padding-top: 0; } }
@media (max-width: 760px) {
  .site-header { height: 70px; padding: 0 14px; }
  .brand { font-size: 17px; gap: 8px; }
  .brand-mark { width: 32px; height: 36px; font-size: 26px; }
  .site-header nav { gap: 6px; }
  .site-header .quiet { font-size: 12px; }
  .journey-section { padding-top: 25px; }
  .section-heading { display: flex; gap: 12px; }
  .section-heading h1 { font-size: 22px; }
  .section-heading .primary { padding: 10px 14px; font-size: 14px; }
  .theme-top h2 { font-size: 20px; }
  .theme-card { padding: 20px; }
  .lesson-heading { gap: 12px; }
  .lesson-heading h1 { font-size: 22px; }
  .objective { font-size: 20px; padding: 16px; margin-bottom: 16px; }
  .lesson-assistance { width: 100%; }
  .hint-button { flex: 1; }
  .code-panel, .world-panel { padding: 14px; }
  .palette { max-height: 260px; }
  .card-tools { flex-direction: column; }
  .card-tools button { min-height: 28px; }
  .command-line { gap: 4px; }
  .nested { margin-left: 4px; padding-left: 6px; }
  .program { padding: 8px; }
  .run-controls .primary { min-width: 100%; }
  .run-controls .secondary { flex: 1; }
}
@media (prefers-reduced-motion: reduce) { .clear-medal, .confetti i { animation: none; } .confetti { display: none; } }