:root{--ink:#292d53;--accent:#7d4683;--muted:#8596a8;--line:#e3e4eb;--soft:#f2edf5;--separator-space:16px}*{box-sizing:border-box}body{margin:0;font:13px Poppins,Arial,sans-serif;color:var(--ink);background:#fafafd}button,input,select{font:inherit;color:inherit}button{cursor:pointer;background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 14px;transition:background .15s}button:hover{background:var(--soft)}button:disabled{opacity:.4;cursor:default}*:focus,*:focus-visible{outline:none;outline-offset:0}header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid var(--line);gap:20px;background:white}.brand{font-size:31px;letter-spacing:-2px;font-weight:600;color:var(--ink);text-decoration:none;line-height:1}.brand span{display:block;font-size:8px;letter-spacing:2px;margin-top:7px;color:var(--muted)}.view-switch{background:#eeeef3;padding:4px;border-radius:10px;display:flex;gap:3px}.view-switch button{border:0;background:transparent;color:var(--muted)}.view-switch .active{background:white;color:var(--accent);box-shadow:0 1px 5px #292d5310}.actions{display:flex;gap:6px;align-items:center}.actions button{padding:8px 10px}.actions i{height:24px;border-left:1px solid var(--line);margin:0 5px}nav{height:78px;display:flex;align-items:center;justify-content:center;gap:24px;background:#eeeef3;border-bottom:1px solid var(--line)}nav button{border:0;background:transparent;display:flex;text-align:left;gap:12px;align-items:center;padding:10px 18px;color:var(--muted)}nav button.active{background:#fff;color:var(--accent);box-shadow:0 2px 6px #292d5307}nav b{font-size:17px;font-weight:400;background:#e5e5ed;width:32px;height:32px;display:grid;place-items:center;border-radius:8px}nav .active b{background:var(--soft)}nav small{display:block;font-size:10px;color:var(--muted);margin-top:2px}main{display:flex;height:calc(100dvh - 156px);min-height:550px}aside{width:366px;flex-shrink:0;display:flex;flex-direction:column;background:#fff;border-right:1px solid var(--line);z-index:2}#panel{padding:26px 26px 18px;overflow:auto;flex:1}h2{font-size:21px;font-weight:500;letter-spacing:-.6px;margin:0 0 8px}h3{font-size:13px;font-weight:500;margin:25px 0 12px}p{color:var(--muted);line-height:1.8;margin:0 0 20px;font-size:12px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--accent)}.choices{display:grid;grid-template-columns:1fr 1fr;gap:9px}.choice{text-align:left;padding:13px 12px;min-height:74px}.choice.active{border-color:#ceb7d3;background:var(--soft);color:var(--accent)}.choice strong{display:block;font-size:12px;font-weight:500}.choice small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.shape-icon{display:block;font-size:26px;line-height:1.3;margin-bottom:7px}.field{display:block;margin:12px 0}.field>span{display:flex;justify-content:space-between;margin-bottom:6px;font-size:11px;color:var(--muted)}input[type=number],select{background:#fff;border:1px solid var(--line);border-radius:7px;width:100%;padding:9px 10px}input[type=range]{width:100%;accent-color:var(--accent)}.fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fields.three{grid-template-columns:repeat(3,1fr);gap:7px}.note{padding:12px;background:#f6f3f8;border:1px solid #eee8f1;border-radius:8px;color:var(--muted);font-size:10px;line-height:1.8;margin:17px 0}.point-list{display:flex;gap:5px;flex-wrap:wrap}.point-list button{padding:8px 12px}.active{color:var(--accent)}.point-list .active{background:var(--soft);border-color:#ceb7d3}.point-title{display:flex;align-items:center;justify-content:space-between;margin-top:20px}.point-title h3{margin:0}.danger{font-size:10px;color:#ab5b69;padding:6px 9px}.wide{width:100%;margin-top:12px}.swatches{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 9px}.swatches>.swatch{flex:0 0 calc((100% - 45px)/6)}.swatch{padding:4px;border-radius:50%;aspect-ratio:1;min-width:0}.swatch i{display:block;border-radius:50%;width:100%;height:100%;border:1px solid #292d5310}.swatch.active{border:2px solid var(--accent)}.color-name{font-size:11px;margin:12px 0;color:var(--muted)}footer{padding:17px 26px 22px;border-top:1px solid var(--line)}.footer-line{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.progress{height:3px;background:#eeeef3;margin:10px 0 16px;border-radius:3px}.progress i{display:block;background:var(--accent);height:100%;border-radius:3px}.primary{background:var(--accent);border-color:var(--accent);color:white;width:100%;font-weight:500}.primary:hover{background:#6c3972}#viewer{position:relative;flex:1;min-width:0;background:radial-gradient(ellipse at 50% 35%,#fafafd,#eeeef3);overflow:hidden}canvas{width:100%;height:100%;display:block;touch-action:none}.scene-heading{position:absolute;left:34px;top:30px;pointer-events:none}.scene-heading h1{font-size:27px;line-height:1.35;font-weight:500;letter-spacing:-.9px;margin:10px 0}.scene-heading p{font-size:10px}.scene-badge{position:absolute;right:25px;top:30px;border:1px solid #e3e4eb;background:#ffffffb0;border-radius:20px;padding:8px 12px;font-size:10px;color:var(--muted)}.scene-badge span{display:inline-block;width:6px;height:6px;background:#7d9b87;border-radius:50%;margin-right:6px}.viewer-tools{position:absolute;right:22px;top:44%;display:grid;gap:8px}.viewer-tools button{width:38px;height:38px;padding:0;font-size:20px;color:var(--muted)}.bottom-tools{position:absolute;bottom:64px;left:25px;display:flex;gap:7px}.bottom-tools button{font-size:10px;background:#ffffffdf;padding:9px 12px}.bottom-tools .active{border-color:#d8c5df}.hint{position:absolute;bottom:24px;left:25px;font-size:9px;color:var(--muted);max-width:60%}.estimate{position:absolute;right:22px;bottom:22px;background:#ffffffed;border:1px solid var(--line);padding:18px 20px;border-radius:12px;display:flex;gap:22px;align-items:center;box-shadow:0 8px 30px #292d5306}.estimate span{display:block;font-size:9px;color:var(--muted)}.estimate strong{display:block;font-weight:500;font-size:25px;margin:4px 0}.estimate small{font-size:9px;color:var(--muted)}.estimate button{border:0;background:var(--soft);font-size:22px;color:var(--accent);padding:6px 12px}#labels{position:absolute;inset:0;pointer-events:none}.label{position:absolute;font-size:10px;background:#fffffff0;padding:4px 8px;border:1px solid #e1dbe5;border-radius:5px;transform:translate(-50%,-50%);white-space:nowrap;color:var(--accent)}.label.point{background:var(--accent);color:white;border:0;border-radius:50%;width:23px;height:23px;padding:4px 0;text-align:center}.cost-row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:0;font-size:11px}.cost-row.total{font-size:16px;font-weight:500;border-bottom:0;margin-top:10px}.metric{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0}.metric>div{background:#f8f7fa;border-radius:8px;padding:14px}.metric strong{display:block;font-size:19px;font-weight:500}.metric small{font-size:10px;color:var(--muted)}#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:12px 20px;border-radius:9px;z-index:20;display:none;font-size:12px}#error{position:absolute;inset:35% 10% auto;background:white;padding:24px;border-radius:10px;color:#ab5b69}.material-option{width:100%;margin-bottom:9px;min-height:70px}.rate-source{font-size:10px;color:var(--muted);line-height:1.7}.rate-source a{color:var(--accent)}@media(min-width:1500px){aside{width:400px}#panel{padding:32px}.scene-heading{left:45px;top:40px}.scene-heading h1{font-size:34px}}@media(max-width:1050px){header{padding:0 16px}.actions button{font-size:10px}.view-switch button{font-size:10px}aside{width:320px}nav{gap:4px}nav button{padding:10px}nav small{display:none}.scene-heading h1{font-size:23px}.estimate{padding:12px;gap:10px}.hint{max-width:45%}.bottom-tools{bottom:135px;left:15px}}@media(max-width:700px){header{height:65px;flex-wrap:wrap;gap:7px}.brand{font-size:25px}.brand span{font-size:6px}.view-switch{display:none}.actions{gap:2px}.actions button{padding:7px}.actions i{display:none}nav{height:60px;gap:0;justify-content:space-around}nav button{padding:7px;gap:5px;font-size:9px}nav b{width:24px;height:24px;font-size:12px}main{height:auto;min-height:0;flex-direction:column-reverse}#viewer{height:55dvh;min-height:370px;flex:auto}aside{width:100%;border-right:0}#panel{max-height:none;padding:24px}footer{padding:16px 24px}.scene-heading{left:16px;top:16px}.scene-heading h1{font-size:18px}.scene-heading p{display:none}.scene-heading .eyebrow{font-size:8px}.scene-badge{right:12px;top:16px;font-size:8px}.bottom-tools{bottom:18px;left:12px;gap:4px}.bottom-tools button{font-size:8px;padding:8px}.estimate{bottom:60px;right:12px;padding:10px}.estimate strong{font-size:19px}.hint{display:none}.viewer-tools{right:12px;top:34%}.viewer-tools button{width:30px;height:30px;font-size:16px}.choices{grid-template-columns:repeat(3,1fr)}.material-option{display:block}.label{font-size:9px}}

/* Outline icon system shared with the wardrobe configurator. */
.icon{width:19px;height:19px;display:block;flex:none;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
[data-icon]{display:inline-flex;align-items:center;justify-content:center;flex:none}
.actions button,.view-switch button,.bottom-tools button,.viewer-tools button,.estimate button,.primary,.danger,.wide{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.actions button{min-height:36px;color:var(--muted)}
.actions button:hover,.viewer-tools button:hover{color:var(--accent)}
.actions .icon{width:18px;height:18px}
.view-switch .icon{width:19px;height:19px}
.viewer-tools .icon{width:20px;height:20px}
.bottom-tools .icon{width:17px;height:17px}
.estimate button{width:40px;height:40px;padding:0}
.estimate button .icon{width:20px;height:20px}
.primary .icon{width:18px;height:18px}
.shape-icon{display:flex;align-items:center;height:32px;margin-bottom:11px;color:var(--muted)}
.shape-icon .icon{width:28px;height:28px;stroke-width:1.5}
.choice.active .shape-icon{color:var(--accent)}
nav b{background:transparent;color:var(--muted)}
nav b .icon{width:23px;height:23px}
nav .active b{background:var(--soft);color:var(--accent)}
.danger .icon{width:14px;height:14px}
.wide .icon{width:16px;height:16px}
.cost-row>span:first-child{display:inline-flex;align-items:center;gap:7px}
.cost-row .icon{width:13px;height:13px;color:var(--muted)}
.rate-source a{display:inline-flex;align-items:center;gap:6px}
.rate-source .icon{width:14px;height:14px}
@media(max-width:1050px){.actions button{gap:5px}.actions .icon{width:16px;height:16px}}
@media(max-width:700px){.actions .action-label{display:none}.actions button{min-width:30px;min-height:32px}.bottom-tools button{gap:5px}.bottom-tools .icon{width:15px;height:15px}nav b .icon{width:19px;height:19px}.shape-icon .icon{width:25px;height:25px}}

header{justify-content:flex-start}
header .actions{margin-left:auto}
header .view-switch{margin-left:0}

#pointControls{position:absolute;inset:0;pointer-events:none}
.add-anchor{position:absolute;width:28px;height:28px;padding:0;display:grid;place-items:center;pointer-events:auto;transform:translate(-50%,calc(-50% - 32px));border:1px solid #d8c5df;border-radius:50%;background:#fff;color:var(--accent);box-shadow:0 2px 8px #292d5312}
.add-anchor:hover{background:var(--soft);border-color:var(--accent)}
.add-anchor .icon{width:16px;height:16px}
@media(pointer:coarse){.add-anchor{width:36px;height:36px}}

.mount-switch{position:absolute;top:22px;left:25px;z-index:2;display:flex;gap:4px;padding:4px;background:#eeeef3ed;border:1px solid var(--line);border-radius:10px;box-shadow:0 2px 8px #292d5305}
.mount-switch button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 13px;border:0;background:transparent;color:var(--muted);font-size:11px}
.mount-switch button.active{background:#fff;color:var(--accent);box-shadow:0 1px 5px #292d5310}
.mount-switch .icon{width:19px;height:19px}
@media(max-width:700px){.mount-switch{top:12px;left:12px}.mount-switch button{font-size:10px;padding:8px 10px;gap:6px}.mount-switch .icon{width:17px;height:17px}}

.point-list{gap:12px;row-gap:16px;padding-right:8px}
.point-chip{position:relative;display:inline-flex}
.point-chip>button:first-child{min-width:36px;height:38px;padding:8px 10px}
.point-insert{position:absolute;right:-9px;top:-9px;width:23px;height:23px;padding:0;display:grid;place-items:center;border-radius:50%;border:1px solid #d8c5df;background:white;color:var(--accent);box-shadow:0 2px 6px #292d5312;opacity:0;transform:scale(.7);pointer-events:none;transition:opacity .15s,transform .15s;z-index:2}
.point-insert .icon{width:13px;height:13px}
.point-chip:hover .point-insert,.point-chip:focus-within .point-insert,.point-marker:hover .point-insert,.point-marker:focus-within .point-insert{opacity:1;transform:scale(1);pointer-events:auto}
.point-insert:hover{background:var(--soft);border-color:var(--accent)}
.point-marker{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;width:25px;height:25px}
.point-marker::before{content:"";position:absolute;inset:-10px}
.point-handle{position:relative;display:grid;place-items:center;width:25px;height:25px;padding:0;border:1px solid #ffffff80;border-radius:50%;background:var(--accent);color:white;font-size:10px;cursor:grab;box-shadow:0 1px 5px #292d531a;touch-action:none}
.point-handle:hover{background:#6d3d73}
.point-marker .point-insert{right:-13px;top:-13px}
@media(hover:none),(pointer:coarse){.point-insert{opacity:1;transform:scale(1);pointer-events:auto;width:26px;height:26px}.point-list{gap:18px;row-gap:20px}}

/* Command bar and step navigation match the wardrobe reference. */
header{height:63px;min-height:63px;padding:5px 22px;gap:14px;background:#eeeef3;border:1px solid #dedee7;box-shadow:inset 0 1px 3px #292d5310}
.workspace-switch{display:flex;align-items:center;gap:2px;padding:3px;border-radius:10px;background:#e2e2eb}
.workspace-switch button{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:43px;padding:9px 16px;border:0;background:transparent;color:var(--muted);font-size:13px;white-space:nowrap}
.workspace-switch button.active{background:#fff;color:var(--accent);box-shadow:0 1px 5px #292d5310}
header .view-switch{padding:0 0 0 14px;gap:3px;background:none;border-left:1px solid #dedee7;border-radius:0}
header .view-switch button{display:grid;place-items:center;width:42px;height:43px;padding:9px;border:1px solid transparent;border-radius:9px;background:transparent}
header .view-switch button.active{background:#f8f5fa;border-color:#d8c5df;box-shadow:none}
header .actions{gap:8px}
header .actions button{display:grid;place-items:center;width:42px;height:42px;min-height:0;padding:10px;border:0;background:transparent;border-radius:9px;color:var(--muted)}
header .actions #redo{margin-right:10px}
header .actions i{height:40px;margin:0 5px 0 0;border-color:#dedee7}
header .actions #reset{order:1}header .actions #save{order:2}header .actions #load{order:3}header .actions #capture{order:4;background:var(--accent);color:white}
header button:hover:not(:disabled){background:var(--soft);color:var(--accent)}
header .actions #capture:hover{background:#6d3d73;color:white}
header .icon,header .actions .icon,header .view-switch .icon{width:21px;height:21px;stroke-width:1.65}
#steps{height:79px;padding:7px 24px;gap:16px;background:#fff;border:0;border-bottom:1px solid var(--line);justify-content:stretch}
#steps button{flex:1;gap:12px;padding:10px 12px;font-size:14px;font-weight:400;color:var(--muted);border-radius:9px;min-width:0}
#steps button.active{background:#f4eef6;color:var(--accent);box-shadow:none}
#steps b,#steps .active b{width:42px;height:42px;background:none;border:0;color:inherit;flex-shrink:0}
#steps b .icon{width:32px;height:32px;stroke-width:1.5}
#steps button span small{display:block;margin-top:2px;font-size:12px;color:var(--muted);font-weight:400}
main{height:calc(100dvh - 142px);min-height:0}
.preview-only aside{display:none}
.ui-tooltip{position:fixed;z-index:200;max-width:min(270px,calc(100vw - 16px));padding:10px 13px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);box-shadow:0 5px 20px #292d531a;font:12px/1.5 Poppins,Arial,sans-serif;pointer-events:none;text-align:left}
.ui-tooltip strong{display:block;font-size:12px;font-weight:500}
.ui-tooltip span{display:block;font-size:10px;color:var(--muted);margin-top:4px}
[hidden]{display:none!important}
@media(max-width:900px){header{padding:5px 14px;gap:9px}header .actions{gap:3px}header .actions button{width:36px}.workspace-switch button{padding:9px 12px}#steps{gap:6px;padding:7px 12px}#steps button{gap:7px;padding:8px}#steps b{width:32px}#steps b .icon{width:27px;height:27px}#steps button span small{font-size:10px}}
@media(max-width:700px){header{height:auto;min-height:63px;flex-wrap:nowrap;padding:6px 10px;gap:6px}.workspace-switch button{height:38px;padding:7px 9px;font-size:12px}header .view-switch{display:flex;padding-left:6px}header .view-switch button{width:30px;height:36px;padding:5px}header .actions{gap:1px}header .actions button{width:29px;height:36px;padding:6px}header .actions #redo{margin-right:0}header .actions i{height:30px;margin:0 2px}header .icon,header .actions .icon,header .view-switch .icon{width:19px;height:19px}#steps{height:69px;padding:5px 8px;gap:3px}#steps button{font-size:10px;padding:7px 5px;gap:5px}#steps b,#steps .active b{width:24px;height:30px}#steps b .icon{width:23px;height:23px}#steps button span small{display:none}main{height:auto}.preview-only #viewer{height:calc(100dvh - 132px);min-height:410px}}
@media(max-width:480px){.workspace-switch button>span:last-child{display:none}.workspace-switch button{width:32px;padding:6px}header{gap:4px}header .actions button{width:27px}header .view-switch button{width:27px}}

/* Keep contextual add buttons circular despite general point-list button styles. */
.point-chip>.point-insert,.point-marker>.point-insert{display:flex;align-items:center;justify-content:center;width:24px;height:24px;min-width:24px;min-height:24px;max-width:24px;max-height:24px;aspect-ratio:1;padding:0;line-height:1;border-radius:50%;box-sizing:border-box;flex:0 0 24px}
.point-chip>.point-insert .icon,.point-marker>.point-insert .icon{display:block;width:14px;height:14px;margin:0;flex:none}
@media(hover:none),(pointer:coarse){.point-chip>.point-insert,.point-marker>.point-insert{width:28px;height:28px;min-width:28px;min-height:28px;max-width:28px;max-height:28px;flex-basis:28px}}

#customColor{display:block;width:48px;height:48px;min-width:48px;min-height:48px;aspect-ratio:1;padding:4px;border:1px solid var(--line);border-radius:50%;background:#fff;cursor:pointer;overflow:hidden;appearance:none;-webkit-appearance:none}
#customColor::-webkit-color-swatch-wrapper{padding:0;border-radius:50%}
#customColor::-webkit-color-swatch{border:1px solid #292d5310;border-radius:50%}
#customColor::-moz-color-swatch{border:1px solid #292d5310;border-radius:50%}
#customColor:hover{border-color:var(--accent)}


#removePoint{display:grid;place-items:center;width:34px;height:34px;min-width:34px;padding:0;border:1px solid #eddfe4;border-radius:9px;background:#fbf6f8;color:#a86b7c;transition:background .15s,border-color .15s,color .15s}
#removePoint .icon{width:17px;height:17px;stroke-width:1.65}
#removePoint:hover:not(:disabled){background:#f6e8ed;border-color:#dab5c1;color:#93485f}
#removePoint:disabled{opacity:.35}

/* Keep select chevrons equally inset on the top, right and bottom. */
select{--select-arrow-inset:15px;appearance:none;-webkit-appearance:none;min-height:42px;padding:9px 42px 9px 12px;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23292d53' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:12px 12px;background-position:right var(--select-arrow-inset) center}

.material-option{display:flex;align-items:flex-start;gap:12px;padding:16px;margin-bottom:11px;min-height:112px;border-radius:10px}
.material-symbol{display:grid;place-items:center;width:40px;height:40px;flex:none;border:1px solid var(--line);border-radius:10px;background:#f8f8fb;color:var(--muted)}
.material-symbol .icon{width:30px;height:30px;stroke-width:1.5}
.material-option.active .material-symbol{background:#fff;border-color:#e1d1e6;color:var(--accent)}
.material-content{flex:1;min-width:0;display:block}
.material-option .material-content>strong{font-size:14px;line-height:1.5;font-weight:500;letter-spacing:-.2px;display:flex;align-items:center;gap:8px}
.material-benefit{display:block;margin-top:4px;color:var(--muted);font-size:11px;line-height:1.6}
.material-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px;margin-top:10px;font-size:14px;line-height:1.5;font-weight:500;color:var(--ink)}
.material-option .material-price small{display:inline;margin:0;font-size:11px;font-weight:400;color:var(--muted)}
.material-info{display:inline-flex;flex:none;margin-top:0;color:var(--muted)}
.material-info .icon{width:15px;height:15px;stroke-width:1.5}
.material-option:hover .material-info{color:var(--accent)}
@media(max-width:700px){.material-option{display:flex}.material-benefit{font-size:12px}}

.ui-tooltip{font-size:14px;line-height:1.6;max-width:min(320px,calc(100vw - 16px));padding:12px 15px}
.ui-tooltip strong{font-size:14px;line-height:1.5;font-weight:500}
.ui-tooltip span{font-size:13px;line-height:1.65;color:#66788d;margin-top:5px}

.color-name{font-size:13px;line-height:1.6;color:#66788d;margin:14px 0}

.swatches>.custom-color-control{position:relative;display:grid;place-items:center;margin:0;padding:3px;border:1px solid var(--line);background:conic-gradient(#c97483,#d0ae6b,#91aa82,#7d9fbb,#aa83b8,#c97483);cursor:pointer}
.custom-color-edit{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#fff;color:var(--accent)}
.custom-color-edit .icon{display:block;width:20px;height:20px;margin:0;flex:none}
.custom-color-control #customColor{position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;opacity:0;border:0;padding:0;border-radius:50%;cursor:pointer}
.swatches>.custom-color-control.active,.swatches>.custom-color-control:focus-within{border-color:var(--accent)}
.swatches>.custom-color-control:hover{border-color:var(--accent)}

.field>.scrub-label{cursor:ew-resize;touch-action:none;user-select:none;align-items:center;gap:5px}
.scrub-name{display:inline-flex;align-items:center;gap:5px}
.scrub-name .icon{width:12px;height:15px;color:#a8afbd;stroke-width:1.5;flex:none}
.field>.scrub-label:hover,.field>.scrub-label:hover .icon{color:var(--accent)}
.is-scrubbing,.is-scrubbing *{cursor:ew-resize!important;user-select:none!important}
.field>.input-with-unit{position:relative;display:block;margin:0;font-size:13px;line-height:normal;color:var(--ink)}
.input-with-unit input[type=number]{position:relative;padding-right:calc(var(--unit-width) + 42px)}
.input-with-unit input::-webkit-inner-spin-button{position:absolute;right:8px;top:9px;bottom:9px;margin:0}
.input-unit{position:absolute;right:32px;top:50%;transform:translateY(-50%);color:#718197;font-size:13px;line-height:1;white-space:nowrap;pointer-events:none;font-style:normal}
.scrub-name{white-space:nowrap;gap:3px}
.scrub-name .icon{width:9px;height:13px}
.fields.three .scrub-label{min-height:22px;font-size:10px;gap:2px}
.fields.three .scrub-label em{font-size:10px}

.point-title{justify-content:flex-start;gap:12px}
#removePoint{width:30px;height:30px;min-width:30px;background:#c95161;border-color:#c95161;color:#fff;border-radius:8px}
#removePoint:hover:not(:disabled){background:#b44252;border-color:#b44252;color:#fff}
#removePoint .icon{width:16px;height:16px}

/* Readable typography throughout the configurator. */
:root{--text-small:13px;--text-label:13px}
.field>span,.custom-color-field>span{font-size:var(--text-label);line-height:1.6;color:#718197}
.choice strong{font-size:14px;line-height:1.5}
.choice small,.material-benefit,.material-option .material-price small,.metric small,.rate-source,.footer-line{font-size:var(--text-small);line-height:1.6}
.cost-row{font-size:14px;line-height:1.6}
h3{font-size:14px;line-height:1.5}
#panel>p{font-size:13px;line-height:1.7}
#steps button span small{font-size:13px;line-height:1.5}
.fields.three{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.fields.three .input-with-unit input[type=number]{padding-left:8px;padding-right:calc(var(--unit-width) + 30px)}
.fields.three .input-unit{right:22px}
@media(min-width:701px) and (max-width:1050px),(max-width:360px){.fields.three{grid-template-columns:repeat(2,minmax(0,1fr))}.fields.three .field:last-child{grid-column:1/-1}}
.fields.three .scrub-label,.fields.three .scrub-label em{font-size:13px;line-height:1.6;min-height:22px}
.scrub-name .icon{width:11px;height:15px}
.fields.three .field{margin:9px 0}
.label{font-size:13px;line-height:1.4;padding:5px 8px}
.point-handle{font-size:13px;width:28px;height:28px}
.point-marker{width:28px;height:28px}
#toast{font-size:13px;line-height:1.6}
@media(max-width:900px){#steps button span small{font-size:13px}}
@media(max-width:700px){#steps button{font-size:13px}.workspace-switch button{font-size:13px}.label{font-size:13px}.choices{grid-template-columns:repeat(2,minmax(0,1fr))}.material-benefit{font-size:13px}}
@media(max-width:380px){#steps button{flex-direction:column;gap:2px;padding:4px}#steps{height:78px}.preview-only #viewer{height:calc(100dvh - 141px)}}

.point-marker>.point-delete{background:#c95161;border-color:#c95161;color:#fff}
.point-marker>.point-delete:hover{background:#b44252;border-color:#b44252;color:#fff}
.point-marker>.point-delete .icon{width:13px;height:13px}

#removePoint{width:36px;height:36px;min-width:36px;border-radius:9px;background:#c44758;border-color:#c44758;box-shadow:0 2px 5px #9a304115}
#removePoint .icon{width:21px;height:21px;stroke-width:1.8}
.point-marker>.point-delete .icon{width:16px;height:16px;stroke-width:1.8}

.solar-settings{border-top:1px solid var(--line);margin-top:25px;padding-top:2px}
.solar-settings h3{display:flex;align-items:center;gap:8px}
.solar-settings h3 .icon{width:19px;height:19px;color:var(--accent)}
.solar-reference{font-size:13px;line-height:1.65;color:#718197;margin:8px 0 0}
.compass-widget{position:absolute;top:20px;right:20px;z-index:2;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}
#compass{width:82px;height:82px;border-radius:50%;border:1px solid #dddde6;background:#ffffffed;position:relative;box-shadow:0 2px 10px #292d5307}
#compass span{position:absolute;top:50%;left:50%;font-size:12px;line-height:1;font-weight:500;color:#718197}
#compass [data-direction=N]{color:#b9485a;font-weight:600}
#compass i{position:absolute;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%);border-radius:50%;border:1px solid #d8c5df;background:#f2edf5}
#sunTime{font-size:13px;color:#66788d;background:#fffffff0;border:1px solid var(--line);border-radius:6px;padding:3px 8px}
@media(max-width:700px){.compass-widget{top:12px;right:12px}#compass{width:76px;height:76px}}
#compass span{font-size:13px}

.project-overview{margin:0 0 20px}
.overview-row{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:12px;row-gap:3px;padding:13px 12px;border:0;border-radius:0}
.overview-row+.overview-row{border-top:1px solid var(--line)}
.overview-icon{grid-row:1/3;display:flex;align-items:center;justify-content:center;color:var(--accent)}
.overview-icon .icon{width:24px;height:24px;stroke-width:1.65}
.overview-row dt{font-size:13px;line-height:1.5;color:#718197}
.overview-row dd{margin:0;font-size:14px;line-height:1.55;font-weight:500;color:var(--ink)}

.summary-panel .cost-row{font-size:13px}
.summary-panel .cost-row.total{font-size:16px}

aside>footer{position:relative;z-index:3;flex-shrink:0;background:#fff;transition:box-shadow .18s}
aside>footer::before{content:"";position:absolute;left:0;right:0;top:-32px;height:32px;background:linear-gradient(to bottom,rgba(41,45,83,0),rgba(41,45,83,.025) 35%,rgba(41,45,83,.16));pointer-events:none;opacity:0;transition:opacity .18s}
aside.has-scroll>footer{box-shadow:0 -5px 12px -3px rgba(41,45,83,.2)}
aside.has-scroll>footer::before{opacity:1}
aside.has-scroll #panel{scroll-padding-bottom:32px}

.summary-panel .metric{grid-template-columns:1fr}

.summary-panel .cost-row.total{color:var(--accent);background:var(--soft);border-radius:9px;padding:14px 12px;font-weight:500}
.summary-panel .cost-row.total>span:last-child{font-weight:600}


aside{position:relative}
.progress i{transition:width .4s cubic-bezier(.2,.7,.25,1)}
#steps button,#steps button b{transition:none}
@media(prefers-reduced-motion:reduce){.progress i{transition:none}}

.overview-row{position:relative;transition:background .18s}
.overview-edit{border:0;background:transparent;padding:0 40px 0 0;text-align:left;font-size:14px;font-weight:500;line-height:1.55;border-radius:5px}
.overview-edit::after{content:"";position:absolute;inset:0;cursor:pointer}
.overview-edit-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:32px;height:32px;color:var(--accent)}
.overview-edit-icon .icon{width:21px;height:21px;stroke-width:1.65}
header .workspace-switch [data-icon="edit"] .icon{width:21px;height:21px;stroke-width:1.65}
.overview-row:has(.overview-edit:hover),.overview-row:has(.overview-edit:focus-visible){background:#f6f2f8}
.overview-edit:hover{color:var(--accent);background:transparent}
.summary-edit{width:100%;border:0;border-radius:0;padding:11px 12px;background:transparent;text-align:left;font-weight:400;cursor:pointer;transition:background .18s,color .18s}
.cost-row+.cost-row{border-top:1px solid var(--line)}
.summary-edit>b{flex-shrink:0;white-space:nowrap;font-weight:400}
.summary-edit:hover,.summary-edit:focus-visible{background:#f6f2f8;color:var(--accent)}
.metric-edit{border:0;border-radius:8px;background:#f8f7fa;padding:14px;text-align:left;cursor:pointer}
.metric-edit:hover,.metric-edit:focus-visible{background:var(--soft);color:var(--accent)}

/* Terrace controls reuse the wardrobe dimension handles and section hierarchy. */
.terrace-settings{margin-top:25px;border-top:1px solid var(--line);border-bottom:0;padding-bottom:4px}
.terrace-settings summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer;font-size:16px;font-weight:500;padding:16px 0;color:var(--ink)}
.terrace-settings summary::-webkit-details-marker{display:none}
.terrace-settings summary .icon{width:18px;height:18px;color:var(--muted);transform:rotate(-90deg)}
.terrace-settings[open] summary .icon{transform:none}
.terrace-settings .fields .field{margin-top:0}
#terraceOptions .terrace-fields{grid-template-columns:repeat(3,minmax(0,1fr))}
#terraceOptions .terrace-fields>.field:last-child{grid-column:auto}

#terraceControls{position:absolute;inset:0;pointer-events:none;z-index:2}
#terraceControls[hidden],#terraceControls [hidden]{display:none}
#terraceControls .dimension-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:#fff;stroke:#9b7da3;stroke-width:1.2;stroke-dasharray:4 3;pointer-events:none}
#terraceControls .dimension-lines circle{stroke-dasharray:none}
.dimension-handle{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;display:flex;align-items:center;gap:9px;padding:9px 12px;min-width:121px;border:1px solid #cbb7d2;border-radius:9px;background:#fffffff5;box-shadow:0 4px 18px #29354518;cursor:grab;touch-action:none;user-select:none;text-align:left}
.dimension-handle>svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.dimension-handle[data-resize=height]>svg{transform:rotate(90deg)}
.dimension-handle[data-resize=depth]>svg{transform:rotate(-35deg)}
.dimension-handle>span{display:grid;gap:2px}
.dimension-handle small{font-size:12px;color:#718197}
.dimension-handle strong{font-size:15px;font-weight:500;white-space:nowrap}
.dimension-handle:hover,.dimension-handle:focus-visible{border-color:#9c71a4;background:#f8f5fa}
.dimension-handle.resizing{cursor:grabbing;background:var(--accent);border-color:var(--accent);color:#fff}
.dimension-handle.resizing small{color:#f0e7f3}
@media(max-width:700px){.dimension-handle{min-width:108px;padding:7px 9px;gap:6px}.dimension-handle strong{font-size:14px}}

/* Quote inclusion switches reuse the wardrobe toggle track and thumb. */
.quote-row{display:flex;align-items:center;gap:10px;padding:0 12px;transition:background .15s}
.quote-row+.quote-row{border-top:1px solid var(--line)}
.quote-row:hover,.quote-row:focus-within{background:#f6f2f8}
.quote-row .quote-edit{flex:1;min-width:0;width:auto;border:0;padding:13px 0;align-items:center;gap:10px;min-height:54px}
.quote-row .quote-edit:hover,.quote-row .quote-edit:focus-visible{background:transparent}
.quote-row .quote-edit>.quote-content{display:block;line-height:1.6}
.quote-status{display:block;margin-top:2px;font-size:12px;color:var(--muted)}
.quote-quantity{white-space:nowrap}
.quote-row.is-excluded .quote-content{color:#718197}
.quote-row.is-excluded .quote-amount{color:var(--muted);text-decoration:line-through}
.quote-toggle{position:relative;display:flex;align-items:center;justify-content:center;width:46px;height:44px;flex:none;cursor:pointer}
.quote-toggle input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer;z-index:1}
.quote-toggle .toggle-track{position:relative;width:46px;height:27px;flex-shrink:0;border:1px solid #cbd5e0;border-radius:999px;background:#dde4ed;transition:background .2s,border-color .2s}
.quote-toggle .toggle-track::after{content:"";position:absolute;width:21px;height:21px;left:2px;top:2px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #203b5b25;transition:transform .2s}
.quote-toggle input:checked+.toggle-track{background:var(--accent);border-color:var(--accent)}
.quote-toggle input:checked+.toggle-track::after{transform:translateX(19px)}
.quote-toggle input:focus-visible+.toggle-track{border-color:var(--ink)}
@media(prefers-reduced-motion:reduce){.quote-row,.quote-toggle .toggle-track,.quote-toggle .toggle-track::after{transition:none}}

/* Diagonal controls adapt the existing terrace and wardrobe disclosure components. */
.diagonal-settings{margin-top:25px;border-top:1px solid var(--line);border-bottom:0;padding-bottom:4px}
.diagonal-settings summary{display:flex;align-items:center;justify-content:space-between;gap:10px;list-style:none;cursor:pointer;font-size:16px;font-weight:500;padding:16px 0;color:var(--ink)}
.diagonal-settings summary::-webkit-details-marker{display:none}
.section-heading-tools{display:inline-flex;align-items:center;gap:8px}
.diagonal-help{display:grid;place-items:center;width:26px;height:26px;border:0;padding:0;background:transparent;color:var(--muted)}
.diagonal-help .icon{width:16px;height:16px}
.diagonal-chevron{width:18px;height:18px;color:var(--muted);transform:rotate(-90deg)}
.diagonal-settings[open]>summary .diagonal-chevron{transform:none}
.diagonal-fields .field{margin-top:0;margin-bottom:12px}
.diagonal-dimension.active input{border-color:#cbb7d2;background:#fcfaff}
.diagonal-dimension input[aria-invalid="true"]{border-color:#c95161;background:#fffafb}

.diagonal-summary{border-bottom:0}
.diagonal-summary>summary{font-size:14px;padding-bottom:12px}
.diagonal-label{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;display:flex;align-items:center;gap:8px;padding:6px 9px;font-size:12px;white-space:nowrap;line-height:1.5;border:1px solid var(--line);border-radius:7px;background:#ffffffed;color:#718197;box-shadow:0 2px 8px #292d530d}
.diagonal-label.structural{color:var(--accent);border-color:#d6c4dd}
.diagonal-label.active,.diagonal-label:hover,.diagonal-label:focus-visible{border-color:#cbb7d2;color:var(--accent);background:#fcfaff}
.diagonal-label>span:first-child{font-weight:500}
@media(max-width:700px){.diagonal-label{font-size:12px;padding:5px 8px;gap:6px}}

/* Catalog selection reuses the wardrobe disclosure, fields and quote switches. */
.hardware-settings{margin-top:25px;border-top:1px solid var(--line);border-bottom:0;padding-bottom:4px}
.hardware-settings>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer;font-size:16px;font-weight:500;padding:16px 0;color:var(--ink)}
.hardware-settings>summary::-webkit-details-marker{display:none}
.hardware-chevron{width:18px;height:18px;color:var(--muted);transform:rotate(-90deg)}
.hardware-settings[open]>summary .hardware-chevron{transform:none}
.hardware-note{font-size:12px;line-height:1.65;color:#718197;margin:6px 0 18px}
.hardware-add,.hardware-empty-action{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:42px;padding:9px 12px;border:1px solid #cbb7d2;background:#fcfaff;color:var(--accent);border-radius:8px;font-size:13px;font-weight:400}
.hardware-add:hover,.hardware-empty-action:hover{background:var(--soft)}
.hardware-add .icon,.hardware-empty-action .icon{width:19px;height:19px}

.hardware-add:disabled{cursor:not-allowed;opacity:.5}
.point-mast-settings{margin-top:22px}
.point-mast-settings .field{margin-top:16px}
.point-mast-settings .field:has(#pointConnectionGap)>.input-with-unit{width:50%}
#mastControls{position:absolute;inset:0;pointer-events:none;z-index:3}
#mastControls[hidden]{display:none}
.mast-control{width:124px;min-width:0;height:54px;padding:8px 10px;gap:8px}
.mast-control>svg{width:22px;height:22px}
.mast-control strong{font-size:14px;font-weight:400}
.mast-control small{font-size:12px}
.mast-control[data-mast-angle]{cursor:pointer;touch-action:manipulation}
.mast-control[aria-pressed=true]{border-color:var(--accent);background:var(--soft);color:var(--accent)}
.mast-control[aria-pressed=true] small{color:var(--accent)}
.mast-guide{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:var(--accent);stroke-width:2;pointer-events:none}
.mast-guide[hidden],.mast-gizmo-handle[hidden]{display:none}
.mast-guide-track{stroke-width:2.5;stroke-linecap:round;filter:drop-shadow(0 1px 1px #fff)}
.mast-guide-spoke{stroke-width:1.3;stroke-dasharray:4 4;opacity:.75}
.mast-guide-leader{stroke-width:1.3;stroke-dasharray:3 3;opacity:.75}
.mast-control.mast-gizmo-handle{width:max-content;min-width:0;height:38px;padding:8px 10px;gap:7px;justify-content:center;border-color:var(--accent);color:var(--accent)}
.mast-control.mast-gizmo-handle.resizing{color:#fff}
.mast-gizmo-handle>svg{display:block;flex:none;width:20px;height:20px}
.mast-gizmo-handle strong{display:block;margin:0;font-size:13px;line-height:1;font-weight:400}
.mast-gizmo-handle:focus-visible,.mast-control[data-mast-angle]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.installation-checks{display:grid;margin:14px 0}
.installation-check{display:flex;align-items:center;gap:10px;width:100%;padding:13px 4px;text-align:left;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:inherit;cursor:pointer}
.installation-check:last-child{border-bottom:0}
.installation-check:hover{background:var(--soft)}
.installation-check[aria-disabled=true]{cursor:default}
.installation-check>span:nth-child(2){display:grid;flex:1;min-width:0;gap:3px;font-size:13px}
.installation-check strong{font-size:13px;font-weight:400;line-height:1.65}
.installation-check small{font-size:12px;color:#718197}
.installation-status{align-self:flex-start;display:flex;margin-top:3px;color:var(--accent)}
.installation-check.review .installation-status,.installation-check.review small{color:#a9533c}
.installation-check>.icon{width:16px;height:16px;flex:0 0 16px;color:#8596a8}
.installation-check .installation-status .icon{width:19px;height:19px}
.installation-settings .hardware-add{font-size:13px;font-weight:400}
.installation-settings .installation-length{margin-top:12px}
.installation-overview{display:flex;gap:8px;align-items:center;margin:18px 0}
.installation-overview>span{flex:1;display:grid;gap:4px;text-align:left}
.installation-overview small{font-size:12px;color:#718197}
#labels,#pointControls{z-index:4}
/* Shared disclosure structure and motion from the wardrobe finishing panel. */
#panel>.panel-section{margin:0;padding:0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent}
#panel>.panel-section>summary{display:flex;align-items:center;justify-content:flex-start;gap:9px;min-height:56px;padding:var(--separator-space) 0;font-size:16px;font-weight:500;line-height:1.5;color:var(--ink);cursor:pointer;list-style:none}
#panel>.panel-section:first-child>summary{min-height:40px;padding-top:0}
.panel-section>summary::-webkit-details-marker{display:none}
.panel-section>summary:after{content:"";width:7px;height:7px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(-45deg);margin-left:auto;margin-right:3px;flex-shrink:0;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.panel-section[data-section-expanded=true]>summary:after{transform:rotate(45deg)}
.panel-section>summary:hover,.panel-section.context-highlight>summary{color:var(--accent)}
#panel .context-highlight{box-shadow:none}
#panel :is(input,select).context-highlight{border-color:var(--accent)}
#panel :is(h3,button).context-highlight{color:var(--accent)}
.panel-section>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.panel-section>summary>.hardware-chevron,.panel-section>summary>.icon,.panel-section>summary .diagonal-chevron{display:none}
/* Include the heading line-box leading when matching the visible gap across a divider. */
.panel-section-body{display:flow-root;padding:0 0 calc(var(--separator-space) + 6px)}
.panel-section-body>.choices{margin-top:2px}
.panel-section-body .solar-settings{padding:0;margin:0;border:0}
.panel-section>summary .section-heading-tools{margin-left:0;flex:none}
.panel-section .point-title{margin-top:16px}
.panel-section-body>:first-child{margin-top:0}
.panel-section-body>:last-child{margin-bottom:0}
.panel-section-body :where(.fields,.solar-settings):last-child{margin-bottom:0}
.panel-section-body :where(.fields):last-child>.field{margin-bottom:0}
.panel-section-body>:last-child>:last-child{margin-bottom:0}
@media(prefers-reduced-motion:reduce){.panel-section>summary:after{transition:none}}
@media(max-width:700px){#steps{height:76px;gap:3px;padding:5px 8px}#steps button{flex-direction:column;justify-content:center;gap:3px;padding:4px 1px;font-size:11px;line-height:1.3}#steps b,#steps .active b{width:23px;height:23px}#steps b .icon{width:22px;height:22px}#steps button span small{display:none}}
.point-type-choices{grid-template-columns:repeat(2,minmax(0,1fr))}
.point-type-choices .choice{min-height:112px}
.point-type-choices .choice:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.dimension-toolbar{position:absolute;bottom:23px;left:50%;transform:translateX(-50%);display:flex;white-space:nowrap;padding:5px;background:#fffffff5;border:1px solid #dedee7;border-radius:10px;box-shadow:0 5px 22px #292d530d;z-index:10}
.dimension-toolbar>button{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;background:none;font-size:12px;font-weight:400;padding:10px 12px;color:var(--muted)}
.dimension-toolbar>button.active,.dimension-toolbar>button:hover{background:var(--soft);color:var(--accent)}
.dimension-toolbar .icon{width:19px;height:19px}
.dimension-options{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);display:flex;align-items:center;padding:6px;gap:6px;border:1px solid #e3dce8;border-radius:10px;background:#fff;box-shadow:0 4px 18px #292d5320}
.dimension-options[hidden]{display:none}
.dimension-options .measurement-tabs{display:flex;gap:6px}
.dimension-options .measurement-tabs button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;min-height:34px;padding:0;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--muted);box-shadow:none}
.dimension-options .measurement-tabs button:hover,.dimension-options .measurement-tabs button.active{background:var(--soft);border-color:#cbb7d2;color:var(--accent)}
.dimension-options .measurement-tabs .icon{display:block;width:19px;height:19px;margin:0}
.dimension-toolbar button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:700px){.dimension-toolbar{bottom:14px;max-width:calc(100% - 16px);padding:4px}.dimension-toolbar>button{font-size:12px;padding:10px 8px;gap:6px}.dimension-toolbar .icon{width:17px;height:17px}}

/* Direct edge resizing keeps the deck free of floating measurement cards. */
.terrace-edge-controls{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.terrace-edge{pointer-events:none;cursor:ew-resize;touch-action:none;outline:none}
.terrace-edge[data-resize=depth]{cursor:ns-resize}
.terrace-edge[data-resize=height]{cursor:ns-resize}
.terrace-edge-hit{fill:none;stroke:transparent;stroke-width:20;pointer-events:stroke}
.terrace-edge-glow{fill:none;stroke:var(--accent);stroke-width:3;opacity:0;pointer-events:none;stroke-linecap:round;filter:drop-shadow(0 0 3px #fff);transition:opacity .12s}
.terrace-edge:hover .terrace-edge-glow,.terrace-edge:focus-visible .terrace-edge-glow,.terrace-edge.resizing .terrace-edge-glow{opacity:.8}
.terrace-edge.resizing{cursor:grabbing}
.mast-control.mast-icon-control{width:38px;height:38px;min-width:38px;padding:8px;justify-content:center;gap:0}
.mast-icon-control>svg{width:22px;height:22px}

.terrace-height-hit{fill:transparent;stroke:none;pointer-events:fill}
.terrace-height-glow{fill:var(--accent);fill-opacity:.18;stroke:var(--accent);stroke-width:1.5;opacity:0;pointer-events:none;transition:opacity .12s}
.terrace-height-arrow{fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 2px #fff);opacity:0;pointer-events:none;transition:opacity .12s}
.terrace-height-face:hover .terrace-height-glow,.terrace-height-face:focus-visible .terrace-height-glow,.terrace-height-face.resizing .terrace-height-glow,.terrace-height-face:hover .terrace-height-arrow,.terrace-height-face:focus-visible .terrace-height-arrow,.terrace-height-face.resizing .terrace-height-arrow{opacity:1}

.bearing-control{margin:0 0 20px}
.bearing-label{display:block;font-size:13px;line-height:1.6;color:#718197;margin-bottom:10px}
.bearing-layout{display:grid;grid-template-columns:176px minmax(0,1fr);align-items:center;gap:16px}
.bearing-dial{width:176px;height:176px;cursor:grab;touch-action:none;user-select:none;border-radius:50%}
.bearing-dial.is-rotating{cursor:grabbing}
.bearing-dial:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.bearing-dial svg{display:block;width:100%;height:100%;overflow:visible}
.bearing-rim{fill:#faf9fc;stroke:var(--line);stroke-width:1.2}
.bearing-ticks{fill:none;stroke:#abb4c0;stroke-width:1;stroke-linecap:round}
.bearing-cardinals text{font:500 13px Poppins,Arial,sans-serif;text-anchor:middle;fill:#718197}
.bearing-cardinals text:first-child{fill:var(--accent)}
.bearing-rose{fill:#e9e4ed;stroke:#ddd5e3;stroke-width:.6}
.bearing-needle{fill:var(--accent)}
.bearing-tail{fill:#b7a1bd}
.bearing-grip{fill:#fff;stroke:var(--accent);stroke-width:2}
.bearing-center{fill:#fff;stroke:#cbb7d2;stroke-width:1.5}
.bearing-direction{display:block;font-size:14px;line-height:1.5;font-weight:500;color:var(--ink);min-height:42px}
.bearing-values .field{margin:12px 0 0}
.bearing-values .input-with-unit input[type=number]{padding-left:9px;padding-right:39px}
.bearing-values .input-unit{right:23px}
@media(min-width:701px) and (max-width:1050px),(max-width:360px){.bearing-layout{grid-template-columns:154px minmax(0,1fr);gap:12px}.bearing-dial{width:154px;height:154px}}

.point-mast-settings .mast-position-fields{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}
#pointMastOptions .mast-position-fields .field>.input-with-unit{width:100%}