:root{font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;color:#293f4e;background:#edf1f3;font-size:14px;font-synthesis:none;--line:#dce4e8;--muted:#70838e;--blue:#236984}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}button,input,select{font:inherit}button{border:1px solid var(--line);border-radius:7px;background:white;color:#36505f;padding:9px 13px;cursor:pointer;transition:background .12s,border-color .12s}button:hover{background:#eff6f9;border-color:#aac5d3}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #74b6d4;outline-offset:2px}button:disabled{opacity:.4;cursor:not-allowed}header{min-height:78px;display:flex;align-items:center;gap:30px;padding:15px 28px;background:#fff;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px}.mark{display:grid;place-items:center;width:39px;height:39px;background:#28566d;color:#e0f1f6;border-radius:9px;font-size:28px}.brand strong{display:block;font-size:18px;letter-spacing:-.5px;white-space:nowrap}.brand small{display:block;color:var(--muted);font-size:11px;letter-spacing:2px;margin-top:4px}.project{flex:1;display:flex;align-items:center;gap:15px}.project input{width:190px;min-width:0;border:0;background:transparent;font-weight:600;color:#3b525e;padding:6px}.project span{font-size:11px;color:#7b8f99;white-space:nowrap}nav,.history,.tools{display:flex;gap:7px;align-items:center}.history{gap:2px;margin-right:8px}.history button{font-size:23px;padding:2px 10px}.primary{background:#25637f;border-color:#25637f;color:#fff}.primary:hover{background:#194e68;color:white}.quiet{border-color:transparent;background:transparent;color:#6f8390;font-size:12px}main{max-width:1600px;margin:0 auto;padding:22px 30px 8px}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.switch{display:flex;background:#e4ebef;padding:3px;gap:3px;border-radius:8px}.switch button{border:0;background:transparent;flex:1;white-space:nowrap;padding:9px 16px}.switch .active{background:white;color:#205f80;box-shadow:0 1px 5px #334f6314;font-weight:600}.canvas-wrap{position:relative;border:1px solid var(--line);border-radius:12px;background:#fbfcfc;box-shadow:0 6px 28px #26445b04;overflow:hidden}.canvas-wrap:before{content:'';position:absolute;inset:0;background-image:radial-gradient(#b9c7d335 .7px,transparent .7px);background-size:20px 20px;pointer-events:none}#canvas{position:relative;width:100%;height:calc(100vh - 233px);min-height:470px;max-height:920px;touch-action:none;outline:none}#canvas>svg{display:block;width:100%;height:100%}#canvas [data-owner="Rat"],#canvas [data-wall]{cursor:pointer}#canvas [data-owner^="Floor"],#canvas [data-owner^="Metal floor"],#canvas [data-owner^="Acrylic floor"]{cursor:pointer}.hit-zone{fill:transparent;stroke:none}.hit-zone:hover{fill:#56a4c213;stroke:#7bbbd199;stroke-width:1.2}.hit-zone:focus-visible{outline:none;fill:#56a4c225;stroke:#328cb6;stroke-width:2}.selection-outline{fill:#51a7d010;stroke:#2186ae;stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:none}.rat-outline{fill:none;stroke:#469ab7;stroke-width:1.5;stroke-dasharray:5 4;vector-effect:non-scaling-stroke;pointer-events:none}.drop-outline{fill:#37a08235;stroke:#138563;stroke-width:2.5;vector-effect:non-scaling-stroke;pointer-events:none}.drop-outline.invalid{fill:#ce667335;stroke:#b64151}#canvas.dragging,#canvas.dragging *{cursor:grabbing!important}.canvas-note{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);white-space:nowrap;border-radius:20px;padding:7px 15px;color:#6d8694;background:#ffffffdc;font-size:12px;pointer-events:none}footer{display:flex;gap:20px;align-items:center;padding:16px 3px;color:var(--muted);font-size:12px}.display-options{display:flex;gap:20px;flex-wrap:wrap}.display-options label,.check{display:flex;align-items:center;gap:6px}input[type=checkbox]{accent-color:#287393;width:14px;height:14px}.save-hint{margin-left:auto;color:#8a9ba6}.popover{position:fixed;z-index:20;width:326px;max-width:calc(100vw - 20px);max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #cbd9e2;background:#fff;border-radius:13px;box-shadow:0 16px 60px #2844572b,0 3px 12px #28445713;padding:16px}.popover-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:15px}.popover-head span{color:#778f9d;font-size:11px;letter-spacing:.4px}.popover-head h2{font-size:16px;margin:5px 0 0;font-weight:650}.popover-head button{padding:1px 8px;border:0;font-size:24px;color:#8b9eaa}.section-label{font-size:12px;font-weight:600;margin:17px 0 9px;color:#627c8d}.modules{display:grid;grid-template-columns:1fr 1fr;gap:7px}.modules button{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:10px}.modules .active,.poses .active,.floor-options .active{border-color:#4693b3;background:#eff8fc}.modules i{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:7px}.modules small{font-size:11px;color:#8498a5}.popup-actions{border-top:1px solid var(--line);margin-top:16px;padding-top:13px;display:flex;gap:6px}.popup-actions button{flex:1;font-size:12px;padding:7px 5px}.danger{color:#a4575f}.hint{font-size:11px;color:#8296a3;line-height:1.7;margin:10px 0 0}.field{display:flex;flex-direction:column;gap:7px;font-size:12px;color:#5f798a;margin-top:12px}select,input[type=number]{background:#fff;border:1px solid var(--line);border-radius:6px;padding:8px;color:#345466;width:100%}.row{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:13px;margin:13px 0}.row select{width:125px}.row output{color:#6d8798}input[type=range]{width:100%;accent-color:#317794;margin:2px 0 9px}.poses{display:grid;grid-template-columns:1fr 1fr;gap:7px}.poses button{font-size:11px;padding:5px 4px 9px;overflow:hidden}.poses svg{display:block;width:100%;height:73px}.floor-options{display:flex;gap:9px}.floor-options button{flex:1;font-size:12px;padding:14px 5px}.floor-icon{display:block;height:30px;width:52px;transform:skew(-15deg);border:1px solid #9db0b9;margin:0 auto 11px}.bars{background:repeating-linear-gradient(0deg,#647b88 0 4px,#d9e4e9 4px 7px)}.acrylic{background:radial-gradient(#8caebb 1.5px,transparent 1.7px),#dfedf2;background-size:8px 8px}.export-buttons{display:flex;gap:7px;margin-top:16px}.export-buttons button{flex:1}.check{font-size:12px;margin:13px 0}.keys{width:100%;border-collapse:collapse;font-size:12px}.keys td{padding:9px 0;border-bottom:1px solid #edf1f3}.keys td:first-child{font-family:Consolas,monospace;color:#3e718e;white-space:nowrap;padding-right:14px}#dragBadge{position:fixed;z-index:25;pointer-events:none;background:#276d88;color:#fff;border-radius:6px;padding:7px 11px;font-size:12px}#dragBadge.invalid{background:#a64955}#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);z-index:30;background:#294554;color:#fff;padding:12px 21px;border-radius:8px;box-shadow:0 8px 25px #18374c22;opacity:0;pointer-events:none;transition:opacity .15s;font-size:13px;max-width:92vw}#toast.show{opacity:1}#toast.error{background:#a04b57}
@media(max-width:1150px){header{gap:17px;padding:15px 20px}.project{gap:0}.project input{width:165px}.project span{display:none}.brand small{display:none}nav{gap:5px}nav button{font-size:12px;padding:8px 10px}main{padding:18px 20px 6px}.save-hint{display:none}}
@media(max-width:760px){header{flex-wrap:wrap;gap:10px;padding:13px 15px}.brand{flex:1}.brand strong{font-size:16px}.project{flex:none}.project input{width:150px;font-size:13px}nav{width:100%;justify-content:space-between}nav button{padding:8px}.history{margin:0}.history button{padding:1px 8px}.preview-toolbar{align-items:flex-start;flex-wrap:wrap;gap:12px;margin-bottom:12px}.switch button{padding:8px 12px;font-size:12px}.tools{width:100%;gap:6px}.tools button{font-size:12px;padding:7px 10px}.tools .quiet{margin-left:auto}main{padding:14px 10px 4px}#canvas{height:calc(100dvh - 280px);min-height:360px}.canvas-note{font-size:10px;padding:6px 9px;bottom:9px}footer{flex-wrap:wrap;gap:10px;padding:12px 4px}.display-options{gap:11px;font-size:11px}.popover{padding:14px}.popover-head{margin-bottom:12px}}
.poses{grid-template-columns:repeat(2,minmax(0,1fr))}.poses svg{height:85px}.poses button{padding:8px 6px}.poses span{display:block;margin-top:4px}.rat-hit:focus-visible{outline:none;stroke:#469ab7;stroke-width:2;vector-effect:non-scaling-stroke}

/* Public release controls keep the canvas as the primary workspace. */
#language{width:auto;max-width:92px;font-size:12px;padding:8px 5px}
.project-links{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:0 4px 10px;color:#70838e;font-size:11px}
.project-links a{color:#4f7385;text-underline-offset:3px}
.example-button{display:block;width:100%;text-align:left;margin:8px 0}
@media(max-width:1000px){header{flex-wrap:wrap}nav{flex-wrap:wrap}.preview-toolbar{flex-wrap:wrap}.tools{flex-wrap:wrap}}
@media(max-width:760px){.canvas-note{white-space:normal;text-align:center;width:max-content;max-width:94%}.project-links{font-size:10px}.tools .quiet{margin-left:0}.display-options{gap:10px}nav{justify-content:flex-start}.keys{font-size:11px}.keys td:first-child{white-space:normal}}

/* Warm neutral surroundings keep the reference illustration's thin lines clear. */
:root{color:#333630;background:#F1F1ED;--line:#DADAD3;--muted:#787C72;--blue:#566C70}
header{border-bottom-color:#DADAD3}.mark{background:#535D56;color:#F5F5F0}
.primary{background:#586B68;border-color:#586B68}.primary:hover{background:#414F4D}
button:hover{background:#F0F2ED;border-color:#B2BCB2}
.switch{background:#E4E6DE}.switch .active{color:#414F47}
.canvas-wrap{background:#FAFAF7;border-color:#D1D5CA;box-shadow:0 6px 28px #464A3D08}
.canvas-wrap:before{background-image:none}
.popover{border-color:#D0D5CB}.modules .active,.poses .active,.floor-options .active{border-color:#8EA298;background:#F1F5EF}
.floor-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.floor-icon{border-color:#858780;width:44px}.plain{background:#E0DFDC}
.bars{background:repeating-linear-gradient(0deg,#E0DFDC 0 4px,#9E9D9B 4px 6px)}
.acrylic{background:radial-gradient(#A9ADA5 1px,transparent 1.2px),#E0DFDC;background-size:8px 8px}
/* Keep guidance outside the drawing so the last installation row is visible. */
.canvas-note{position:relative;bottom:auto;left:auto;transform:none;width:fit-content;max-width:calc(100% - 24px);margin:0 auto 12px;white-space:normal;text-align:center}
