/* Pixel Nature Forge — visual finish. Existing tools and layouts, one material system. */
:root{--bg:#080d14;--panel:#111a25;--panel2:#192635;--line:#2a3949;--muted:#9caebd;--text:#eef4f5;--accent:#adeda0;--cyan:#9ed2dc;--radius:16px;font-family:Inter,"Segoe UI",system-ui,sans-serif;font-synthesis:none}
body{background:radial-gradient(ellipse at 40% 0,#162531 0,transparent 55%),#080d14}
.app-shell{padding-inline:22px;grid-template-rows:78px minmax(0,1fr) 36px}
.topbar{border-color:#253442;gap:20px}.title-block{gap:13px}.title-block h1{font-size:21px;letter-spacing:-.65px;font-weight:550}.title-block h1 strong{font-weight:650;color:#c0edb8}
.brand-mark{width:40px;height:40px;display:grid;place-items:center;border:1px solid #8cbb8c50;background:linear-gradient(145deg,#283f36,#182b29);box-shadow:inset 0 1px #c7ecc215,0 4px 14px #0003;color:var(--accent);border-radius:12px}.brand-mark svg{width:25px;height:25px}
.top-actions{gap:8px}.version{padding:4px 8px;border:1px solid #34443c;border-radius:5px;background:#182820;color:#b2c9b6;font-size:12px;margin-right:6px;font-variant-numeric:tabular-nums}
.button{border:1px solid #334352;background:linear-gradient(180deg,#1d2b39,#182431);border-radius:9px;min-height:40px;padding:10px 13px;font-weight:550;box-shadow:inset 0 1px #e3f1ff05,0 1px 2px #0002;transition:background .16s,border-color .16s,box-shadow .16s,color .16s}
.button:hover:not(:disabled){background:#25394a;border-color:#546d79;box-shadow:inset 0 1px #d9f5fa0c,0 2px 8px #0003}.button:active:not(:disabled){background:#15232c;box-shadow:inset 0 2px 6px #0004}.button:disabled{opacity:.4}
.button.primary{background:linear-gradient(180deg,#c1f4b1,#a6df98);border-color:#caefba;color:#15291e;box-shadow:inset 0 1px #f4ffeab0,0 3px 12px #070e0b60;font-weight:650}.button.primary:hover:not(:disabled){background:#d1f8c4;border-color:#e1ffd7;color:#14271b}.button.accent{background:#1c302b;border-color:#3e5e4c;color:#c2efb5}
.workspace{grid-template-columns:84px minmax(0,1fr) 388px;gap:18px;padding-top:18px}.tabs{gap:5px;padding:2px 5px 8px 0;scrollbar-width:thin;scrollbar-color:#344b49 transparent}.tab{min-height:62px;flex:none;border:1px solid transparent;border-radius:11px;font-size:13px;color:#94a9b6;gap:6px;padding:8px 3px;position:relative;transition:background .15s,color .15s,border-color .15s}.tab.active{background:linear-gradient(130deg,#294236,#1b302b);border-color:#3e5f4c;color:#c7f3b9;box-shadow:inset 0 1px #ddffd809}.tab.active::before{content:'';position:absolute;left:-1px;top:19px;bottom:19px;width:3px;border-radius:2px;background:#baeea9}.tab:hover{background:#1b2b34;color:#edf5f5}.tool-icon{height:22px;display:grid;place-items:center}.tool-icon svg{height:22px;width:22px;display:block}
.panel{border-color:#30414e;box-shadow:0 12px 40px #0000002e,inset 0 1px #f0faff04}.preview-panel{background:#0e1721;grid-template-rows:64px minmax(0,1fr) 48px 88px}.panel-title-row{padding:14px 20px;border-color:#293945;background:linear-gradient(110deg,#172430,#121d27)}.panel-title-row h2{font-size:15px;letter-spacing:.1px;font-weight:600}.panel-title-row .tiny-note{font-size:12px;color:#99aeb9;margin-top:4px}.preview-actions{gap:6px}.preview-actions .button{font-size:13px;min-height:34px;padding:7px 11px}.canvas-wrap{background:#0b151c;box-shadow:inset 0 0 70px #0002}
.preview-corner{background:#101c25d9;border:1px solid #45606b4d;border-radius:6px;color:#aec5cf;font-size:12px;padding:6px 9px;backdrop-filter:blur(8px);font-variant-numeric:tabular-nums;letter-spacing:.25px}.preview-corner span{color:#deecdc}.top-left{left:18px;top:18px}.top-right{right:18px;top:18px}.bottom-right{right:18px;bottom:69px;border:0;background:transparent;color:#a5bbc2;opacity:.8;font-size:11px;letter-spacing:1.2px}
.view-switch{top:58px;left:18px;gap:2px;padding:4px;border:1px solid #4056638a;border-radius:9px;background:#12202bea;box-shadow:0 4px 16px #0002;backdrop-filter:blur(8px)}.view-button{font-size:13px;min-height:30px;border-radius:6px;color:#acbfca;padding:5px 11px}.view-button.selected{background:#2f4c3e;color:#daf5c9;box-shadow:inset 0 0 0 1px #5d84614d}.view-button:hover:not(.selected){background:#223443;color:#e9f5f1}
.gesture-tools,.zoom-tools{border-color:#3e52609c;background:#13212dea;border-radius:10px;box-shadow:0 4px 16px #0003;padding:4px;backdrop-filter:blur(8px);bottom:18px}.gesture-tools{left:18px}.zoom-tools{right:18px}.gesture-button{font-size:13px;color:#a7bbc7;min-height:32px;padding:7px 11px}.gesture-button.selected{background:#304352;color:#edf6f4}.zoom-button{height:32px;color:#dce8eb}#zoomFitBtn{font-size:12px;color:#c4d5da}
.preview-toolbar{padding:7px 18px;border-color:#293945;gap:9px;background:#121d27}.season-tabs{gap:3px}.season-tab{padding:7px 11px;font-size:14px;border-radius:6px;color:#a3b7c2}.season-tab.active{background:#273e32;color:#d4efbc;box-shadow:inset 0 0 0 1px #4c6b424d}.season-tab:hover{background:#20313c}.stage-bottom{padding:12px 18px;border-color:#273946;background:#101b25;gap:10px}.world-shortcuts{gap:7px}.world-chip{font-size:13px;background:#182a34;border-color:#334954;color:#b5cbd2;border-radius:7px;padding:5px 11px}.world-chip.active{background:#243c31;border-color:#547450;color:#d2eabe}.status-strip{gap:23px}.status-label{color:#8fa7b4;font-size:11px;letter-spacing:.8px}.status-strip strong{color:#dae5e5;font-size:12px;font-variant-numeric:tabular-nums}
.controls-panel{background:linear-gradient(135deg,#15212c,#101a25 65%);grid-template-rows:64px 50px minmax(0,1fr) 42px}.inspector-head{padding:13px 20px;border-color:#2c3d49;background:#172530}.tool-select{width:210px!important;font-size:17px!important;letter-spacing:-.25px}.tool-buttons .button{font-size:12px;min-height:32px;padding:6px 10px}.section-bar{padding:12px 20px;border-color:#263844;margin:0;color:#c1d1d9;font-size:14px}.section-count{font-size:12px;color:#829ba9;font-variant-numeric:tabular-nums}.panel-pager{padding:10px 20px;border-color:#2b3d49;background:#121e28}.page-info,.panel-pager .tiny-note{font-size:12px;color:#91a9b6}
.nature-controls{padding:20px 20px 24px;scrollbar-width:thin;scrollbar-color:#455e63 transparent;scroll-padding-top:20px}.nature-controls .control{margin-bottom:22px;gap:9px}.nature-controls h3{font-size:14px;font-weight:650;letter-spacing:.1px;margin:26px 0 16px;padding-top:18px;border-top:1px solid #30414c;color:#e4eeee}.nature-controls>h3:first-child{margin-top:0;padding-top:0;border:0}.nature-controls p{font-size:14px;line-height:1.65;color:#a0b6c2;margin-bottom:20px}.control>span,.label-row,.toggle-row{color:#b6cbd4;font-size:14px;line-height:1.35}.label-row{align-items:center;min-height:24px}.label-row output{background:#21372f;border:1px solid #385343;border-radius:5px;min-width:32px;text-align:center;padding:3px 6px;color:#c5e8b6;font-size:12px;font-weight:600;line-height:1.2}.control>select,.control>input:not([type=range]):not([type=checkbox]),.nature-controls input[type=text]{background:#0d1923;border-color:#3b515e;border-radius:8px;color:#e7f0f1;height:40px;min-height:40px;padding:8px 11px;font-size:15px;box-shadow:inset 0 1px 3px #0003}.control>select:hover,.control>input:not([type=range]):hover{border-color:#678181}.control select{padding-right:22px}
.control-atom input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:4px;background:linear-gradient(to right,#88be85 0 var(--fill,50%),#324653 var(--fill,50%) 100%)}.control-atom input[type=range]::-webkit-slider-thumb{height:15px;width:15px;margin-top:-5px;background:#caeabc;border:2px solid #f0fbe9;box-shadow:0 0 0 4px #91bf8320,0 2px 4px #0005}.control-atom input[type=range]::-moz-range-track{height:5px;background:#324653}.control-atom input[type=range]::-moz-range-progress{height:5px;background:#88be85}.control-atom input[type=range]::-moz-range-thumb{width:12px;height:12px;border:2px solid #eaf8e0;background:#bcdfa9}.nature-controls .control-atom input[type=range]{height:27px}
.nature-controls .toggle-row{min-height:38px;margin:0 0 6px}.toggle-row input{background:#354957;border:1px solid #4a616b;width:36px;height:22px;margin-right:0}.toggle-row input:checked{background:#97cb88;border-color:#badfac}.toggle-row input::after{width:14px;height:14px;left:3px;top:3px;background:#cadbe0;box-shadow:0 1px 3px #0004}.toggle-row input:checked::after{left:17px;background:#20382a}.text-button{font-size:13px;color:#badeab}.text-button:hover{text-decoration:underline}.info-box,.nature-controls .info-box{padding:14px 15px;background:linear-gradient(110deg,#20382e,#1b2c2b);border-color:#3c5847;border-radius:10px;color:#c1d8bd;font-size:14px;line-height:1.6;margin-bottom:20px}
.preset-grid{gap:12px;margin-bottom:22px}.preset-card{background:linear-gradient(155deg,#172832,#0d1923);border-color:#334955;border-radius:11px;padding:10px;font-size:14px;box-shadow:inset 0 1px #e8f8ff04;transition:background .15s,border-color .15s}.preset-card:hover{background:#1d342e;border-color:#7c9d75}.preset-card.selected{background:#23382c;border-color:#96bb7b;box-shadow:inset 0 0 0 1px #96bb7b22}.preset-card canvas{height:112px;width:100%;margin:0 0 12px;border-bottom:1px solid #47636a2b;padding-bottom:10px;object-fit:contain}.preset-card span{font-size:14px;line-height:1.4;font-weight:550;color:#d8e7e5}.preset-card small{font-size:12px;color:#99b1b8;line-height:1.5}.palette-swatches{gap:3px;border-radius:8px;overflow:hidden;border:1px solid #3d515a;margin-bottom:24px}.palette-swatches i{height:34px;border-radius:0}.color-control{gap:8px;margin:12px 0;grid-template-columns:34px minmax(0,1fr) 68px 28px}.color-control code{font-size:12px;color:#a9c0c8}.color-control label{color:#bdcdd4;font-size:14px}.color-control input[type=color]{height:34px;width:34px;border-radius:7px;border:1px solid #4b626a;padding:2px}.color-lock{height:32px;background:#1d303b;color:#a4bbc4}.color-lock[aria-pressed=true]{background:#304b36;color:#d3edb9}
.editor-tabs{padding:5px;background:#0d1923;border:1px solid #2d424f;border-radius:10px;gap:4px;margin-bottom:22px}.editor-tabs .button{background:transparent;border-color:transparent;box-shadow:none;border-radius:6px;font-size:13px;min-height:36px}.editor-tabs .selected{background:#2e4839;color:#d9efc5;border-color:#55724c}.draw-tools{gap:7px}.draw-tools .button{min-height:39px;font-size:14px;border-radius:7px}.draw-tools .button.selected{background:#2e4938;color:#dcf3ca;border-color:#68865b}.nature-controls .full-width{margin-bottom:12px}.nature-controls .control-grid{gap:0 16px}.export-buttons{gap:10px}.export-buttons .button{padding:15px 16px}.export-buttons .button small{font-size:13px;line-height:1.45;color:#acc0c8;opacity:1;margin-top:6px}.export-buttons .button.primary small{color:#31563b}.snapshot-card{grid-template-columns:64px minmax(0,1fr) auto;gap:12px;padding:12px;border-color:#334954;background:#14232d;border-radius:10px}.snapshot-card img{width:64px;height:64px}.snapshot-card strong{color:#dce8e8}.snapshot-card small{color:#9cb5bd}.empty-state{border-color:#405962;background:#13232c;padding:22px 16px}
footer{padding:0 2px;color:#8ba3b0}.pixeldeck-badge{color:#9db4bf}.pixeldeck-badge:hover{color:#d3efc5}.pixeldeck-badge img{height:21px;width:21px}.footer-tip{font-size:12px;letter-spacing:.25px}.toast{background:#20372e;border-color:#63815a;color:#e8f5df;border-radius:10px;box-shadow:0 10px 36px #0007;line-height:1.5;padding:13px 18px}
select option,select optgroup{background:#172631;color:#e6f0f2}select option:checked{background:#365542;color:#e7ffdc}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid #c3edb1;outline-offset:3px}
@media(min-width:1600px){.app-shell{padding-inline:28px}.workspace{grid-template-columns:90px minmax(0,1fr) 416px;gap:22px}.nature-controls{padding:22px 24px}.preset-card canvas{height:130px}}
@media(max-width:1180px){.app-shell{padding-inline:12px}.workspace{grid-template-columns:76px minmax(0,1fr) 340px;gap:12px}.nature-controls{padding:16px}.inspector-head,.section-bar{padding-inline:16px}.panel-title-row{padding-inline:14px}.topbar{gap:12px}.title-block h1{font-size:19px}.preview-actions .button{padding:7px 8px;font-size:12px}.tool-select{width:180px!important}.status-strip{gap:12px}.preset-card canvas{height:100px}.season-tab{padding:7px 8px}}
@media(max-width:820px){.tabs{display:none}.workspace{grid-template-columns:minmax(0,1fr) 320px}.app-shell{grid-template-rows:64px minmax(0,1fr) 30px}.top-actions .button{min-height:38px}.controls-panel{grid-template-rows:56px 46px minmax(0,1fr) 38px}.preview-panel{grid-template-rows:56px minmax(0,1fr) 44px 74px}.panel-title-row h2{font-size:14px}.preview-actions .button{padding:6px}.tool-select{width:174px!important}.brand-mark{display:none}.gesture-button{padding:7px}.gesture-tools{left:12px}.zoom-tools{right:12px}.stage-bottom{padding-inline:12px}.preview-toolbar{padding-inline:10px}}
@media(max-width:620px) and (orientation:portrait){html,body{overflow:auto}.app-shell{min-height:760px;height:100dvh;grid-template-rows:60px minmax(0,1fr) 28px;padding-inline:8px}.title-block h1{font-size:16px;max-width:132px}.top-actions{gap:4px}.top-actions .button{font-size:12px;padding:8px;min-height:36px}.workspace{grid-template-columns:1fr;grid-template-rows:minmax(300px,1fr) minmax(350px,1.1fr);gap:10px;padding-top:10px}.preview-panel{grid-template-rows:44px minmax(0,1fr) 40px;border-radius:12px}.panel-title-row{display:flex;grid-row:1;padding:6px 10px}.panel-title-row>div:first-child{display:block}.panel-title-row h2{font-size:13px}.panel-title-row .tiny-note{display:none}.preview-actions{position:static;left:auto;right:auto;bottom:auto;gap:4px}.preview-actions .button{font-size:12px;min-height:29px;padding:5px 7px}.canvas-wrap{grid-row:2}.preview-toolbar{grid-row:3;visibility:visible;justify-content:center;padding:4px 6px;gap:4px}.season-tab{font-size:13px;padding:6px 9px}.stage-bottom{display:none}.controls-panel{grid-template-rows:48px 44px minmax(0,1fr) 36px;border-radius:12px}.nature-controls{padding:15px}.nature-controls .control{margin-bottom:20px}.nature-controls h3{margin-top:22px}.top-left{left:10px;top:10px}.top-right{right:10px;top:10px}.preview-corner{font-size:11px;padding:4px 7px}.view-switch{left:10px;top:42px;padding:3px}.view-button{font-size:12px;min-height:27px;height:27px;padding:3px 9px}.gesture-tools,.zoom-tools{bottom:10px;padding:3px}.gesture-tools{left:10px}.zoom-tools{right:10px}.gesture-button{font-size:12px;padding:6px 8px;min-height:28px}.zoom-button{height:28px;min-width:27px}#zoomFitBtn{min-width:40px}.bottom-right{display:none}.preset-card canvas{height:116px}.panel-pager{padding:7px 15px}.pixeldeck-badge span,.footer-tip{font-size:11px}.color-control{grid-template-columns:34px minmax(0,1fr) 68px 28px}.editor-tabs .button{font-size:13px}}
@media(max-height:720px) and (min-width:821px){.app-shell{grid-template-rows:60px minmax(0,1fr) 28px}.workspace{padding-top:12px}.tab{min-height:54px;font-size:13px;gap:4px}.tool-icon svg{width:20px;height:20px}.preview-panel{grid-template-rows:52px minmax(0,1fr) 42px 72px}.controls-panel{grid-template-rows:52px 44px minmax(0,1fr) 36px}.stage-bottom{padding-block:8px}.nature-controls{padding-top:16px}.panel-title-row{padding-block:9px}}
@media(max-height:520px) and (orientation:landscape){html,body{overflow:auto}.app-shell{min-height:510px;grid-template-rows:52px minmax(0,1fr) 26px}.tabs{display:none}.workspace{grid-template-columns:minmax(0,1fr) 330px;padding-top:8px}.preview-panel{grid-template-rows:46px minmax(0,1fr) 40px}.stage-bottom{display:none}.panel-title-row{padding:6px 10px}.preview-actions .button{font-size:12px;min-height:30px}.controls-panel{grid-template-rows:46px 40px minmax(0,1fr) 34px}.view-switch{top:44px}.gesture-tools,.zoom-tools{bottom:10px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.pixeldeck-return{display:block;padding:8px 16px;color:#b6f1c0;background:#101c1c;font:13px system-ui;text-decoration:none}