/* Customer-first decoration studio. Technical configuration stays internal. */
[hidden],.customer-hidden{display:none!important}
.steps{grid-template-columns:repeat(3,minmax(0,1fr))}
.dimension-hud{display:none!important}
.viewport canvas{touch-action:pan-y!important}
.step-head h1{max-width:13ch;font-size:36px}
.step-head p{max-width:44ch}
.needs-use{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.needs-use button{min-width:0;min-height:83px;padding:13px 12px;border:1px solid #b7bdad;background:transparent;text-align:left;cursor:pointer;color:#11130f}
.needs-use button.active{border-color:#146846;box-shadow:inset 0 0 0 1px #146846;background:#e7ecdf}
.needs-use b,.needs-use small{display:block}
.needs-use b{font-size:15px;line-height:1.4}
.needs-use small{font-size:12px;line-height:1.5;color:#606658;margin-top:5px}
.needs-numbers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px}
.needs-field{min-width:0;font-size:14px;font-weight:650;line-height:1.5}
.needs-field input{display:block;min-width:0;width:100%;height:54px;margin:9px 0 6px;border:1px solid #a9b29b;background:#fffef8;color:#11130f;padding:10px 12px;font-size:24px;font-weight:700;border-radius:0}
.needs-field input[aria-invalid="true"]{border:2px solid #9b3c2a}
.needs-field small{display:block;font-size:12px;line-height:1.5;font-weight:400;color:#66695f}
.needs-check{display:flex;align-items:flex-start;gap:11px;cursor:pointer;margin-top:24px}
.needs-check input{flex:none;width:20px;height:20px;margin-top:2px;accent-color:#146846}
.needs-check b{font-size:14px;line-height:1.6}
.needs-check small{display:block;font-size:12px;line-height:1.6;color:#66695f;margin-top:4px}
.capacity-advice{border-top:2px solid #146846;background:#e7ecdf;padding:20px;margin-top:26px}
.capacity-advice h2{font-size:27px;line-height:1.25;letter-spacing:-.035em;margin:10px 0 13px;overflow-wrap:anywhere}
.capacity-advice p{font-size:14px;line-height:1.7;color:#424a3b}
.advice-model{display:block;border-top:1px solid #c3cdb6;padding-top:12px;margin-top:14px;font-size:12px;line-height:1.6;color:#536046}
.capacity-advice details{margin-top:16px;border-top:1px solid #c3cdb6}
.capacity-advice summary{font-size:13px;font-weight:650;padding:14px 0 2px;cursor:pointer;min-height:44px}
.capacity-advice details p{font-size:12px;line-height:1.7;margin-top:10px}
.needs-note{font-size:12px;line-height:1.75;color:#66695f;margin-top:14px}
.view-tabs button,.stage-tool{min-height:44px}
.view-tabs{top:auto;bottom:76px}
.stage-bottom{bottom:23px}
.orbit-hint{max-width:29%;line-height:1.5}
.model-pill{max-width:calc(100% - 75px);min-width:0}
.model-pill b{white-space:normal;line-height:1.4}
.model-pill>span:last-child{font-size:11px}
.finish-card small,.choice-icon{display:none!important}
.collection-card small{font-size:13px}
.finish-card{min-height:98px}
.finish-swatch{display:block;height:50px;border-radius:0}
.review-card{border-radius:0}
.review-specs b{font-size:13px;line-height:1.55}
.review-specs small{font-size:10px;line-height:1.6}
.review-title h2{font-size:21px}
.review-title{flex-wrap:wrap}
.review-id{margin-left:16px}
.review-source p{font-size:13px}
.panel-footer .primary,.panel-footer .secondary{min-height:46px;font-size:13px}
.step-status{font-size:11px}
.step-page[data-page="4"] .planning-warning{border-radius:0}
.step-page[data-page="4"] .planning-warning p{font-size:13px;line-height:1.7}
.collection-card.active:after{width:8px;height:8px;border:0;border-radius:50%}
@media(max-width:780px){
  body{overflow:hidden}
  .app-shell{position:fixed;inset:56px 0 0;height:calc(100dvh - 56px);padding:0;display:flex;flex-direction:column;overflow:hidden}
  .top-actions #undoBtn{display:grid;width:32px;min-width:32px;height:38px;padding:5px}
  .top-actions #shareBtn{padding-inline:5px}
  .viewport{height:42dvh;min-height:260px;max-height:390px;position:relative;top:auto;flex:none}
  .config-panel{margin-top:0;min-height:0;height:auto;box-shadow:none;flex:1}
  .panel-scroll{overflow-y:auto;overscroll-behavior:contain}
  .mobile-grab{display:none}
  .steps{height:54px}
  .steps button{font-size:12px}
  .step-head h1,body[data-lang="th"] .step-head h1{font-size:32px}
  .step-head p{font-size:15px}
  .step-page{padding:26px 22px 30px}
  .panel-footer{padding-bottom:max(12px,env(safe-area-inset-bottom));height:auto;min-height:72px;position:static}
  .stage-top{top:12px;left:12px;right:12px}
  .view-tabs{bottom:72px}
  .view-tabs button{padding:9px 12px;min-width:80px;font-size:12px;white-space:nowrap}
  .stage-bottom{bottom:17px}
  .stage-tool{min-height:40px}
  .model-pill>span:last-child{display:none}
  .door-control{min-height:44px}
  .finish-grid{gap:10px}
  .finish-card b{font-size:14px;line-height:1.5}
  .seg-options{flex-wrap:wrap}
  .seg-options button{min-height:44px}
  .collection-card small{font-size:13px;line-height:1.6}
  .toast{width:max-content;max-width:calc(100vw - 32px);white-space:normal;border-radius:0;text-align:center;line-height:1.5}
}
@media(max-width:780px) and (max-height:560px){
  .app-shell{overflow:auto}
  .viewport{height:220px;min-height:220px}
  .config-panel{flex:none;min-height:420px}
  .panel-scroll{overflow:visible}
  .panel-footer{position:sticky;bottom:0}
}
@media(max-width:360px){
  .step-page{padding-inline:18px}
  .needs-numbers{gap:12px}
  .needs-use b{font-size:14px}
  .capacity-advice{padding:16px}
  .capacity-advice h2{font-size:24px}
  .view-tabs button{min-width:69px;padding:9px 10px}
}
