/* The Shape & Place Atelier — companion to the editorial atlas. */
:root{--ink:#172e35;--muted:#758078;--green:#3b5a50;--line:#d8ded2;--bg:#f4f2eb}
body{background:#f4f2eb;color:#172e35}.top{background:#172e35;color:#e7e9dc;border-bottom:1px solid #40544c;min-height:86px;padding:17px 4%;}.top .brand{color:#f0e7d6;text-decoration:none}.top .brand small{color:#a8b8ac;font-size:10px}.brand-mark{border-radius:0!important;background:transparent!important;border:1px solid #b9a07e!important;color:#d5b88e!important;transform:rotate(45deg);font-size:24px!important}.top .version{font-size:8px;letter-spacing:1px;color:#a6b5a9}.top .button{border-color:#65776b;background:#ffffff06;color:#e3dfd1;border-radius:4px;font-size:11px}.top .button.dark{background:#d2bc96;color:#233c36;border-color:#d2bc96}.button{border-radius:4px!important;font-size:11px;background:#fffef8;border-color:#d2dac9;color:#345046}.button.dark{background:#213c36;color:#f4eedf;border-color:#213c36}.button:hover{background:#e8eddf;color:#294738}main{max-width:1640px;padding-left:4%;padding-right:4%}.intro{padding:35px 0 30px;margin-bottom:7px;border-bottom:1px solid #d6dccd}.intro .eyebrow{font-size:10px;color:#987650;letter-spacing:.5px}.intro h1{font-size:43px;line-height:1.4;font-weight:400;letter-spacing:-1px}.intro h1 span{color:#927958}.intro p{color:#75816b;font-size:12px;line-height:2;max-width:620px;margin-top:14px}.study-note{background:none;border:1px solid #d5dccb;border-radius:3px;padding:17px 20px;max-width:265px;align-self:flex-end}.study-note strong{font-size:10px;font-weight:500}.study-note small{font-size:9px;line-height:1.9;color:#7c896f}.note-dot{background:#b79a6c}.lab-layout{gap:25px;margin-top:26px;grid-template-columns:270px minmax(0,1fr)}.configuration{border-radius:4px;background:#efefe5;border-color:#d7decc;padding:22px 18px}.step-label{margin-bottom:14px}.step-label>span{background:none;border:1px solid #c5cfb8;border-radius:50%;color:#8a7757;font-family:Arial,sans-serif;font-size:9px}.step-label h2{font-size:12px;font-weight:500}.type-card{border-radius:4px;background:#f9faf3;border-color:#dfe5d4;padding:10px;gap:10px;min-height:92px}.type-card img{border-radius:2px;filter:saturate(.7);width:52px;height:65px}.type-card strong{font-size:11px;font-weight:500}.type-card small{font-size:9px;color:#78896b}.type-card em{font-size:8px;color:#919c82}.type-card>b{font-size:9px;color:#9eab8d}.type-card.active{background:#e4ebda;border-color:#8ba078;box-shadow:none}.type-card:hover{background:#eaf0e0}.style-card{border-radius:4px;background:transparent;border-color:#d5dfc9;min-height:64px}.style-card.active{background:#dfe8d5;border-color:#94aa7f;box-shadow:none}.style-card strong{font-size:11px;font-weight:500}.style-card small{font-size:9px;color:#7d8b6e}.style-card>b{font-size:10px;color:#8b9b79}.swatch{border-radius:50%;border:1px solid #d6decb}.config-bottom{border-top-color:#d4ddc6}.config-bottom p{font-size:9px;line-height:1.9;color:#7b896e}.viewer-toolbar{margin-bottom:15px}.view-tabs{background:#e8ebdf;border:1px solid #d4ddc9;border-radius:4px;padding:4px}.view-tabs button{border-radius:3px;font-size:11px;color:#718166;padding:9px 15px}.view-tabs button.active{background:#fffdf4;box-shadow:0 2px 6px #233d3510;color:#3f5b43}.live-badge{font-size:9px;color:#7a8b6d}.live-badge i{background:#849771}.stage{border-radius:4px;border-color:#cdd8c3;height:535px}.stage-title{top:24px;right:26px}.stage-title>span{font-family:Arial,sans-serif;font-size:9px;letter-spacing:2px;color:#879977}.stage-title h2{font-size:20px;font-weight:500;color:#364f3b}.stage-title p{font-size:10px;color:#7f8e74}.stage-badge{border-radius:2px;background:#ffffffa3;border:1px solid #d5dec8;color:#6d8161;font-size:8px;top:25px;left:23px}.stage-tools{left:23px;top:90px;gap:5px}.stage-tools button{width:33px;height:33px;border-radius:3px;box-shadow:none;border:1px solid #d5dfca;background:#fffef6dc;font-size:12px;color:#4a6449}.stage-foot{font-size:9px;padding:14px 22px;background:#fffdf52b;color:#728967}.orientation{left:26px;bottom:67px}.controls{padding:17px 0;border-bottom:1px solid #d7deca;gap:12px}.toggle{font-size:10px;color:#607755}.toggle input{accent-color:#577348}.range-control{font-size:10px}.range-control select{border-radius:3px;border-color:#d0dcc1;background:#f8faf0;color:#496340;font-size:10px}.text-button{font-size:10px;color:#8e7351}.design-description{padding:25px 0;gap:25px}.design-description .eyebrow{font-size:9px;color:#917750}.design-description h3{font-size:19px;font-weight:400;line-height:1.7}.design-description p{font-size:11px;line-height:2;color:#7c896e;max-width:630px}.view-guide{gap:12px}.view-guide article{border-radius:3px;background:#edeedf;border-color:#d9dfcb;padding:22px}.view-guide article>span{font-size:8px;letter-spacing:.4px;color:#9d8864}.view-guide h3{font-size:13px;font-weight:500;margin-top:10px}.view-guide p{font-size:10px;line-height:1.9;color:#7c8a6d}.comparison{gap:14px}.compare-card{border-radius:4px;border:1px solid #d1dcc2;background:#fffef8}.compare-stage{height:390px}.compare-label{border-radius:2px;font-size:8px;background:#fffdf3cf;color:#687b59}.compare-info{padding:20px 15px}.compare-info h3{font-size:15px;font-weight:500}.compare-info p{font-size:10px;color:#7b8d68;line-height:1.9;min-height:38px}.compare-info .button{font-size:10px}.comparison-note{font-size:10px;line-height:1.9;color:#7e8d6e}.footer{border-color:#d2dcc4;font-size:9px;color:#879577;padding:23px 0;margin-top:28px}.technical .stage-title h2{color:#dce6d7}.technical .stage-title>span,.technical .stage-title p{color:#8db2a2}.technical .stage-badge{background:#183c3ec9;border-color:#578478;color:#b4d6c0}.technical .stage-foot{color:#a3c5b0}.technical .stage-tools button{background:#244743;color:#b5d7be;border-color:#567b64}dialog{border-radius:6px;background:#fffdf6;color:#233d32}dialog::backdrop{background:#152e346b;backdrop-filter:blur(5px)}.dialog-head{background:#edf0e4;border-bottom-color:#d8dfcb}.dialog-head h2{font-size:17px;font-weight:500}.reference-body{gap:28px}.reference-body img{border-radius:3px}.reference-body h3{font-weight:400;font-size:23px}.reference-body p{font-size:12px;line-height:2;color:#76846a}.choice{border-radius:4px;background:#f0f4e7;border-color:#d5e0c5}.choice strong{font-size:13px}.choice small{font-size:10px}.choice button{border-radius:3px}.dialog-foot{font-size:10px}.toast{background:#234439;border-radius:4px;border:1px solid #66835c;font-size:12px}
@media(max-width:1100px){.lab-layout{grid-template-columns:235px minmax(0,1fr);gap:18px}.intro h1{font-size:38px}.stage{height:480px}.compare-stage{height:310px}.compare-info{padding:14px 10px}.compare-info h3{font-size:13px}.configuration{padding:18px 14px}.view-tabs button{padding:8px 10px;font-size:10px}.view-guide article{padding:16px}.type-card{gap:7px}.type-card img{width:44px}.type-card>b{display:none}.live-badge{font-size:8px}.stage-title h2{font-size:18px}}
@media(max-width:760px){.top{padding:13px 16px;min-height:75px;gap:10px}.top .brand{font-size:14px;gap:12px}.brand-mark{width:30px!important;height:30px!important;font-size:18px!important}.top .brand small{font-size:8px}.top .version{display:none}.top .button{font-size:9px;padding:7px 9px;min-height:32px}.header-actions{gap:5px}main{padding-left:15px;padding-right:15px}.intro{padding:25px 0 23px;gap:18px}.intro h1{font-size:35px}.intro .eyebrow{font-size:9px}.intro p{font-size:11px;line-height:1.9;margin-top:12px}.study-note{padding:12px 15px;max-width:none;width:100%;background:#ebeede}.study-note strong{font-size:10px}.study-note small{font-size:9px}.lab-layout{display:block;margin-top:22px}.configuration{padding:18px 14px;margin-bottom:22px}.step-label h2{font-size:11px}.type-list{gap:7px}.type-card{min-height:0;padding:8px 5px;gap:6px}.type-card img{width:100%;height:74px;border-radius:2px}.type-card strong{font-size:10px;line-height:1.8}.type-card em{font-size:8px}.style-card{padding:8px 5px;min-height:43px}.style-card strong{font-size:9px}.styles{gap:6px}.swatch{width:16px;height:16px}.viewer-toolbar{margin:0 0 12px}.view-tabs{width:100%;justify-content:space-between}.view-tabs button{font-size:10px;padding:9px 11px;flex:1}.stage{height:440px}.stage-title{top:22px;right:20px}.stage-title h2{font-size:18px}.stage-title p{font-size:9px}.stage-badge{left:14px;top:24px;font-size:7px}.stage-tools{left:14px;top:85px}.stage-tools button{width:31px;height:31px}.stage-foot{padding:13px;font-size:8px}.orientation{left:20px}.controls{padding:15px 0;gap:12px}.toggle{font-size:10px}.text-button{font-size:10px}.design-description{padding:23px 0;gap:17px}.design-description h3{font-size:18px}.design-description p{font-size:11px}.design-description .button{font-size:11px;min-height:40px}.view-guide{gap:10px}.view-guide article{padding:20px}.view-guide h3{font-size:14px}.view-guide p{font-size:11px}.compare-stage{height:350px}.compare-info{padding:20px}.compare-info h3{font-size:17px}.compare-info p{font-size:11px;min-height:auto}.compare-info .button{font-size:11px}.comparison-note{font-size:10px}.footer{font-size:8px;line-height:1.9;gap:8px}.reference-body h3{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}