/* Text tools follow the inspector's familiar outlined controls. The effect
   samples show the result while selected words use native text selection. */
html:root .builder-workspace .text-effect-field { border:0; margin:0 0 18px; padding:0; }
html:root .builder-workspace .text-effect-field legend { padding:0; margin:0 0 9px; font-size:16px; font-weight:650; }
.text-effect-choices { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
html:root .builder-workspace .text-effect-choices button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-width:0; min-height:70px; margin:0; padding:9px 3px; border:1px solid #cbdbea; border-radius:4px; background:#f8fbff; color:#315b87; font:600 12px/1.2 var(--rocode-font-family); white-space:normal; box-shadow:none; }
html:root .builder-workspace .text-effect-choices button[aria-pressed=true] { border-color:#3267ed; background:#edf4ff; color:#165aa7; box-shadow:inset 0 0 0 1px #3267ed; }
.text-effect-sample { display:block; font:750 23px/1.2 var(--rocode-font-family); color:#315b87; }
.text-effect-shadow { text-shadow:.05em .07em .04em #315b8760; }
.text-effect-outline { -webkit-text-stroke:.02em currentColor; text-shadow:-1px 0 white,1px 0 white,0 -1px white,0 1px white; }
.text-effect-marker { text-decoration:underline #ffd24d .3em; text-underline-offset:-.14em; text-decoration-skip-ink:none; }
.text-design-feedback { margin:0 0 12px; color:#a43d23; font:400 14px/1.5 var(--rocode-font-family); overflow-wrap:anywhere; }
.text-accent-settings { margin:0 0 12px; border-top:1px solid #d8e4ef; }
.text-accent-settings summary { padding:12px 0; min-height:44px; cursor:pointer; font-weight:650; }
.text-accent-panel { padding:0 0 12px; min-width:0; }
.text-accent-selection-label { display:block; color:#34516d; font:600 14px/1.4 var(--rocode-font-family); }
html:root .builder-workspace .text-accent-selection-label textarea { display:block; box-sizing:border-box; width:100%; min-width:0; min-height:90px; margin:8px 0 0; padding:10px; border:1px solid #aebfd1; border-radius:4px; background:white; color:#17324d; font:400 16px/1.5 var(--rocode-font-family); resize:vertical; cursor:text; user-select:text; }
.text-accent-selection-label textarea::selection { background:#b8d6ff; color:#17324d; }
.text-accent-selection-status { min-height:20px; margin:8px 0 12px; font:400 13px/1.5 var(--rocode-font-family); color:#526b80; overflow-wrap:anywhere; }
.text-accent-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
html:root .builder-workspace .text-accent-actions button { display:flex; align-items:center; justify-content:center; gap:6px; min-width:0; min-height:40px; margin:0; padding:8px 5px; border:1px solid #cbdbea; border-radius:4px; background:#f8fbff; color:#315b87; font:600 14px/1.3 var(--rocode-font-family); box-shadow:none; }
.text-accent-actions button[data-text-accent-action=clear] { grid-column:1/-1; }
html:root .builder-workspace .text-accent-actions button[aria-pressed=true] { border-color:#3267ed; background:#edf4ff; }
.text-accent-marker-sample { background:#ffe270; color:#1f2c3b; font-weight:700; padding:0 2px; }
.text-accent-colors { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:5px; margin:12px 0; }
html:root .builder-workspace .text-accent-colors button { display:grid; place-items:center; min-width:0; min-height:40px; margin:0; padding:5px; border:1px solid #cbdbea; border-radius:4px; background:#f8fbff; box-shadow:none; }
.text-accent-colors button span { width:23px; height:23px; background:var(--text-accent-color); border-radius:50%; }
html:root .builder-workspace .text-accent-colors button[aria-pressed=true] { border-color:#3267ed; box-shadow:inset 0 0 0 1px #3267ed; }
html:root .builder-workspace .text-accent-clear-all { display:block; width:100%; min-height:40px; margin:0; padding:8px; border:1px solid #cbdbea; border-radius:4px; background:#f8fbff; color:#315b87; font:600 14px/1.3 var(--rocode-font-family); box-shadow:none; }
html:root .builder-workspace :is(.text-effect-choices button,.text-accent-actions button,.text-accent-colors button,.text-accent-clear-all):focus-visible { outline:3px solid #245db5; outline-offset:2px; }
html:root .builder-workspace :is(.text-accent-actions button,.text-accent-colors button,.text-accent-clear-all):disabled { cursor:default; opacity:.45; }
@media(any-pointer:coarse){html:root .builder-workspace :is(.text-accent-actions button,.text-accent-colors button,.text-accent-clear-all){min-height:44px;}}
@media(max-width:360px){.text-effect-choices{grid-template-columns:repeat(2,minmax(0,1fr));}.text-accent-colors{grid-template-columns:repeat(3,minmax(0,1fr));}}