@font-face{font-family:Fira Code;font-style:normal;font-weight:300 700;font-display:swap;src:url(/_next/static/media/999e639cd9d85971-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-family:Fira Code;font-style:normal;font-weight:300 700;font-display:swap;src:url(/_next/static/media/9af6411484c7e20a-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:Fira Code;font-style:normal;font-weight:300 700;font-display:swap;src:url(/_next/static/media/e6b5cfd5a74e1cae-s.woff2) format("woff2");unicode-range:u+1f??}@font-face{font-family:Fira Code;font-style:normal;font-weight:300 700;font-display:swap;src:url(/_next/static/media/6aacc40b7795b725-s.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}@font-face{font-family:Fira Code;font-style:normal;font-weight:300 700;font-display:swap;src:url(/_next/static/media/67110d8fe39c5e84-s.woff2) format("woff2");unicode-range:u+2000-2001,u+2004-2008,u+200a,u+23b8-23bd,u+2500-259f}@font-face{font-family:Fira Code;font-style:normal;font-weight:300 700;font-display:swap;src:url(/_next/static/media/046b90749014f852-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:Fira Code;font-style:normal;font-weight:300 700;font-display:swap;src:url(/_next/static/media/3703c28dcda155b1-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:Fira Code Fallback;src:local("Arial");ascent-override:73.56%;descent-override:23.92%;line-gap-override:0.00%;size-adjust:134.59%}.__className_13fb82{font-family:Fira Code,Fira Code Fallback;font-style:normal}.__variable_13fb82{--font-code:"Fira Code","Fira Code Fallback"}@font-face{font-family:Montserrat;src:url(/fonts/Montserrat-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Montserrat;src:url(/fonts/Montserrat-SemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Montserrat;src:url(/fonts/Montserrat-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Montserrat;src:url(/fonts/Montserrat-Black.woff2) format("woff2");font-weight:900;font-style:normal;font-display:swap}:root{color-scheme:light;--bg-top:#fef3e2;--bg-bottom:#dbeafe;--panel:#ffffff;--panel-border:#cbd5e1;--ink:#111827;--muted:#475569;--accent:#748DF4;--accent-soft:#e8ecfe;--accent-strong:#0f172a;--level1-bg:#dcfce7;--level1-border:#22c55e;--level2-bg:#f3e8ff;--level2-border:#B95DCD;--ok-bg:#dcfce7;--ok-border:#22c55e;--err-bg:#fee2e2;--err-border:#ef4444;--success:#16a34a;--shadow:0 12px 30px rgba(15,23,42,0.12)}*,:after,:before{box-sizing:border-box}body{margin:0;min-height:100svh;font-family:Montserrat,sans-serif;color:var(--ink);background:linear-gradient(135deg,var(--bg-top),var(--bg-bottom))}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(rgba(15,23,42,.08) 1.2px,transparent 0);background-size:28px 28px;opacity:.45;z-index:-1}h1,h2,h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900}ol,p,ul{margin:0}.app{min-height:100svh;padding:clamp(14px,1.6vw,22px);display:grid;grid-gap:14px;gap:14px}.panel{background:var(--panel);border:2px solid var(--panel-border);border-radius:18px;box-shadow:var(--shadow);padding:14px}.puzzle-header{display:grid;grid-gap:10px;gap:10px}.puzzle-head-row{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap}.puzzle-head-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.rh-logo{height:28px;width:auto}.puzzle-meta-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.puzzle-count{letter-spacing:.08em;font-size:.78rem;color:var(--muted)}.level-badge,.puzzle-count{text-transform:uppercase;font-weight:800}.level-badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.72rem;letter-spacing:.06em}.level-badge.level-1{background:var(--level1-bg);border:2px solid var(--level1-border);color:#166534}.level-badge.level-2{background:var(--level2-bg);border:2px solid var(--level2-border);color:#7e22ce}.puzzle-header h1{font-size:clamp(1.15rem,1.2vw + .95rem,1.7rem)}.puzzle-description{color:var(--muted);font-size:.9rem;margin-top:2px}.puzzle-nav{display:flex;gap:8px;flex-wrap:wrap}.puzzle-instructions{margin:0;padding-left:20px;display:grid;grid-gap:6px;gap:6px;color:var(--accent-strong);line-height:1.5}.puzzle-instructions li{font-size:.95rem}.instruction-token{display:inline-block;margin:0 2px;padding:1px 8px;border-radius:999px;font-weight:800;font-size:.86rem;border:2px solid #cbd5e1;color:#0f172a;background:#f8fafc;font-family:var(--font-code),"Fira Code",monospace}.token-blue{border-color:#3b82f6;background:#dbeafe;color:#1e3a8a}.token-pink{border-color:#ec4899;background:#fce7f3;color:#831843}.instruction-token.kind-code{font-family:var(--font-code),"Fira Code",monospace}.instruction-token.kind-screen{font-family:Montserrat,sans-serif;font-weight:700;letter-spacing:.01em}.step-strip{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 8px}.step-card{flex:0 0 auto;min-width:280px;max-width:380px;background:#ffffff;border:2px solid #bfdbfe;border-left-width:6px;border-radius:14px;padding:12px;display:grid;grid-gap:8px;gap:8px;box-shadow:var(--shadow)}.step-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.step-num{text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;font-weight:800;color:#ffffff;background:var(--muted);border-radius:6px;padding:2px 8px}.step-label{font-size:.94rem;font-weight:800;line-height:1.3}.step-hint,.step-label{color:var(--accent-strong)}.step-hint{margin:0;padding:10px 12px;font-family:var(--font-code),"Fira Code",monospace;font-size:.82rem;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;white-space:pre-wrap;word-break:break-word;line-height:1.45}.step-hint code,.step-hint-placeholder{-moz-user-select:none;user-select:none;-webkit-user-select:none}.step-hint-hidden{background:#fef9c3;border-color:#facc15;border-style:dashed}.step-hint-placeholder{font-family:Montserrat,sans-serif;font-style:italic;font-size:.82rem;font-weight:700;color:#854d0e}.step-tone-blue{border-color:#bfdbfe #bfdbfe #bfdbfe #3b82f6;background:#eff6ff}.step-tone-blue .step-num{background:#3b82f6}.step-tone-blue .step-hint{border-color:#bfdbfe;background:#f5f9ff}.step-tone-green{border-color:#bbf7d0 #bbf7d0 #bbf7d0 #22c55e;background:#f0fdf4}.step-tone-green .step-num{background:#22c55e}.step-tone-green .step-hint{border-color:#bbf7d0;background:#f6fef9}.step-tone-orange{border-color:#fed7aa #fed7aa #fed7aa #f59e0b;background:#fffbeb}.step-tone-orange .step-num{background:#f59e0b}.step-tone-orange .step-hint{border-color:#fed7aa;background:#fffaf0}.step-tone-pink{border-color:#fbcfe8 #fbcfe8 #fbcfe8 #ec4899;background:#fdf2f8}.step-tone-pink .step-num{background:#ec4899}.step-tone-pink .step-hint{border-color:#fbcfe8;background:#fef5f9}.step-tone-purple{border-color:#ddd6fe #ddd6fe #ddd6fe #8b5cf6;background:#faf5ff}.step-tone-purple .step-num{background:#8b5cf6}.step-tone-purple .step-hint{border-color:#ddd6fe;background:#fbf8ff}.workspace{grid-template-columns:minmax(0,1.4fr) minmax(320px,1fr);align-items:stretch}.left-column,.right-column,.workspace{display:grid;grid-gap:14px;gap:14px;min-height:0}.left-column,.right-column{align-content:start}.pane-html{display:grid;grid-gap:8px;gap:8px}.pane-label{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.html-pane{background:#f8fafc;border:2px solid #bfdbfe;border-radius:12px;overflow:hidden}.html-pane .cm-editor{background:transparent}.html-pane .cm-content{caret-color:transparent}.pane-html.is-editable .html-pane{background:#ffffff}.pane-html.is-editable .html-pane .cm-content{caret-color:auto}.pane-html.is-editable .html-pane,.pane-html.is-editable .html-pane .cm-editor,.pane-html.is-editable .html-pane .cm-scroller{min-height:240px}.pane-js{display:grid;grid-gap:10px;gap:10px}.pane-js-top{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}.js-editor{background:#f8fafc;border:2px solid #bfdbfe;border-radius:12px;overflow:hidden;min-height:220px}.js-editor .cm-editor{background:transparent;min-height:220px}.js-editor .cm-scroller{min-height:220px}.pane-preview{display:grid;grid-gap:8px;gap:8px}.pane-preview-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.preview-frame{background:#ffffff;border:2px solid #bfdbfe;border-radius:12px;overflow:hidden;display:block}.preview-frame iframe{width:100%;display:block;border:0}.preview-frame-tabbed{display:grid;grid-gap:8px;gap:8px}.preview-tabs{display:flex;gap:6px}.preview-tab{flex:0 0 auto;font-family:Montserrat,sans-serif;font-size:.82rem;font-weight:700;padding:6px 16px;border:2px solid #bfdbfe;border-radius:10px;background:#ffffff;color:var(--accent-strong);cursor:pointer;transition:background .1s ease,color .1s ease,transform .1s ease}.preview-tab:hover:not(.is-active){background:#f1f5f9}.preview-tab.is-active{background:var(--accent);border-color:var(--accent);color:#ffffff}.preview-tab:focus-visible{outline:3px solid rgba(116,141,244,.35);outline-offset:2px}.preview-tabs-reset{margin-left:auto;padding:5px 12px;font-size:.82rem}.timeline-controls{display:flex;gap:8px;flex-wrap:wrap}.btn{border:none;border-radius:11px;padding:8px 14px;font-size:.92rem;font-weight:800;font-family:Montserrat,sans-serif;cursor:pointer;transition:transform .1s ease,filter .1s ease}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn:focus-visible{outline:3px solid rgba(116,141,244,.35);outline-offset:2px}.btn.primary{background:var(--accent);color:#ffffff}.btn.primary:hover:not(:disabled){filter:brightness(.95)}.btn.ghost{background:#ffffff;color:var(--accent-strong);border:2px solid #94a3b8}.btn-dev-solution{font-size:.78rem;padding:5px 10px;border:2px solid #f59e0b;color:#92400e;background:#fef3c7;border-radius:8px}.dev-level-toggle{display:inline-flex;gap:4px;margin-left:6px;padding:3px;border:1px solid #f59e0b;border-radius:999px;background:#fffbeb}.dev-level-btn{font-family:Montserrat,sans-serif;font-size:.7rem;font-weight:800;letter-spacing:.04em;padding:3px 10px;border:none;border-radius:999px;background:transparent;color:#92400e;cursor:pointer;transition:background .1s ease,color .1s ease}.dev-level-btn:hover:not(.is-active){background:#fef3c7}.dev-level-btn.is-active{background:#f59e0b;color:#ffffff}.dev-level-btn:focus-visible{outline:2px solid rgba(245,158,11,.5);outline-offset:1px}.level-complete{display:grid;place-items:center;padding:48px 16px}.level-complete-card{display:grid;grid-gap:18px;gap:18px;text-align:center;max-width:640px;padding:56px 48px;background:#ffffff;border:2px solid #fde68a;border-radius:24px;box-shadow:0 24px 60px -32px rgba(116,141,244,.35)}.level-complete-eyebrow{margin:0;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:#b45309}.level-complete-headline{margin:0;font-size:1.8rem;font-weight:900;line-height:1.15;color:#0f172a}.level-complete-sub{margin:0;font-size:1rem;line-height:1.5;color:var(--muted)}.level-complete-sub strong{color:var(--accent-strong)}.status-panel{display:grid;grid-gap:10px;gap:10px;border-color:#fed7aa;background:#fffbeb}.status-hint{display:grid;grid-gap:4px;gap:4px;padding-bottom:10px;border-bottom:1px solid #fde68a}.hint-text{margin:0;font-size:.92rem;line-height:1.45}.hint-images,.hint-text{color:var(--accent-strong)}.hint-images{margin:6px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:.85rem}.hint-images-label{font-weight:700;margin-right:2px}.hint-image-chip{font-family:var(--font-code);font-size:.78rem;padding:2px 8px;border-radius:6px;border:1px solid #fed7aa;background:#fff7ed;color:#92400e;white-space:nowrap}.status-desc{color:var(--muted);font-size:.92rem}.status-success{color:var(--success);font-weight:800;font-size:1rem}.status-errors{display:grid;grid-gap:6px;gap:6px;color:#991b1b;font-weight:700;font-size:.92rem}@media (max-width:1024px){.workspace{grid-template-columns:1fr}}@media (max-width:640px){.app{padding:12px}.btn{flex:1 1 auto}.pane-js-top{flex-direction:column;align-items:flex-start}.timeline-controls{width:100%}}.feedback-explanation{margin-top:10px;padding-top:10px;border-top:1px solid var(--panel-border)}.feedback-loading{display:inline-flex;align-items:baseline;gap:.4em;flex-wrap:wrap;font-style:italic;color:var(--muted);font-size:.85rem;margin:0}.feedback-loading-spinner{display:inline-block;width:1em;height:1em;border-color:transparent transparent currentcolor currentcolor;border-style:solid;border-width:2px;border-radius:50%;opacity:.8;transform:translateY(.15em) rotate(0deg);animation:feedback-loading-spin .8s linear infinite}@keyframes feedback-loading-spin{0%{transform:translateY(.15em) rotate(0deg)}to{transform:translateY(.15em) rotate(1turn)}}.feedback-loading-message{animation:feedback-loading-fade .22s ease-out}.feedback-loading-elapsed{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-style:normal;opacity:.7}@keyframes feedback-loading-fade{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.feedback-loading-message,.feedback-loading-spinner{animation:none}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.feedback-text{color:var(--ink);line-height:1.65;font-size:.9rem;margin:0}.status-pass{display:flex;flex-direction:column;gap:10px}.btn-finish-level{align-self:flex-start;background:var(--accent);color:#fff;border:none;border-radius:8px;padding:8px 18px;font:inherit;font-weight:600;cursor:pointer;transition:filter .15s}.btn-finish-level:hover{filter:brightness(.92)}