:root{--ink:#142651;--muted:#7a88a2;--blue:#2658e4;--blue-deep:#173db0;--line:#e3eaf7;--bg:#f3f6fc;--surface:#fff;--radius:19px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink)}body{background:var(--bg)}button,input{font:inherit}button{cursor:pointer}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}.topbar{height:84px;padding:0 25px;display:flex;align-items:center;gap:22px;background:#fff;border-bottom:1px solid var(--line)}.back{display:flex;align-items:center;gap:8px;text-decoration:none;color:#697994;font-size:13px;font-weight:700;border-right:1px solid var(--line);padding-right:22px;white-space:nowrap}.back:hover{color:var(--blue)}.back svg{width:17px;height:17px}.brand{display:flex;align-items:center;gap:12px;min-width:172px}.brand strong{font-size:24px;letter-spacing:-.9px;white-space:nowrap;font-weight:850}.brand em{font-style:normal;color:var(--blue)}.brand small{display:block;font-size:10px;font-weight:800;letter-spacing:2.8px;color:#8492ab;margin-top:2px}.brand-mark{position:relative;width:40px;height:40px;background:linear-gradient(145deg,#306df2,#193fba);border-radius:13px;box-shadow:0 4px 12px #2f63df28;flex:none}.brand-mark span{position:absolute;width:12px;height:12px;background:#d7e8ff;border-radius:3px}.brand-mark span:nth-child(1){left:9px;top:9px}.brand-mark span:nth-child(2){left:22px;top:9px;background:#a7c8ff}.brand-mark span:nth-child(3){left:9px;top:22px;background:#9ec5ff}.brand-mark span:nth-child(4){left:22px;top:22px;background:#fff}.project-title{margin-left:auto;display:flex;flex-direction:column;min-width:0;max-width:250px}.project-title label{color:var(--muted);font-size:10px;letter-spacing:.3px;margin-bottom:4px}.project-title input{background:transparent;border:none;border-bottom:1px solid transparent;outline:0;color:var(--ink);font-weight:800;font-size:15px;width:100%;padding:3px 0 5px}.project-title input:focus{border-color:var(--blue)}.top-actions{display:flex;align-items:center;gap:10px;margin-left:auto}.button{padding:11px 15px;border-radius:11px;display:inline-flex;justify-content:center;align-items:center;gap:8px;border:1px solid var(--line);font-size:13px;font-weight:750;white-space:nowrap;transition:background .15s,transform .15s}.button:hover,.tool:hover,.starter:hover{transform:translateY(-1px)}.button svg{width:17px;height:17px}.button.ghost{background:#fff;color:#516281}.button.ghost:hover{background:#f4f7fd;color:var(--blue)}.button.primary{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 4px 11px #2658e423}.button.primary:hover{background:var(--blue-deep)}.saved-status{display:flex;align-items:center;gap:5px;white-space:nowrap;color:#70859b;font-size:11px;font-weight:650}.saved-status svg{width:15px;height:15px;color:#2eab79}.saved-status.unsaved svg{color:#f0ab4c}.export-wrap{position:relative}.export-menu{z-index:30;position:absolute;top:51px;right:0;width:245px;box-shadow:0 15px 45px #142b5222;border:1px solid var(--line);background:white;border-radius:14px;padding:7px}.export-menu[hidden]{display:none}.export-menu button{display:block;background:transparent;width:100%;border:0;text-align:left;border-radius:9px;color:var(--ink);padding:11px;font-size:13px;font-weight:750}.export-menu button:hover{background:#f1f5fe}.export-menu b{float:right;color:var(--blue)}.export-menu small{display:block;margin-top:3px;color:var(--muted);font-size:11px;font-weight:500}.editor{display:grid;grid-template-columns:112px minmax(320px,1fr) 302px;height:calc(100dvh - 84px);min-height:550px;gap:14px;padding:14px 18px 18px}.tools{display:flex;flex-direction:column;gap:7px;align-items:stretch;padding-top:13px}.tools-heading{font-size:9px;color:#94a0b8;font-weight:900;letter-spacing:1.5px;text-align:center;margin-bottom:9px}.tool{height:72px;padding:8px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;background:#fff;border:1px solid #e8edf8;color:#62728e;border-radius:16px;font-size:10px;font-weight:750;transition:all .15s}.tool svg{width:23px;height:23px}.tool.active{color:#fff;background:var(--blue);box-shadow:0 7px 18px #2658e430;border-color:var(--blue)}.tool-separator{height:1px;background:#dce4f2;margin:8px 4px}.small-tool{height:55px}.small-tool svg{width:19px;height:19px}.stage{position:relative;min-height:0;overflow:hidden;border:1px solid #dae5f5;background:linear-gradient(155deg,#dfeafc,#f4f8ff 55%,#eaf3fa);border-radius:22px;box-shadow:0 4px 24px #253d7010}.stage canvas{display:block;width:100%;height:100%;outline:0;touch-action:none;cursor:crosshair}.stage canvas.orbiting{cursor:grabbing}.stage-top{position:absolute;top:19px;left:20px;right:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none}.stage-chip{display:flex;align-items:center;gap:7px;padding:10px 12px;border-radius:10px;background:#fffefdee;border:1px solid #e3e9f3;box-shadow:0 3px 9px #213f6410;font-size:11px;font-weight:750;color:#48607e;backdrop-filter:blur(6px)}.stage-chip.secondary{font-weight:600}.live-dot{width:7px;height:7px;background:#45c59e;border-radius:50%}.stage-help{position:absolute;bottom:21px;left:20px;color:#687f9c;font-size:11px;font-weight:600;padding:9px 12px;background:#ffffffe0;border:1px solid #e5edf7;border-radius:9px;pointer-events:none}.stage-help span{color:#bec8d7;padding:0 4px}.stage-controls{position:absolute;right:19px;bottom:19px;display:flex;align-items:center;background:#fff;border:1px solid #e0e7f3;border-radius:10px;overflow:hidden;box-shadow:0 3px 9px #1d2c4d14}.stage-controls button{width:37px;height:36px;background:transparent;border:0;font-size:22px;font-weight:400;color:#4f607b}.stage-controls button:hover{background:#f0f4fe}.stage-controls button+button{border-left:1px solid #e8edf5}.stage-controls button svg{width:16px;height:16px}.right-panel{background:#fff;min-height:0;overflow:auto;scrollbar-width:thin;border:1px solid #e7ecf6;border-radius:20px}.panel-content{padding:23px 21px 26px}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.eyebrow{color:#879ab8;font-size:10px;letter-spacing:1.5px;font-weight:900}.panel-title h2{font-size:23px;margin:4px 0 0;letter-spacing:-.8px}.icon-button{display:flex;align-items:center;justify-content:center;width:37px;height:37px;border:1px solid #e9edf8;background:#f8faff;border-radius:10px;color:#6580a1}.icon-button:hover{background:#e9f1ff}.panel-section{border-top:1px solid #eaf0f8;padding:20px 0}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;font-size:13px;font-weight:800}.section-title span{font-size:11px;letter-spacing:0;color:#8b9ab2;font-weight:600}.palette{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.swatch{display:block;width:100%;aspect-ratio:1;border:2px solid transparent;border-radius:9px;box-shadow:inset 0 0 0 1px #142c4d08;transition:transform .12s}.swatch:hover{transform:scale(1.11)}.swatch.selected{outline:2px solid var(--blue);outline-offset:2px;border-color:#fff}.custom-color{margin-top:17px;display:flex;align-items:center;gap:8px;font-size:12px;color:#5b6b87;font-weight:650}.custom-color input{cursor:pointer;margin-left:auto;width:35px;height:27px;padding:0;border:0;background:transparent}.color-circle{width:19px;height:19px;background:#2658e4;border-radius:50%;border:2px solid white;box-shadow:0 0 0 1px #d9e1f0}.switch-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;gap:10px;font-size:12px;color:#536785;font-weight:650;cursor:pointer}.switch-row span{display:flex;align-items:center;gap:10px}.switch-row svg{width:17px;height:17px;color:#8293b1}.switch-row input{position:absolute;opacity:0;width:1px;height:1px}.switch-row i{position:relative;width:34px;height:20px;border-radius:20px;background:#dce4f0;transition:background .2s;flex:none}.switch-row i:after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;background:#fff;border-radius:50%;box-shadow:0 1px 3px #223d5d22;transition:transform .2s}.switch-row input:checked+i{background:var(--blue)}.switch-row input:checked+i:after{transform:translateX(14px)}.switch-row input:focus-visible+i{outline:2px solid var(--blue);outline-offset:2px}.starter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.starter{border:1px solid #e8edf7;background:#fbfcff;border-radius:12px;min-height:77px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;color:#536685;font-size:11px;font-weight:750}.starter-art{font-size:27px;line-height:29px;font-weight:900}.starter-art.blue{color:#3f70e2}.starter-art.green{color:#56ae72}.starter-art.orange{color:#e1a357}.starter-art.violet{color:#8d78cd}.blank-button{display:flex;align-items:center;justify-content:center;gap:7px;padding:12px;width:100%;background:#f1f5ff;color:var(--blue);border:1px solid #e2eaff;border-radius:10px;font-size:12px;font-weight:800;margin-top:10px}.blank-button svg{width:16px;height:16px}.blank-button:hover{background:#eaf1ff}.stat{display:flex;justify-content:space-between;gap:10px;color:#7b8ba3;font-size:12px;padding:7px 0}.stat strong{color:#435776;font-size:12px}.about p{line-height:1.65;font-size:11px;color:#8090a8;margin:14px 0 0}.toast{position:fixed;left:50%;bottom:32px;transform:translate(-50%,15px);background:#173b86;color:white;padding:12px 20px;border-radius:12px;font-size:13px;font-weight:700;opacity:0;pointer-events:none;transition:all .2s;box-shadow:0 12px 35px #142b5238;z-index:50}.toast.show{opacity:1;transform:translate(-50%,0)}.modal-overlay{position:fixed;inset:0;background:#101c36a3;z-index:60;display:grid;place-items:center;padding:16px}.modal-overlay[hidden]{display:none}.modal{width:min(100%,440px);background:white;border-radius:23px;padding:31px;box-shadow:0 20px 65px #0c1d523b}.modal-icon{width:48px;height:48px;background:#e7efff;color:var(--blue);display:grid;place-items:center;border-radius:12px}.modal h2{font-size:23px;letter-spacing:-.6px}.modal p{font-size:14px;line-height:1.65;color:#72839f}.modal-buttons{display:flex;justify-content:flex-end;gap:9px;margin-top:24px}.help-modal{max-width:520px}
@media(max-width:1250px){.editor{grid-template-columns:86px minmax(280px,1fr) 275px;padding:12px;gap:10px}.tools .tool{height:68px}.brand{min-width:auto}.topbar{gap:13px;padding:0 15px}.back{padding-right:12px}.saved-status{display:none}}
@media(max-width:930px){.topbar{height:76px}.back span{display:none}.back{padding-right:10px}.brand strong{font-size:20px}.brand-mark{width:35px;height:35px}.brand-mark span{transform:scale(.86);transform-origin:top left}.editor{grid-template-columns:72px minmax(250px,1fr) 220px;height:calc(100dvh - 76px)}.tools-heading{font-size:8px}.tool{border-radius:12px;font-size:9px}.panel-content{padding:16px 13px}.palette{gap:6px}.stage-help{max-width:calc(100% - 35px);font-size:10px}}
@media(max-width:730px){.topbar{height:auto;min-height:69px;flex-wrap:wrap;gap:10px;padding:10px 12px}.back{border:0}.brand{margin-right:auto}.project-title{order:3;width:100%;max-width:none;margin:0;padding-left:2px}.top-actions{margin:0}.top-actions .button{padding:9px}.top-actions .button span{display:none}.top-actions .button svg{width:19px;height:19px}.top-actions .export-wrap .button span{display:inline}.editor{height:auto;min-height:calc(100dvh - 110px);grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(470px,65vh) auto;padding:9px;gap:9px}.tools{grid-row:1;flex-direction:row;gap:6px;padding:0;overflow-x:auto;scrollbar-width:none}.tools-heading,.tool-separator{display:none}.tool,.tools .tool{height:60px;min-width:61px;flex:1 0 61px;border-radius:11px;font-size:9px;gap:4px}.tool svg{width:20px;height:20px}.stage{grid-row:2;border-radius:16px}.right-panel{grid-row:3;overflow:visible}.panel-content{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.panel-title{grid-column:1/-1;margin-bottom:8px}.panel-section{padding:15px 0}.panel-section.about{grid-column:1/-1}.stage-help{bottom:14px;left:12px;font-size:9px;max-width:calc(100% - 110px)}.stage-controls{right:12px;bottom:12px}.stage-top{top:12px;left:12px;right:12px}.stage-chip{padding:7px 9px;font-size:10px}}
@media(max-width:470px){.editor{grid-template-rows:auto minmax(380px,53vh) auto}.panel-content{display:block}.stage-help{display:none}.project-title label{display:none}.project-title input{font-size:13px}.brand small{font-size:9px}}

/* Pixel 3D v1.1 — advanced voxel tooling */
.v11-hint{font-size:11px;line-height:1.55;color:#7c8ca5;margin:3px 0 12px}
.v11-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:8px 0}
.v11-actions button,.v11-axis-row button,.v11-wide{font-size:11px;font-weight:750;border:1px solid #dbe6f7;background:#f6f9ff;color:#3b5682;border-radius:9px;min-height:34px;padding:8px 6px;display:flex;justify-content:center;align-items:center;gap:5px}
.v11-actions svg{height:15px;width:15px}.v11-actions button:hover,.v11-axis-row button:hover,.v11-wide:hover{background:#e8f0ff;border-color:#bfd2f8}
.v11-actions button.danger{color:#bb415c;background:#fff8fa;border-color:#f4dce4}
.v11-actions button:disabled,.v11-axis-row button:disabled,.v11-wide:disabled{cursor:not-allowed;opacity:.45}
.v11-axis-row{display:grid;grid-template-columns:1fr 42px 42px;align-items:center;gap:7px;margin:7px 0;font-size:12px;font-weight:800;color:#566d92}
.v11-axis-row span{background:#f8faff;border-radius:9px;padding:10px 12px}
.v11-axis-row button{font-size:19px;line-height:1;padding:5px}
.v11-wide{width:100%;margin-top:9px}.v11-wide.v11-primary{background:#2658e4;color:#fff;border-color:#2658e4}
.v11-forms summary{font-size:13px;font-weight:800;cursor:pointer;list-style-position:outside}.v11-forms[open] summary{margin-bottom:12px}
.v11-forms label{display:block;color:#6b7b97;font-size:11px;font-weight:700;margin:9px 0}
.v11-forms select,.v11-forms input{font-size:12px;max-width:100%;width:100%;padding:9px 7px;border:1px solid #dbe5f5;border-radius:9px;background:#fff;color:#273e67;margin-top:5px}
.v11-dimensions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.selection-section{scroll-margin-top:20px}
@media(max-width:730px){.v11-axis-row{grid-template-columns:1fr 45px 45px}.selection-section{padding-bottom:20px}}

/* Pixel 3D V1.2 — advanced studio */
.v12-panel{padding:16px 0}.v12-details summary{cursor:pointer;font-size:13px;font-weight:800;color:#223d70;list-style:revert}.v12-details[open] summary{margin-bottom:12px}.v12-tag{font-size:9px;font-weight:850;letter-spacing:.04em;padding:4px 6px;border-radius:5px;background:#e7efff;color:#2658e4;margin-left:5px}.v12-layers{display:grid;gap:6px;margin:10px 0}.v12-layer{display:grid;grid-template-columns:minmax(0,1fr) 24px 28px 28px;align-items:center;gap:5px;border:1px solid #e5eafa;padding:5px;border-radius:10px;background:#f9fbff}.v12-layer.current{border-color:#82a4ff;background:#eaf1ff}.v12-layer button{border:0;background:transparent;color:#486185;min-height:30px;border-radius:6px}.v12-layer button:hover{background:#d9e5ff}.v12-layer .v12-layer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:11px;font-weight:800;padding:5px}.v12-layer small{text-align:right;font-size:10px;color:#8a9bb3}.v12-label{display:block;font-size:11px;font-weight:700;color:#667b9a;line-height:1.7}.v12-label select{width:100%;padding:9px 10px;border-radius:9px;border:1px solid #dce6f8;background:#fff;color:#21395f;margin:5px 0 10px}.v12-label input[type=range]{display:block;width:100%;accent-color:#2658e4;margin:10px 0}.v12-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:8px 0}.v12-buttons button{min-height:37px;border-radius:8px;background:#f4f7fd;border:1px solid #dee8f9;color:#425f8b;font-size:10px;font-weight:750;padding:5px 2px}.v12-buttons button:hover{background:#e5efff}
@media(max-width:730px){.v12-panel{min-width:0}.v12-details summary{font-size:12px}}

/* PIXEL3D_TECHNOPARK_DARK_THEME START */
:root{
  --ink:#eef4ff;
  --muted:#9cb1d3;
  --blue:#4d7fff;
  --blue-deep:#2f58d8;
  --line:#1e345d;
  --bg:#07142f;
  --surface:#0b1d42;
  --surface-2:#102654;
  --surface-3:#132d63;
}

html,body{
  background:var(--bg);
  color:var(--ink);
}

body{
  background:
    radial-gradient(1000px 520px at 10% 0%, rgba(50,92,240,.18), transparent 55%),
    radial-gradient(900px 460px at 100% 0%, rgba(124,74,255,.18), transparent 48%),
    linear-gradient(180deg,#07142f 0%, #08172f 100%);
}

.topbar{
  background:rgba(8,20,47,.92);
  border-bottom:1px solid var(--line);
  box-shadow:0 10px 28px rgba(0,0,0,.25);
  backdrop-filter:blur(10px);
}

.back{
  color:#a9bbd9;
  border-right:1px solid var(--line);
}

.back:hover,
.project-title input:focus,
.button.ghost:hover,
.export-menu button:hover{
  color:#ffffff;
}

.brand strong,
.panel-title h2,
.section-title,
.stat strong,
.modal h2{
  color:#ffffff;
}

.brand small,
.tools-heading,
.eyebrow,
.section-title span,
.project-title label,
.saved-status,
.custom-color,
.switch-row,
.about p,
.modal p{
  color:var(--muted);
}

.project-title input{
  color:#ffffff;
}

.button.ghost{
  background:rgba(16,32,69,.95);
  border-color:var(--line);
  color:#e7efff;
}

.button.ghost:hover{
  background:#143267;
}

.button.primary{
  background:linear-gradient(135deg,#2f63ec,#7348f2);
  border-color:transparent;
  color:#fff;
  box-shadow:0 8px 24px rgba(69,111,255,.28);
}

.button.primary:hover{
  background:linear-gradient(135deg,#2857d5,#663ce6);
}

.export-menu{
  background:#0c1f45;
  border:1px solid var(--line);
  box-shadow:0 18px 45px rgba(0,0,0,.35);
}

.export-menu button{
  color:#eef4ff;
}

.export-menu small,
.export-menu b{
  color:#a8bbdc;
}

.tool,
.small-tool,
.icon-button,
.starter,
.blank-button{
  background:rgba(12,28,61,.9);
  border:1px solid var(--line);
  color:#e6eeff;
}

.tool.active{
  background:linear-gradient(135deg,#2f63ec,#7348f2);
  color:#fff;
  border-color:transparent;
  box-shadow:0 10px 24px rgba(69,111,255,.28);
}

.icon-button:hover,
.blank-button:hover{
  background:#153267;
}

.stage{
  border:1px solid #18345f;
  background:
    radial-gradient(900px 400px at 50% 0%, rgba(79,127,255,.14), transparent 55%),
    linear-gradient(180deg,#11264f 0%, #0b1b3b 58%, #081229 100%);
  box-shadow:0 10px 28px rgba(0,0,0,.22);
}

.stage-chip{
  background:rgba(8,21,47,.78);
  border:1px solid #23406f;
  color:#d9e7ff;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}

.stage-chip.secondary{
  color:#b6c8e7;
}

.live-dot{
  background:#35d48e;
}

.stage-controls button{
  background:rgba(9,21,46,.82);
  color:#dce8ff;
  border:1px solid #23406f;
}

.stage-controls button:hover{
  background:#173466;
}

.right-panel{
  background:rgba(9,20,46,.92);
  border:1px solid var(--line);
  box-shadow:0 16px 36px rgba(0,0,0,.22);
}

.panel-section{
  border-top:1px solid rgba(255,255,255,.08);
}

.palette{
  gap:8px;
}

.swatch{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}

.swatch.selected{
  outline:2px solid #5f8fff;
  outline-offset:2px;
  border-color:#ffffff;
}

.custom-color input{
  filter:none;
}

.color-circle{
  border:2px solid #0c1f45;
  box-shadow:0 0 0 1px #2b4a7b;
}

.switch-row svg{
  color:#8ea7cf;
}

.switch-row i{
  background:#29426d;
}

.switch-row i:after{
  background:#ffffff;
}

.starter{
  background:rgba(12,27,58,.92);
  border:1px solid #203760;
}

.starter-art.blue{background:linear-gradient(135deg,#2559e3,#6f46f0)}
.starter-art.green{background:linear-gradient(135deg,#109b7b,#39c987)}
.starter-art.orange{background:linear-gradient(135deg,#d97815,#f2b14c)}
.starter-art.violet{background:linear-gradient(135deg,#6542d9,#9a63ff)}

.toast{
  background:linear-gradient(135deg,#2f63ec,#7348f2);
  color:#fff;
  box-shadow:0 14px 34px rgba(0,0,0,.35);
}

.modal-overlay{
  background:rgba(4,10,24,.72);
}

.modal{
  background:#0b1d42;
  color:#eef4ff;
  border:1px solid var(--line);
  box-shadow:0 22px 65px rgba(0,0,0,.42);
}

.modal-icon{
  background:#16356d;
  color:#dbe8ff;
}

input, button{
  -webkit-tap-highlight-color: transparent;
}
/* PIXEL3D_TECHNOPARK_DARK_THEME END */