.sph-prop-editor{--spe-line:rgb(255 255 255 / 5%);position:fixed;inset:0;z-index:2410;display:grid;place-items:center;padding:24px;background:#000a;color:#ededed;font-family:inherit;font-size:14px;line-height:1.5;isolation:isolate}
.sph-prop-editor *{box-sizing:border-box}
.sph-prop-entry{display:flex;flex-direction:column;gap:9px;padding-bottom:16px;border-bottom:1px solid #383838}
.sph-prop-entry>.sphu-btn{display:flex;align-items:center;gap:8px;min-height:38px;width:100%;text-align:left;white-space:normal}
#sph-prop-placements{display:flex;flex-direction:column;gap:5px;max-height:220px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#666 transparent}
#sph-prop-placements .sphu-btn{display:flex;align-items:center;gap:7px;min-height:35px;width:100%;flex:none}
#sph-prop-placements .sphu-btn span{flex:1;min-width:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#sph-prop-placements small{color:#aaa;font-size:12px;white-space:nowrap}
.sph-prop-editor [hidden]{display:none!important}
.sph-prop-editor .spe-workspace{position:relative;display:flex;flex-direction:column;width:min(1300px,100%);height:min(850px,calc(100dvh - 48px));min-height:0;border:1px solid var(--spe-line);border-radius:10px;background:#1e1e1e;box-shadow:0 24px 80px #0007;overflow:hidden}
.sph-prop-editor button,.sph-prop-editor input{font:inherit;font-size:14px;line-height:1.4;color:inherit;border:1px solid transparent;border-radius:6px;background:#272727;min-height:36px;box-shadow:none}
.sph-prop-editor button{padding:7px 12px;cursor:pointer}
.sph-prop-editor button:hover{background:#383838}
.sph-prop-editor button:disabled{opacity:.4;cursor:default}
.sph-prop-editor :focus-visible{outline:2px solid #c4c4c4;outline-offset:2px}
.sph-prop-editor input:focus{outline:2px solid #b5b5b5;outline-offset:1px;border-color:#aaa;box-shadow:none}
.sph-prop-editor input[aria-invalid=true]{border-color:#d3aaa1}
.sph-prop-editor h2,.sph-prop-editor h3,.sph-prop-editor p{margin:0;color:inherit}
.sph-prop-editor h2{font-size:20px;line-height:1.4;font-weight:600}
.sph-prop-editor h3{font-size:14px;font-weight:600}
.sph-prop-editor .spe-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid var(--spe-line);flex:none}
.sph-prop-editor .spe-header [data-library]{margin-left:auto;margin-right:10px;font-size:14px}
.sph-prop-editor .spe-layout{display:grid;grid-template-columns:195px minmax(230px,1fr) 290px;min-height:0;flex:1;overflow:hidden}
.sph-prop-editor .spe-library{display:flex;flex-direction:column;gap:12px;padding:20px 14px;border-right:1px solid var(--spe-line);overflow-y:auto;min-height:0}
.sph-prop-editor .spe-presets{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.sph-prop-editor .spe-presets button{padding:7px 4px}
.sph-prop-editor .spe-list-heading,.sph-prop-editor .spe-inspector-heading{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:8px}
.sph-prop-editor .spe-list-heading span,.sph-prop-editor .spe-inspector-heading span{color:#999;font-size:12px;font-variant-numeric:tabular-nums}
.sph-prop-editor .spe-block-list{display:flex;flex-direction:column;gap:4px;overflow-y:auto;min-height:60px;max-height:340px;flex:1;scrollbar-width:thin;scrollbar-color:#666 transparent}
.sph-prop-editor .spe-block-list button{text-align:left;flex:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:transparent;border-color:transparent}
.sph-prop-editor .spe-block-list button[aria-pressed=true]{background:#484848;color:#fff}
.sph-prop-editor .spe-stage{position:relative;min-width:0;min-height:300px;background:#202020;overflow:hidden}
.sph-prop-editor .spe-stage-title{position:absolute;top:22px;left:24px;right:24px;display:flex;flex-direction:column;gap:4px;pointer-events:none;z-index:1}
.sph-prop-editor .spe-stage-title strong{font-size:18px;overflow-wrap:anywhere}
.sph-prop-editor .spe-canvas{position:absolute;inset:80px 12px 90px;touch-action:none;cursor:grab}
.sph-prop-editor .spe-canvas:active{cursor:grabbing}
.sph-prop-editor .spe-canvas canvas{display:block;width:100%;height:100%}
.sph-prop-editor .spe-preview-message{position:absolute;top:45%;left:24px;right:24px;text-align:center;color:#aaa;pointer-events:none}
.sph-prop-editor .spe-view-tools{position:absolute;bottom:42px;left:12px;right:12px;display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.sph-prop-editor .spe-view-group,.sph-prop-editor .spe-history-group{display:flex;gap:4px;padding:4px;border-radius:8px;background:#1e1e1e}
.sph-prop-editor .spe-view-tools button{min-height:32px;padding:5px 10px;background:transparent}
.sph-prop-editor .spe-view-tools button:hover{background:#303030}
.sph-prop-editor .spe-view-tools button[aria-pressed=true]{background:#484848;color:#fff}
.sph-prop-editor .spe-history-group button{width:32px;padding:4px}
.sph-prop-editor .spe-stage-hint{position:absolute;bottom:14px;left:12px;right:12px;text-align:center;font-size:12px;color:#aaa}
.sph-prop-editor .spe-inspector{padding:20px;overflow-y:auto;min-height:0;border-left:1px solid var(--spe-line);scrollbar-width:thin;scrollbar-color:#666 transparent}
.sph-prop-editor .spe-field{display:flex;flex-direction:column;gap:7px;margin:0 0 18px}
.sph-prop-editor .spe-field>span{color:#c5c5c5}
.sph-prop-editor input{width:100%;min-width:0;padding:8px 9px;background:#272727;color:#ededed}
.sph-prop-editor .spe-inspector input[type=number],.sph-prop-editor .spe-inspector input[type=text],.sph-prop-editor .spe-inspector input:not([type]),.sph-prop-editor .spe-inspector input[type=color]{background:#272727;color:#ededed;border:1px solid transparent;box-shadow:none;color-scheme:dark}
.sph-prop-editor .spe-inspector input:focus{outline:2px solid #b5b5b5;outline-offset:1px;border-color:#aaa;box-shadow:none}
.sph-prop-editor input[type=color]{height:40px;padding:4px}
.sph-prop-editor .spe-divider{height:1px;background:var(--spe-line);margin:20px -20px}
.sph-prop-editor .spe-inspector-heading{margin-bottom:18px}
.sph-prop-editor fieldset{border:0;border-bottom:1px solid var(--spe-line);padding:0 0 18px;margin:0 0 18px;min-width:0}
.sph-prop-editor legend{padding:0;margin-bottom:9px;width:100%;display:flex;justify-content:space-between;color:#c5c5c5;font-size:14px}
.sph-prop-editor legend span{font-size:12px;color:#999}
.sph-prop-editor .spe-vector{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.sph-prop-editor .spe-vector label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#aaa}
.sph-prop-editor .spe-vector input{padding:8px 5px;font-size:14px;font-variant-numeric:tabular-nums}
.sph-prop-editor .spe-swatches{display:flex;gap:9px;margin:0 0 22px;flex-wrap:wrap}
.sph-prop-editor .spe-swatches button{width:26px;height:26px;min-height:26px;padding:0;border-radius:6px;background:var(--spe-color);border:1px solid rgb(255 255 255 / 15%)}
.sph-prop-editor .spe-swatches button[aria-pressed=true]{outline:2px solid #c4c4c4;outline-offset:2px}
.sph-prop-editor .spe-block-actions{display:flex;gap:8px}
.sph-prop-editor .spe-block-actions button{flex:1}
.sph-prop-editor .spe-note{font-size:12px;line-height:1.7;color:#a7a7a7;margin:12px 0}
.sph-prop-editor .spe-footer{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 20px;border-top:1px solid var(--spe-line);flex:none}
.sph-prop-editor .spe-footer p{font-size:12px}
.sph-prop-editor .spe-footer span{font-size:12px;color:#999}
.sph-prop-editor .spe-footer-actions{display:flex;gap:8px;flex:none}
.sph-prop-editor .spe-primary{background:#dedede;color:#202020;border-color:#dedede;font-weight:600}
.sph-prop-editor .spe-primary:hover{background:#fff}
.sph-prop-editor .spe-error{color:#edb5aa!important}
.sph-prop-editor .spe-confirm{position:absolute;inset:0;z-index:4;background:#0009;display:grid;place-items:center;padding:24px}
.sph-prop-editor .spe-confirm>section{max-width:420px;background:#272727;border:1px solid #555;border-radius:12px;padding:24px}
.sph-prop-editor .spe-confirm h3{font-size:18px;margin-bottom:12px}
.sph-prop-editor .spe-confirm p{color:#bbb;margin-bottom:24px}
.sph-prop-editor .spe-confirm section>div{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:1000px){.sph-prop-editor{padding:12px}.sph-prop-editor .spe-workspace{height:calc(100dvh - 24px)}.sph-prop-editor .spe-layout{grid-template-columns:160px minmax(180px,1fr) 260px}.sph-prop-editor .spe-inspector{padding:16px}.sph-prop-editor .spe-footer{padding:14px 18px}.sph-prop-editor .spe-footer-actions button{padding:7px 9px}}
@media(max-width:760px){.sph-prop-editor{padding:6px}.sph-prop-editor .spe-workspace{height:calc(100dvh - 12px);overflow:auto}.sph-prop-editor .spe-header{padding:14px 16px}.sph-prop-editor h2{font-size:20px}.sph-prop-editor .spe-layout{display:flex;flex-direction:column;overflow:visible;flex:none}.sph-prop-editor .spe-library{display:grid;grid-template-columns:1fr auto;gap:8px;padding:14px;border-right:0;border-bottom:1px solid #383838;overflow:visible}.sph-prop-editor .spe-library>h3{grid-column:1/-1}.sph-prop-editor .spe-presets{grid-template-columns:repeat(4,1fr);grid-column:1/-1}.sph-prop-editor .spe-list-heading{grid-column:1/-1;margin:6px 0}.sph-prop-editor .spe-block-list{flex-direction:row;max-height:70px;min-height:38px;overflow:auto}.sph-prop-editor .spe-library>.spe-note{display:none}.sph-prop-editor .spe-stage{height:380px;min-height:380px}.sph-prop-editor .spe-inspector{overflow:visible;border-left:0;border-top:1px solid #383838;padding:20px}.sph-prop-editor .spe-footer{flex-direction:column;align-items:stretch;gap:12px;padding:16px}.sph-prop-editor .spe-footer-actions{display:grid;grid-template-columns:1fr 1fr}.sph-prop-editor .spe-footer-actions .spe-primary{grid-column:1/-1}.sph-prop-editor .spe-confirm{position:fixed}}
@media(forced-colors:active){.sph-prop-editor :focus-visible,.sph-prop-editor input:focus{outline-color:CanvasText;border-color:CanvasText}.sph-prop-editor button[aria-pressed=true]{border-color:CanvasText}}
@media(max-width:500px){.sph-prop-editor .spe-header{flex-wrap:wrap;gap:10px}.sph-prop-editor .spe-header>div{flex:1}.sph-prop-editor .spe-header [data-library]{order:3;flex-basis:100%;margin:0}.sph-prop-editor .spe-header [data-close]{margin-left:auto}}
/* Figma 6100:2 inspector and 6028:2891/2881 role mapping, confirmed 2026-09-09.
   Prop Editor has no separate Figma frame; preserve its existing behavior with these shared roles. */
.sph-prop-editor{font-family:"Spline Sans",sans-serif;font-size:11px;line-height:16px;letter-spacing:.3px}
.sph-prop-editor button,.sph-prop-editor input,.sph-prop-editor .spe-vector input,.sph-prop-editor .spe-header [data-library]{font-size:11px;line-height:16px;font-weight:400;letter-spacing:.3px}
.sph-prop-editor button{font-weight:500}
.sph-prop-editor h2,.sph-prop-editor .spe-stage-title strong,.sph-prop-editor .spe-confirm h3{font-size:12px;line-height:18px;font-weight:600}
.sph-prop-editor h3,.sph-prop-editor legend{font-size:11px;line-height:16px;font-weight:500}
.sph-prop-editor .spe-vector label,.sph-prop-editor .spe-list-heading span,.sph-prop-editor .spe-inspector-heading span,.sph-prop-editor legend span{font-size:11px;line-height:16px;font-weight:400}
.sph-prop-editor .spe-note,.sph-prop-editor .spe-stage-hint,.sph-prop-editor .spe-footer p,.sph-prop-editor .spe-footer span,.sph-prop-editor .spe-confirm p{font-size:12px;line-height:18px;letter-spacing:.3px}
.sph-prop-editor .spe-library,.sph-prop-editor .spe-inspector,.sph-prop-editor .spe-header,.sph-prop-editor .spe-footer{border-color:var(--spe-line)}
.sph-prop-editor .spe-inspector [data-ground]{width:100%}
