/* Light-theme face tools. Scoped to the editor; never changes product materials. */
.surface-tools[hidden],.surface-badge[hidden],.surface-tools [hidden]{display:none!important}
.surface-tools{position:absolute;top:12px;right:12px;z-index:45;width:298px;max-width:calc(100% - 24px);max-height:calc(100% - 72px);overflow:auto;background:#fff;color:#13253c;border:1px solid #cbd9e9;border-radius:12px;box-shadow:0 8px 28px #152a4030;padding:14px;box-sizing:border-box;font:13px/1.5 system-ui,sans-serif;touch-action:pan-y;overscroll-behavior:contain}
.surface-tools header{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px}.surface-tools header button{min-width:36px;padding:4px;font-size:24px}
.surface-tools p{margin:9px 0;color:#4b6079}.surface-tools label{display:block;font-weight:650;margin:10px 0}.surface-tools input,.surface-tools select{display:block;width:100%;box-sizing:border-box;background:#fff!important;color:#13253c!important;border:1px solid #b8cce3!important;border-radius:7px;padding:10px;font:16px/1.2 system-ui;margin-top:5px}
.surface-tools button,.surface-badge button{background:#f6f9ff;color:#123359;border:1px solid #b8cce3;border-radius:8px;padding:9px 12px;cursor:pointer;font:600 13px/1.3 system-ui;min-height:38px;touch-action:manipulation}.surface-tools button:hover,.surface-badge button:hover{background:#e7f2ff}.surface-tools .surface-primary{background:#087ce4;color:#fff;border-color:#087ce4}.surface-tools button:disabled{opacity:.5;cursor:wait}.surface-actions{display:flex;flex-wrap:wrap;gap:8px;position:sticky;bottom:-14px;background:white;padding:10px 0}.surface-tools .surface-note{font-size:12px;background:#eef6ff;padding:8px;border-radius:6px}.surface-tools .surface-progress.is-error{color:#a51e31}.surface-progress{font-size:12px}
.surface-badge{position:absolute;left:10px;bottom:10px;z-index:46;display:flex;align-items:center;gap:8px;background:#fff;color:#183153;border:1px solid #cbd9e9;border-radius:9px;padding:8px 10px;max-width:calc(100% - 20px);box-sizing:border-box;font:12px/1.35 system-ui;box-shadow:0 2px 10px #18315320;pointer-events:auto}.surface-badge span{max-width:460px}.surface-tools:not([hidden])~.surface-badge{right:324px}.editor-context-menu [data-context-action=extrude]{border-top:1px solid #d8e4f0}
@media(max-width:700px){.surface-tools{top:auto;bottom:8px;right:8px;width:calc(100% - 16px);max-width:none;max-height:49%;padding:12px}.surface-tools:not([hidden])~.surface-badge{display:none}.surface-badge{bottom:8px;left:8px;max-width:calc(100% - 16px);flex-wrap:wrap}.surface-badge span{flex-basis:100%;max-width:none}.surface-tools header{font-size:15px}.surface-tools input,.surface-tools select{font-size:16px}.surface-tools .surface-note{margin:5px 0}}

.editor-context-menu.is-compact-held .editor-context-title,.editor-context-menu.is-compact-held .editor-context-hint{display:none}
.editor-context-menu.is-compact-held .editor-context-actions{padding-top:0;gap:4px}
.editor-context-menu.is-compact-held button{min-height:46px;padding:4px 1px;gap:2px;font-size:11px}
.editor-context-menu.is-compact-held .editor-context-icon{width:18px;height:18px}
.editor-context-menu.is-mini-held .editor-context-actions{grid-template-columns:repeat(5,minmax(0,1fr))}
.editor-context-menu.is-mini-held button{font-size:10px;line-height:1.1;min-height:58px}

/* Direct face editing: the controls are attached to the cap, not an inspector.
   Only the control backgrounds are translucent; text and hit targets stay crisp. */
.face-grips[hidden],.face-grips [hidden]{display:none!important}
.face-grips{position:absolute;inset:0;z-index:42;pointer-events:none;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
.face-grips>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.face-grips-box{fill:none;stroke:#1475c3;stroke-width:1.4;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}
.face-grips-guide{fill:none;stroke:#496983;stroke-width:1.2;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
.face-grips-stem{fill:none;stroke:#0869b6;stroke-width:2.8;vector-effect:non-scaling-stroke}
.face-grip{position:absolute;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;margin:0!important;min-width:0!important;min-height:0!important;width:32px;height:32px;padding:0!important;border:0!important;border-radius:6px!important;background:transparent!important;box-shadow:none!important;cursor:grab;-webkit-tap-highlight-color:transparent}
.face-grip-size span{display:block;width:13px;height:13px;background:#fff;border:2px solid #125785;border-radius:2px;box-shadow:0 1px 4px #0b23494a;box-sizing:border-box}
.face-grip:hover span,.face-grip:focus-visible span,.face-grip.is-active span{background:#147fdf;border-color:#fff;outline:2px solid #0869b6}
.face-grip-extrude{width:40px;height:40px;z-index:2}
.face-grip-extrude svg{width:34px;height:34px;transform:rotate(var(--face-arrow-angle,0rad));fill:#0879d3;stroke:#fff;stroke-width:1.6;filter:drop-shadow(0 1px 2px #122b4160);pointer-events:none}
.face-grip-extrude:hover svg,.face-grip-extrude:focus-visible svg,.face-grip-extrude.is-active svg{fill:#f49022}
.face-grip:focus-visible{outline:2px solid #0879d3!important;outline-offset:2px}.face-grips.is-dragging .face-grip{cursor:grabbing}.face-grips.is-busy .face-grip{opacity:.45;cursor:wait;pointer-events:none}
.face-grips-readout{position:absolute;transform:translateX(-50%);white-space:nowrap;padding:5px 9px;border:1px solid #bfd4e8;border-radius:7px;background:rgba(250,253,255,.94);color:#153750;font:650 12px/1.3 system-ui,sans-serif;box-shadow:0 2px 7px #142f4520;pointer-events:none}
.surface-badge.is-direct{background:rgba(249,252,255,.92);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);gap:8px;align-items:center;right:auto;max-width:calc(100% - 20px)}
.surface-badge.is-direct span{max-width:430px}.surface-badge.is-direct button{background:#fff;white-space:nowrap}.surface-badge.is-direct button[data-surface-stop]{border-color:#1475c3;color:#075a99}
@media(pointer:coarse){.face-grip{width:46px;height:46px}.face-grip-size span{width:15px;height:15px}.face-grip-extrude{width:50px;height:50px}.face-grip-extrude svg{width:38px;height:38px}}
@media(max-width:700px){.surface-badge.is-direct{padding:6px 8px;flex-wrap:nowrap;font-size:11px;gap:6px}.surface-badge.is-direct span{flex-basis:auto;flex:1}.surface-badge.is-direct button{padding:6px 8px;min-height:36px;font-size:12px}.face-grips-readout{font-size:12px}}
