/* Feature-specific styling (contextual tool options, inspector sections, dialogs).
   Loaded directly after workspace.css, which owns shell geometry and tokens only. */

/* Crop tool options */
.crop-field input{width:68px}#toolopts #crop-apply,#toolopts #crop-cancel{white-space:nowrap;flex-shrink:0}.crop-hint{white-space:nowrap;color:var(--text-dim)}
@media(max-width:767px){#toolopts:has(#crop-apply){height:auto;min-height:88px;flex-wrap:wrap;gap:6px;padding:6px 10px}#toolopts:has(#crop-apply)>strong{width:100%}.crop-field input{width:58px}.crop-hint{display:none}}

/* Artboard tool options and list */
.artboard-fields{display:flex;flex-direction:column;gap:8px}.artboard-fields input{min-width:0;width:100%}.artboard-list-name{flex:1!important;width:auto!important;justify-content:flex-start!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}#toolopts:has(#artboard-name){overflow:auto}
#toolopts:has(#artboard-tools-title)>*{flex-shrink:0;white-space:nowrap}#doc-bg-opacity{min-width:64px}
@media(max-width:767px){#toolopts:has(#artboard-tools-title){height:auto;min-height:82px;flex-wrap:wrap;gap:5px;padding:5px 10px}#artboard-tools-title{width:100%}.artboard-tools-hint{display:none}#toolopts:has(#artboard-tools-title) .btn{min-height:36px;flex:1;padding:4px 8px}}

/* Transparency */
#pb-transparency { display:flex; flex-direction:column; gap:7px; }
#pb-transparency .row { display:flex; justify-content:space-between; gap:8px; }
#pb-transparency input[type=number] { width:80px; }
#pb-transparency select { max-width:150px; }
#pb-transparency p { color:var(--text-muted); font-size:11px; }
[data-transparency-handle] { cursor:crosshair; }
#viewport[data-tool=transparency] { cursor:crosshair; }

/* Live corner radius */
#pb-corners{display:flex;flex-direction:column;gap:8px}
#pb-corners .row{display:flex;align-items:center;gap:7px}
#pb-corners input{width:82px;margin-left:auto}
#pb-corners p,.corner-hint{font-size:11px;color:var(--text-dim);line-height:1.5}
#pb-corners .corner-link[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}
[data-radius-handle]:focus{outline:none}
[data-radius-handle]:hover path:last-child,[data-radius-handle]:focus path:last-child{stroke:var(--text);stroke-width:2px}
@media(max-width:1100px){#pb-corners input,#pb-corners button{min-height:36px}}

/* Content containers */
.placement-hint{font-size:11px;color:var(--text-dim);white-space:normal;line-height:1.4}
.container-badge{font-size:9px;color:var(--text-dim);padding:2px 4px;border:1px solid var(--border);border-radius:3px;flex-shrink:0}

/* Pen tool options */
#toolopts .pen-hint{color:var(--text-faint);font-size:10px;white-space:nowrap;margin-left:8px}
#toolopts .tool-group:has(.pen-hint){display:flex;align-items:center;gap:5px;white-space:nowrap}
#pen-overlay{pointer-events:none}

/* Portable projects and version history */
.modal.project-browser { width:min(820px,calc(100vw - 32px)); max-width:820px; }
.project-browser-tools { display:flex; gap:10px; flex-wrap:wrap; }
.project-browser-tools input { flex:1; min-width:150px; }
.project-browser-tools input,.project-browser-tools select,.project-name-field input { background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-md);padding:9px 10px; }
.project-note { color:var(--text-dim);font-size:12px;line-height:1.6;margin:14px 0; }
.project-name-field { display:flex;flex-direction:column;gap:8px; }
#recent-projects,#project-versions { max-height:48vh;overflow:auto; }
.project-library-row { display:flex;align-items:center;gap:8px;padding:14px 0;border-bottom:1px solid var(--border); }
.project-library-info { flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;overflow-wrap:anywhere; }
.project-library-info strong { font-size:13px; }
.project-library-info span { color:var(--text-dim);font-size:11px;line-height:1.5; }
@media(max-width:600px) {
 .project-library-row { flex-wrap:wrap; }
 .project-library-info { flex-basis:100%; }
 .project-browser-tools input { flex-basis:100%;order:2; }
}

/* Command palette and shortcut editor */
.workflow-list { max-height:55vh;overflow:auto;display:flex;flex-direction:column;gap:5px; }
.workflow-command { padding:11px 12px;text-align:left;background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer; }
.workflow-command:hover { border-color:var(--accent); }
#command-search,.layer-search { width:100%;padding:10px;margin-bottom:10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-input);color:var(--text);box-sizing:border-box; }
.shortcut-row { display:flex;align-items:center;gap:12px;justify-content:space-between;padding:6px; }
.shortcut-row input { width:130px; background:var(--bg-input);color:var(--text);padding:6px;border:1px solid var(--border); }