:root{color:#312d2d;background:#fff;font-family:Noto Sans Thai,Sarabun,Aptos,Segoe UI,sans-serif;font-synthesis:none;line-height:1.5;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}#root{min-height:100vh}.app-shell{min-height:100vh;overflow-x:hidden;background:#fff}.hero-section{max-width:1120px;margin:0 auto;padding:34px 24px 20px;text-align:center}.hero-section h1{margin:0;color:#454040;font-size:clamp(38px,5.4vw,66px);font-weight:800;letter-spacing:-.045em;line-height:1.08}.hero-section p{max-width:880px;margin:18px auto 0;color:#686060;font-size:clamp(18px,2vw,27px);font-weight:400;line-height:1.45}.map-section{width:100%;height:min(640px,68svh);min-height:470px;margin-top:-2px;background:#17120d}.map-shell{position:relative;width:100%;height:100%}.map-shell .gm-style,.map-shell .gm-style *{font-family:inherit}.map-fallback{display:grid;place-items:center;align-content:center;gap:10px;width:100%;height:100%;padding:24px;color:#fff7e9;text-align:center}.map-fallback strong{font-size:22px}.place-search-control{position:absolute;top:18px;left:18px;z-index:10;display:flex;align-items:center;gap:12px;width:min(470px,calc(100% - 112px));min-height:56px;padding:0 14px;border-radius:8px;background:#fffffff7;color:#625d59;box-shadow:0 18px 40px #120e0933}.place-autocomplete-host{flex:1;min-width:0}.place-autocomplete-input{width:100%}.place-autocomplete-input,gmp-place-autocomplete{color-scheme:light}.drawing-toolbar{position:absolute;left:50%;bottom:18px;z-index:10;display:flex;align-items:center;overflow:hidden;border-radius:8px;background:#fffffff7;box-shadow:0 18px 40px #120e0942;transform:translate(-50%)}.toolbar-button,.locate-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:54px;height:52px;border:0;border-right:1px solid #ece7dc;background:transparent;color:#4f4b48;cursor:pointer;font-weight:700;transition:background .15s ease,color .15s ease,transform .15s ease}.toolbar-button:hover,.locate-button:hover{background:#fff4d8;color:#2f2a26}.toolbar-button:active,.locate-button:active{transform:translateY(1px)}.toolbar-button.active{background:#ffc947;color:#2d2413}.toolbar-button:last-child{border-right:0}.reset-button{min-width:132px;padding:0 21px;color:#211c18}.locate-button{position:absolute;top:18px;right:18px;z-index:10;width:56px;min-width:56px;border:0;border-radius:8px;background:#fffffff5;box-shadow:0 18px 40px #120e0933}.locate-button:disabled{cursor:wait;opacity:.75}.current-location-marker{position:relative;width:24px;height:24px;transform:translate(-50%,-50%);pointer-events:none}.current-location-dot,.current-location-pulse{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:999px}.current-location-dot{top:5px;right:5px;bottom:5px;left:5px;border:2px solid #ffffff;background:#2f80ff;box-shadow:0 0 0 1px #144eb533}.current-location-pulse{background:#2f80ff47;animation:location-pulse 1.8s ease-out infinite}.area-chip{position:absolute;left:18px;bottom:18px;z-index:10;display:inline-flex;align-items:baseline;gap:8px;min-height:44px;padding:9px 13px;border-radius:8px;background:#201a13db;color:#fff7e8;box-shadow:0 18px 40px #120e0942}.area-chip span{color:#fff7e8bf;font-size:13px}.area-chip strong{font-size:22px;line-height:1}.area-chip small{color:#fff7e8bf;font-size:13px}.map-hint,.map-alert{position:absolute;left:50%;z-index:10;width:min(520px,calc(100% - 32px));border-radius:8px;box-shadow:0 18px 40px #120e093d;transform:translate(-50%)}.map-hint{top:18px;padding:12px 16px;background:#fff6e0f5;color:#654106;font-weight:700;text-align:center}.map-alert{top:76px;padding:12px 16px;background:#fff2ebf7;color:#9b2c10;font-weight:700;text-align:center}.roof-info-section{padding:72px 24px 96px;background:#fff}.roof-info-inner{width:min(780px,100%);margin:0 auto}.roof-info-inner h2{margin:0 0 34px;color:#211f1f;font-size:clamp(28px,3vw,38px);font-weight:800;letter-spacing:-.02em}.roof-area-field{display:grid;gap:9px;color:#5e5757;font-size:22px}.roof-area-field input{width:100%;min-height:58px;padding:0 16px;border:1px solid #cfc7c0;border-radius:7px;background:#fff;color:#312d2d;font-size:24px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.roof-area-field input:focus{border-color:#eda51a;box-shadow:0 0 0 4px #ffc94740}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes location-pulse{0%{transform:scale(.7);opacity:.95}70%{transform:scale(1.9);opacity:0}to{transform:scale(1.9);opacity:0}}@media (max-width: 760px){.hero-section{padding:20px 18px 14px}.hero-section h1{letter-spacing:-.035em}.hero-section p{margin-top:12px;font-size:17px}.map-section{height:62svh;min-height:430px}.drawing-toolbar{bottom:14px}.toolbar-button{min-width:50px;height:50px}.reset-button{min-width:110px;padding:0 14px}.area-chip{left:14px;bottom:78px}.place-search-control{top:14px;left:14px;width:calc(100% - 86px);min-height:52px;padding:0 12px}.locate-button{top:14px;right:14px}.roof-info-section{padding:48px 18px 68px}.roof-area-field{font-size:18px}}