@import url("fonts/fonts.css");

/* UI theme only. Swatches, material samples and the WebGL scene remain original. */
:root{--blue:#242b20;--blue-2:#3d4836;--green:#087a52;--navy:#111411;--ink:#242b20;--muted:#626b59;--paper:#ecebe5;--white:#f4f3ed;--line:#c7cbbf;--soft:#e0e3d8;--shadow:none;--font:'Inter','Noto Sans Thai',Arial,sans-serif}
body{background:#111411}
button,input{font-family:var(--font)}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #087a52;outline-offset:3px}
.topbar{background:#111411;color:#f1f0ea;border-color:#353a33;backdrop-filter:none;-webkit-backdrop-filter:none}
.brand{border-color:#353a33}.brand-name{font-weight:500;letter-spacing:-.025em}
.studio-title b{font-weight:500}.studio-title span{color:#b1b1a9}
.icon-btn,.text-btn,.lang-btn,.primary,.secondary,.primary.small{border-radius:2px;box-shadow:none}
.icon-btn:hover,.text-btn:hover{background:#2a3027}
.lang-btn{background:transparent;border-color:#4e5848;color:#a8afa0}.lang-btn b:first-child{color:#f1f0ea}
.primary{background:#242b20;color:#f4f3ed;font-weight:500;border-color:#242b20;box-shadow:none}
.primary:hover{background:#3d4836;border-color:#3d4836;transform:none;box-shadow:none}
.secondary{background:transparent;color:#242b20;border-color:#a4ad99;font-weight:500}
.secondary:hover{background:#e0e3d8;border-color:#7b896e}
#quoteTop,#quoteBtn{background:#087a52;color:#fff;border-color:#087a52}
#quoteTop:hover,#quoteBtn:hover{background:#096643;border-color:#096643}
.viewport{background:#111411}
.loading{background:#111411;color:#f1f0ea}.loading small{color:#b1b1a9}
.load-mark i{background:#e0e3d8;border-radius:0}
.model-pill,.stage-tool,.view-tabs,.dimension-hud,.orbit-hint,.door-control,.fullscreen-btn{background:#111411ed;border-color:#4d5747;border-radius:2px;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;color:#f1f0ea}
.model-pill>span:last-child{color:#b1b1a9;border-color:#4d5747}
.status-dot{background:#d3d9ca;box-shadow:none}
.stage-tool:hover,.door-control:hover,.fullscreen-btn:hover{background:#353e2e}
.view-tabs button{border-radius:0;color:#b1b1a9}
.view-tabs button.active{background:#f1f0ea;color:#242b20;box-shadow:none;font-weight:500}
.dimension-hud>span{border-color:#4d5747}.dimension-hud small,.dimension-hud i{color:#aeb5a5}
.orbit-hint{color:#c9cdc2}.door-control{font-weight:500}.door-icon{border-color:#aeb5a5}.door-icon i{background:#e0e3d8}
.config-panel{background:#f4f3ed;border-color:#353a33;box-shadow:none;border-radius:0}
.steps{border-color:#c7cbbf}.steps button{color:#6e7666;font-weight:400}
.steps button.active{color:#242b20;font-weight:500}.steps button.active:after{background:#242b20}
.steps i{border-color:#9fa993}.steps button.active i{background:#242b20;border-color:#242b20;color:#f4f3ed}
.steps button.complete i{background:#e0e3d8;border-color:#8b997d;color:#242b20}
.panel-scroll{scrollbar-color:#b4bda9 transparent}.panel-scroll::-webkit-scrollbar-thumb{background:#b4bda9;border-color:#f4f3ed;border-radius:0}
.step-head h1{font-weight:500;line-height:1.25;letter-spacing:-.035em}
.eyebrow{color:#626b59;font-weight:500;letter-spacing:.11em}.step-head p{color:#626b59;line-height:1.75}
.field-title{color:#526047;font-weight:500}.field-title small{color:#6e7863}
.family-card,.model-list,.diagram-card,.choice-card,.collection-card,.finish-card,.range-group,.project-field,.drawing-card{border-radius:0;background:#f4f3ed;border-color:#c7cbbf;box-shadow:none}
.family-card:hover,.diagram-card:hover,.choice-card:hover,.finish-card:hover{border-color:#7b896e;transform:none}
.family-card.active,.diagram-card.active,.choice-card.active,.collection-card.active,.finish-card.active{border-color:#242b20;box-shadow:inset 0 0 0 1px #242b20}
.family-card i{color:#626b59;font-weight:500}.family-card b{font-weight:500;line-height:1.4}
.model-option{background:#f4f3ed;border-color:#c7cbbf}.model-option:hover{background:#e7e9de}.model-option.active{background:#dde2d4}
.model-option>span:last-child{color:#626b59}.model-option b{font-weight:500}
.model-option .radio{border-color:#8b997d}.model-option .radio:after{content:none}
.model-option.active .radio{border-color:#242b20}.model-option.active .radio:after{content:"";width:9px;height:9px;border-radius:50%;background:#242b20}
.model-facts,.review-card{background:#1b2118;color:#f1f0ea;border-radius:0;box-shadow:none}
.model-facts small,.review-title small,.review-specs small{color:#aeb5a5}.source-chip{color:#c9cdc2!important}.source-chip:before{background:#b7c6a8}
.source-chip.preliminary:before{background:#c7943f}
.mini-plan{background:#e6e8df;border-radius:0}.mini-plan:before{background:#f4f3ed;border-color:#7b896e}.mini-plan i{background:#3d4836}
.diagram-card b,.choice-card b{font-weight:500}.diagram-card small,.choice-card small{color:#626b59}
.seg-options{background:#e6e8df;border-color:#c7cbbf;border-radius:0}.seg-options button{color:#626b59;border-radius:0}
.seg-options button.active{background:#f4f3ed;color:#242b20;box-shadow:none;font-weight:500}
.choice-card .choice-icon{background:#e6e8df;color:#626b59;border-radius:0;font-weight:500}
.choice-card.active .choice-icon{background:#242b20;color:#f4f3ed}
.range-label output{background:#e0e3d8;color:#242b20;border-radius:0;font-weight:500}.range-group input{accent-color:#242b20}.range-scale{color:#707b64}
.drawing-note{background:#e8ebdf;border-color:#c7cbbf;border-radius:0}.drawing-note svg{color:#526047}.drawing-note p{color:#626b59}
.collection-card.active:after{background:#242b20;color:#f4f3ed;border-radius:0}.collection-card b{font-weight:500}
.finish-swatch{border-radius:0}.finish-card b{font-weight:500}.finish-card small{color:#626b59}
.switch{background:#b9c3ad}.switch.on{background:#242b20}.switch i{background:#f4f3ed;box-shadow:none}
.project-field input{background:transparent;color:#242b20}.review-id{color:#b1baa5;border-radius:0;border-color:#4d5747}
.review-title h2{font-weight:500}.review-specs{border-color:#4d5747}.review-specs>div{border-color:#4d5747}
.drawing-preview{background:#ecebe5}.text-link{color:#242b20;font-weight:500;text-decoration:underline;text-underline-offset:3px}
.planning-warning{border-radius:0;background:#f1eada;border-color:#b08235}.planning-warning p{color:#6a603e}
.panel-footer{background:#f4f3ed;border-color:#c7cbbf;backdrop-filter:none}.step-status{color:#626b59}
.mobile-grab{background:#a4ad99;border-radius:0}
.drawing-modal{border-radius:0;background:#f4f3ed;box-shadow:none}.drawing-modal::backdrop{background:#111411dc;backdrop-filter:none}
.modal-bar{background:#f4f3ed;border-color:#c7cbbf}.modal-bar button{border-radius:0;background:transparent;border-color:#a4ad99}
.drawing-modal>img{background:#ecebe5}.toast{background:#111411;color:#f1f0ea;border:1px solid #4d5747;border-radius:2px;box-shadow:none}
/* Neutralize the generated planning sheet's UI annotations, not product colors. */
.plan-sheet svg{border-radius:0;background:#f4f3ed}
.plan-sheet [fill="#071722"]{fill:#111411}.plan-sheet [fill="#1373c8"],.plan-sheet [fill="#087ce5"]{fill:#3d4836}
.plan-sheet [stroke="#1373c8"],.plan-sheet [stroke="#087ce5"]{stroke:#3d4836}
.plan-sheet [fill="#62d4ad"]{fill:#d3d9ca}.plan-sheet [fill="#8fa6b5"]{fill:#b1baa5}
.plan-sheet [fill="#eef3f6"],.plan-sheet [fill="#f8fafb"]{fill:#f4f3ed}
@media(max-width:780px){
  body{background:#f4f3ed}.config-panel{border-radius:0;box-shadow:none;border-top:1px solid #353a33}
  .topbar .text-btn:hover{background:#2a3027}.topbar .lang-btn{background:transparent}
  .step-page{padding:24px 22px 32px}.step-head p{font-size:13px;line-height:1.75}
  .steps button{font-size:9px}.family-card{min-height:80px}.family-card small{font-size:10px}
  .model-option small,.choice-card small,.collection-card small,.toggle-row small{font-size:10px;line-height:1.5}
  .panel-footer{padding-left:12px;padding-right:12px}.toast{max-width:calc(100vw - 32px);white-space:normal;text-align:center}
}