:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#e9e9df;background:#101820;font-synthesis:none;color-scheme:dark;--muted:#93a3ae;--gold:#edc17c;--line:#2a3843;--panel:#18232d}html{scrollbar-gutter:stable}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:flex;flex-direction:column}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit;border:1px solid var(--line);background:#21303a;padding:11px 15px;border-radius:9px;font-size:13px}button:hover{background:#30414b}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}header{width:100%;max-width:1440px;margin:0 auto;padding:24px 40px;display:flex;align-items:center;gap:24px;box-sizing:border-box}.brand{font-size:24px;font-weight:700;letter-spacing:-1px}.brand-icon{color:var(--gold);font-size:31px;margin-right:7px}.header-note{font-size:9px;letter-spacing:2px;color:var(--muted);margin-left:auto}.quiet{background:transparent;color:var(--muted)}main{flex:1;width:100%;max-width:1360px;margin:14px auto;padding:0 24px;box-sizing:border-box}footer{margin-top:auto;color:#687d8b;text-align:center;font-size:11px;padding:28px}h1,h2,h3,p{margin-top:0}h1{font-size:52px;line-height:1.08;letter-spacing:-2px;font-weight:650}h2{font-size:27px;letter-spacing:-.7px}h3{font-size:18px}p{line-height:1.65;color:var(--muted);font-size:14px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:var(--gold);font-weight:650}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:340px;align-items:center;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:radial-gradient(ellipse at 80% 50%,#26343a,#15212b 65%);margin-bottom:36px}.hero-copy{padding:42px}.hero h1{margin:19px 0}.hero p{max-width:390px;margin:0}.hero-art{height:340px;position:relative}.section-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:24px 0 18px}.section-top h2{margin:0}.section-top span{font-size:12px;color:var(--muted)}.level-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.level-card{background:var(--panel);border:1px solid var(--line);border-radius:15px;overflow:hidden;transition:transform .2s,border-color .2s}.level-card:hover{transform:translateY(-3px);border-color:#a88d63}.card-art{height:145px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse,#31413e,#1b2931);position:relative}.mini-map{display:grid;gap:4px;transform:rotateX(48deg) rotateZ(-38deg);width:105px;height:105px}.mini-cell{background:#51656b;border-radius:2px;border-bottom:3px solid #30434b}.mini-cell.lamp{background:#e6bc72;box-shadow:0 0 15px #e6bc7266}.mini-cell.tree{background:#264d41}.mini-cell.hole{opacity:0}.badge{position:absolute;top:14px;left:16px;font-size:10px;color:#d4bd91;letter-spacing:1px}.completed{position:absolute;right:14px;top:14px;font-size:10px;color:#a3d2ac}.card-body{padding:22px}.card-body h3{margin-bottom:8px}.card-body p{font-size:12px;min-height:40px}.card-bottom{display:flex;justify-content:space-between;align-items:center;color:var(--gold);font-size:12px}.card-bottom span:first-child{color:var(--muted);font-size:10px}.game-top{display:flex;justify-content:space-between;align-items:center;margin:8px 0 20px;gap:12px}.back{color:var(--muted);font-size:13px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:18px}.world{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#14212b;min-width:0;display:flex;flex-direction:column}.world-heading{padding:27px 30px 0}.world-heading h2{margin:10px 0}.world-heading p{margin-bottom:0}.scene{min-height:440px;position:relative;flex:1}.scene canvas,.hero-art canvas{display:block;width:100%;height:100%;position:absolute;inset:0}.world-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 27px;font-size:12px;color:var(--muted)}.lamp-count{color:var(--gold)}aside,.panel{border:1px solid var(--line);border-radius:18px;background:var(--panel);padding:24px}.section-label{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:600}.help{font-size:11px;margin:8px 0 15px}.palette{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:25px}.command{display:flex;align-items:center;gap:8px;padding:10px 9px;text-align:left;background:#23343e;font-size:11px}.command .icon{font-size:20px;color:var(--gold);width:20px;text-align:center}.count{font-size:11px;font-weight:400;color:var(--muted)}.program{min-height:170px;max-height:400px;overflow:auto;border:1px dashed #46535a;border-radius:10px;padding:9px;background:#121d26;margin-top:12px}.program:empty:before,.loop-body:empty:before{content:'Перетягни команду сюди';display:block;text-align:center;font-size:11px;color:#788e9d;padding:35px 4px}.block{border:1px solid #38505a;border-radius:7px;background:#243640;margin:5px 0;padding:7px;font-size:12px}.block-head{display:flex;align-items:center;gap:8px;cursor:grab}.block-head>span:first-child{color:var(--gold);font-size:18px}.block-head button{margin-left:auto;background:transparent;border:0;padding:0 4px;font-size:18px;color:#9aaeb8}.block select{width:51px;padding:3px}.block.active{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}.loop{background:#2f3040;border-color:#57516a}.loop-body{min-height:65px;margin:8px 0 0 10px;padding:4px 6px;border-left:2px solid #9480b2}.loop-body.selected{background:#414151;outline:1px dashed #9480b2}.loop-hint{font-size:10px;color:#b5a7ca;display:block;padding-top:7px;cursor:pointer}.controls{display:flex;gap:8px;margin-top:18px}.primary{background:var(--gold);border-color:var(--gold);color:#292821;font-weight:650}.primary:hover{background:#f6d69d}#run{flex:1}.status{padding:12px 0 0;font-size:12px;min-height:55px;margin:0}.status.error{color:#efa29a}.status.success{color:#b1d9a0}.win{padding:18px;border:1px solid #6e8b5b;border-radius:10px;background:#26372f;margin-top:15px}.win p{color:#c4dab7;margin:0 0 12px}.rules{margin-top:16px;color:var(--muted);font-size:11px;line-height:1.8}.rules summary{cursor:pointer;color:#c6d2d8}.loading{padding:60px;text-align:center}.admin-layout{display:grid;grid-template-columns:300px 1fr;gap:18px}.admin-title{margin-bottom:24px}.admin-title h1{font-size:32px;margin-bottom:8px}.admin-fields{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:7px;font-size:12px;color:#aebbc4}input,select,textarea{background:#111d26;border:1px solid #3a4c58;border-radius:7px;padding:9px;color:#e4e8e7;min-width:0}textarea{resize:vertical;min-height:65px}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.check-list{display:grid;gap:9px;margin-top:8px}.check-list label{font-size:12px;color:#c1ccd2;display:flex;align-items:center;gap:8px}input[type=checkbox]{accent-color:#edc17c}.toolbar{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}.toolbar button.selected{border-color:var(--gold);background:#4a4236;color:#ffe1a7}.edit-grid{display:grid;gap:5px;max-width:580px;margin:20px auto;user-select:none;touch-action:none}.edit-cell{padding:0;aspect-ratio:1;min-width:0;border-radius:6px;border:1px solid #566b78;background:#304754;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:clamp(10px,2vw,18px)}.edit-cell small{font-size:10px;color:#a5b8c3}.edit-cell.hole{background:#101922;border:1px dashed #34424c;color:#52636e}.editor-main{min-width:0}.editor-main .scene{height:490px;min-height:300px}.admin-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.notice{font-size:12px;padding:12px 16px;background:#24343f;border-radius:9px;color:#bed0dc;margin-bottom:20px}.dirty{color:var(--gold);font-size:11px}.editor-legend{font-size:11px;line-height:1.8;color:var(--muted)}[hidden]{display:none!important}@media(min-width:1500px){.scene{min-height:540px}}@media(max-width:1000px){.game-layout{grid-template-columns:minmax(0,1fr) 310px}.hero h1{font-size:42px}.level-grid{grid-template-columns:repeat(2,1fr)}.header-note{display:none}}@media(max-width:740px){header{padding:20px;gap:10px}.brand{font-size:20px}main{padding:0 14px}.hero{grid-template-columns:1fr}.hero-copy{padding:28px}.hero h1{font-size:38px}.hero-art{height:240px}.game-layout,.admin-layout{grid-template-columns:1fr}.scene{min-height:340px}.world-heading{padding:22px 22px 0}.level-grid{grid-template-columns:1fr 1fr;gap:10px}.card-body{padding:15px}.card-art{height:125px}.card-body h3{font-size:16px}.card-body p{min-height:65px}.admin-layout>.panel{order:0}.program{max-height:none}.game-top{flex-wrap:wrap}.editor-main .scene{height:340px}.header-note{display:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Game: scene above a horizontal command workbench. */
.game-layout{grid-template-columns:minmax(0,1fr);gap:16px}.game-layout .world-heading{padding:20px 26px 0}.game-layout .world-heading h2{margin:7px 0}.game-layout .scene{min-height:280px;height:clamp(280px,38vh,430px);flex:none}.game-layout .world-bottom{padding:12px 26px}.program-panel{min-width:0;padding:22px 26px}.program-panel .palette{display:flex;gap:9px;overflow-x:auto;padding:3px 2px 12px;margin:0 0 15px}.program-panel .command{flex:0 0 auto;padding:12px 15px;gap:10px;min-height:48px;cursor:grab;font-size:12px;border-color:#3b505c;border-bottom-width:3px}.program-panel .command:active{cursor:grabbing}.command-grip{color:#718996;font-size:17px;margin-left:8px}.program-panel .program{display:flex;flex-wrap:wrap;align-content:flex-start;align-items:flex-start;gap:10px;padding:16px;min-height:125px;max-height:none;overflow:visible;border:1px dashed #4b6371;background:linear-gradient(135deg,#111e28,#16242d);transition:border-color .15s,background .15s}.program-panel .program:empty:before{content:'＋ Перетягни сюди першу команду';width:100%;padding:31px 5px;color:#819bab;font-size:12px}.program-panel .block{flex:0 0 auto;margin:0;min-width:145px;max-width:100%;padding:11px;border-radius:9px;box-shadow:0 3px 0 #0d1921;border-color:#415d6a}.program-panel .block-head{gap:10px;min-height:25px;white-space:nowrap}.block-number{font-size:9px;color:#829aa6;margin-left:6px}.program-panel .block-head button{margin-left:4px;width:20px}.program-panel .loop{min-width:310px;max-width:100%;flex:0 1 auto;padding:12px;background:#292d3d;border-color:#655d82}.program-panel .loop>.block-head{gap:9px}.program-panel .loop>.block-head select{margin-left:auto}.program-panel .loop-body{display:flex;flex-wrap:wrap;align-items:flex-start;align-content:flex-start;gap:8px;margin:10px 0 0;padding:12px;min-height:84px;min-width:280px;max-width:650px;border:1px dashed #70628c;border-radius:8px;background:#171f2d}.program-panel .loop-body:empty:before{width:100%;padding:19px 10px;content:'＋ Команди всередині циклу';color:#aaa0bd}.program-panel .loop-body .block{min-width:130px;font-size:11px;padding:8px}.program-panel .loop-hint{padding:8px 0 0;font-size:10px;border:0}.program-panel .controls{justify-content:flex-end;margin-top:12px}.program-panel #run{flex:0 1 180px}.program-panel .status{min-height:36px}.program-panel .rules{margin-top:8px}.drag-source{opacity:.35!important}.program.receiving{border-color:#cba46a;background:#1e2c31}.program-panel .drop-target{border-color:#f0c77e;box-shadow:inset 0 0 0 1px #edc17c33}.insertion-preview{display:flex;flex:0 0 auto;align-items:center;gap:10px;min-width:165px;max-width:100%;min-height:49px;padding:9px 13px;background:#edc17c18;border:2px dashed #edc17c;border-radius:9px;color:#f4d49f;pointer-events:none;box-shadow:0 0 18px #edc17c0c;font-size:12px}.insertion-preview small{display:block;font-size:9px;color:#bfa77f;margin-top:3px}.preview-icon{font-size:22px}.insertion-preview.loop-preview{min-width:250px;min-height:100px;border-color:#b4a1d8;background:#b4a1d818;color:#d3c3f0}.program-panel .block.active{border-color:var(--gold);box-shadow:0 0 0 2px #edc17c55,0 3px 0 #0d1921}@media(max-width:740px){.program-panel{padding:17px}.program-panel .palette{margin-bottom:12px}.program-panel .command{padding:10px;font-size:11px}.program-panel .program{padding:11px;gap:8px}.program-panel .block{min-width:125px;font-size:11px;padding:8px}.program-panel .block-head{gap:6px}.program-panel .loop{min-width:0;width:100%}.program-panel .loop-body{min-width:0;width:100%;padding:8px}.game-layout .scene{min-height:260px;height:300px}.game-layout .world-bottom{font-size:10px;gap:8px}.program-panel .insertion-preview{min-width:135px}.program-panel .loop-body .block{min-width:0}.program-panel .controls{justify-content:stretch}.program-panel #run{flex:1}}
.program-panel .command,.program-panel .block-head{touch-action:none;user-select:none}.drag-floating{position:fixed;top:0;left:0;z-index:1000;display:flex;align-items:center;gap:10px;padding:13px 17px;border-radius:10px;background:#314651;border:1px solid #f0cb83;color:#fff0cf;box-shadow:0 10px 30px #0007;pointer-events:none;font-size:12px;will-change:transform}.drag-floating>span{font-size:22px;color:#edc17c}.drag-floating.invalid{opacity:.55}.program-panel .command:disabled{cursor:default}

/* Light Theme support */
html[data-theme="light"], [data-theme="light"] {
  color-scheme: light;
  background: #f8f9fa;
  --muted: #596a77;
  --gold: #df9825;
  --line: #e2e6ea;
  --panel: #ffffff;
}

[data-theme="light"] body {
  background: #f8f9fa;
  color: #172633;
}

[data-theme="light"] footer {
  color: #7b8e9d;
  background: transparent;
}
footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.footer-quote {
  font-size: 11.5px;
}
.footer-developer {
  font-size: 11px;
  color: #8da5b6;
  font-weight: 550;
  letter-spacing: 0.2px;
}
[data-theme="light"] .footer-developer {
  color: #4a6374;
}

[data-theme="light"] button {
  background: #f1f3f5;
  border-color: #dce0e5;
  color: #1a2d3b;
}

[data-theme="light"] button:hover {
  background: #e6eaee;
}

[data-theme="light"] button.quiet {
  background: transparent;
  color: #596a77;
}

[data-theme="light"] button.quiet:hover {
  background: rgba(0, 0, 0, 0.05);
  color: #172633;
}

[data-theme="light"] .hero {
  background: linear-gradient(135deg, #ffffff 0%, #f4f6f8 100%);
  border-color: #e2e6ea;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

[data-theme="light"] .level-card {
  background: #ffffff;
  border-color: #e0e4e8;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05);
}

[data-theme="light"] .level-card:hover {
  border-color: #df9825;
}

[data-theme="light"] .card-art {
  background: radial-gradient(ellipse, #fafafa, #eaecef);
}

[data-theme="light"] .world {
  background: #eef2f5;
  border-color: #d8e1e8;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .scene {
  background: #eef2f5;
}

[data-theme="light"] .world-bottom {
  color: #1c3547;
  background: transparent;
}

[data-theme="light"] aside,
[data-theme="light"] .panel {
  background: #ffffff;
  border-color: #e2e6ea;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

[data-theme="light"] .program-panel .program {
  background: linear-gradient(135deg, #fafbfc, #f1f3f5);
  border-color: #dce0e5;
}

[data-theme="light"] .program-panel .program:empty:before {
  color: #6d8697;
}

[data-theme="light"] .program-panel .command {
  background: #ffffff;
  border-color: #dce0e5;
  color: #182d3c;
}

[data-theme="light"] .program-panel .command:hover {
  background: #f3f5f7;
}

[data-theme="light"] .program-panel .block {
  background: #ffffff;
  border-color: #dce0e5;
  box-shadow: 0 2px 0 #dce0e5;
  color: #172633;
}

[data-theme="light"] .program-panel .loop {
  background: #faf8fd;
  border-color: #d2c8e3;
}

[data-theme="light"] .program-panel .loop-body {
  background: #ffffff;
  border-color: #d2c8e3;
}

[data-theme="light"] .program-panel .loop-body:empty:before {
  color: #8c7fa6;
}

[data-theme="light"] .status {
  color: #1e293b;
  font-size: 13px;
}

[data-theme="light"] .status.success {
  color: #15803d;
  font-weight: 700;
}

[data-theme="light"] .status.error {
  color: #dc2626;
  font-weight: 700;
}

[data-theme="light"] .win {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}