.cg-tool{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:start;gap:12px;display:grid}.cg-box{background:#13151b;border-radius:6px;padding:16px}.cg-view{position:sticky;top:72px}.cg-side{gap:12px;display:grid}.cg-presets{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.cg-presets button,.cg-scenes button{background:var(--raised);height:34px;color:var(--soft);font:600 11px var(--font);text-transform:uppercase;cursor:pointer;border:0;border-radius:4px;padding:0 12px}.cg-presets button:hover,.cg-scenes button:hover{background:#2a2e39}.cg-presets button.pro{background:var(--row)}.cg-presets button[aria-pressed=true],.cg-scenes button[aria-pressed=true]{background:var(--chip);color:var(--green)}.cg-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.cg-tile{aspect-ratio:16/9;border-radius:4px;position:relative;overflow:hidden}.cg-tile svg{width:100%;height:100%;position:absolute;inset:0}.cg-tile span{color:#fff;text-transform:uppercase;background:#0000008c;border-radius:3px;padding:1px 6px;font-size:10px;font-weight:700;position:absolute;bottom:5px;left:6px}.cg-zoom{flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:10px;display:flex}.cg-scenes{flex-wrap:wrap;gap:6px;display:flex}.cg-out{gap:14px;display:grid}.cg-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.cg-code{align-items:stretch;gap:8px;display:flex}.cg-code .input{min-width:0;font-family:ui-monospace,Menlo,monospace;font-size:13px}.cg-code .btn{flex:none;height:44px}.cg-cmds{background:var(--row);max-height:200px;color:var(--soft);white-space:pre;border-radius:4px;margin:0;padding:12px;font:12px/1.5 ui-monospace,Menlo,monospace;overflow:auto}.cg-grp{gap:12px;display:grid}.cg-grp+.cg-grp{border-top:1px solid var(--line);margin-top:18px;padding-top:14px}.cg-grp>h3{color:var(--mute);margin:0;font-size:13px}.cg-row{grid-template-columns:90px minmax(0,1fr) 72px;align-items:center;gap:10px;display:grid}.cg-row label{color:var(--soft);font-size:12px;font-weight:600}.cg-row input[type=range]{width:100%;height:40px;accent-color:var(--green)}.cg-row .input{text-align:right;height:36px;padding:0 8px}.cg-checks{flex-wrap:wrap;gap:8px;display:flex}.cg-checks label{background:var(--row);height:40px;color:var(--soft);cursor:pointer;border-radius:4px;align-items:center;gap:8px;padding:0 12px;font-size:12px;font-weight:600;display:inline-flex}.cg-checks input{accent-color:var(--green);width:16px;height:16px}.cg-sw{flex-wrap:wrap;gap:6px;display:flex}.cg-sw button{cursor:pointer;border:2px solid #0000;border-radius:4px;width:40px;height:40px}.cg-sw button[aria-pressed=true]{border-color:var(--text)}.cg-rgb{grid-template-columns:44px repeat(3,minmax(0,1fr));align-items:center;gap:8px;display:grid}.cg-rgb input[type=color]{cursor:pointer;background:0 0;border:0;border-radius:4px;width:44px;height:40px;padding:0}.cg-rgb .input{height:40px;padding:0 8px}.cg-adv summary{cursor:pointer;color:var(--green);text-transform:uppercase;font-size:12px;font-weight:600}.cg-adv[open] summary{margin-bottom:12px}.cg-adv .cg-grp{margin-top:0}.cg-ok{color:var(--green);min-height:18px;margin:0;font-size:12px}.sc-sky{background:radial-gradient(34% 30% at 28% 26%,#ffffffe6,#0000 72%),radial-gradient(26% 20% at 74% 20%,#ffffffbf,#0000 72%),linear-gradient(#4f97dd 0%,#a6d1f3 62%,#dccfaa 62.4%,#b7a982 100%)}.sc-concrete{background:repeating-linear-gradient(90deg,#0000 0 79px,#0003 79px 81px),repeating-linear-gradient(0deg,#0000 0 59px,#00000029 59px 61px),linear-gradient(#9d9fa2,#76787c 68%,#57595c 68.4%,#494b4e)}.sc-sand{background:linear-gradient(#2d2418,#2d2418) 20% 47%/16% 40% no-repeat,linear-gradient(#85653b,#74582f) 80% 64%/14% 22% no-repeat,linear-gradient(#dbca9e 0%,#c6b282 68%,#a69163 68.4%,#8e7b52 100%)}.sc-dark{background:radial-gradient(16% 38% at 50% 48%,#dbe7f1 0%,#7f909d 55%,#0000 100%),linear-gradient(90deg,#07080a 0%,#1b1e24 28% 72%,#07080a 100%),#0d0e11}.sc-brick{background:radial-gradient(#0000 45%,#0006 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='32'%3E%3Crect width='48' height='32' fill='%23a35a42'/%3E%3Cpath d='M0 0H48M0 16H48M0 32H48M24 0V16M0 16V32M48 16V32' stroke='%236d3a2a' stroke-width='2' fill='none'/%3E%3C/svg%3E")}.sc-foliage{background:radial-gradient(30% 40% at 20% 30%,#3e6a34,#0000 72%),radial-gradient(34% 44% at 80% 34%,#4f7d3d,#0000 72%),radial-gradient(40% 36% at 50% 96%,#2c4825,#0000 80%),linear-gradient(#6b9b53,#45713b 62%,#5b4b33 62.4%,#463a28)}@media (min-width:641px){.hero.has-art:has(.cg-tool){grid-template-columns:minmax(0,1fr)}.hero.has-art:has(.cg-tool)>.art{opacity:.6;z-index:0;width:230px;position:absolute;top:8px;right:24px}.hero.has-art:has(.cg-tool) .hero-text{z-index:1}}@media (max-width:900px){.cg-tool{grid-template-columns:minmax(0,1fr)}.cg-view{position:static}}@media (max-width:640px){.cg-presets button,.cg-scenes button,.cg-box .btn-sm{height:40px}.cg-presets{scrollbar-width:none;flex-wrap:nowrap;margin-right:-12px;padding-right:12px;overflow-x:auto}.cg-presets button{flex:none}}@media (max-width:480px){.cg-box{padding:12px}.cg-row{grid-template-columns:74px minmax(0,1fr) 64px;gap:8px}}
