/* A compact manicure station and a slightly clearer, persistent color control. */
.style-toolbox{grid-template-columns:repeat(11,minmax(0,1fr))}
.custom-section:has(>.color-row){grid-column:1 / -1}
.nail-studio-note{margin:8px 6px 12px;color:#784f72;font-weight:700;font-size:14px}
.nail-studio-note span{display:block;margin-top:5px;font-weight:400;font-size:12px;line-height:1.5;color:#796b79}
.custom-sections:has([data-feature-field=nailShape]){display:block}
.custom-section[data-feature-field=nailShape] .option-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.custom-section[data-feature-field=nailDesign] .option-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.custom-panel .nail-preview{height:82px}
.custom-section[data-feature-field^=nail] .option-button>span:last-child{font-size:11px;padding:5px;min-height:27px}
.custom-section[data-feature-field^=nail]{margin-bottom:8px}
.custom-color-control{display:flex;align-items:center;gap:10px;min-height:52px;padding:7px 10px;border:1px solid #cfa8c5;border-radius:12px;background:linear-gradient(120deg,#fff2f7,#f5effb);color:#62405d;cursor:pointer}
.custom-color-control input[type=color]{flex:0 0 40px;width:40px;height:40px;min-width:40px;border:1px solid #bb87ac;border-radius:9px;padding:3px;background:white;cursor:pointer}
.custom-color-control>span:not(.color-control-arrow){display:flex;flex-direction:column;gap:3px;min-width:0}
.custom-color-control strong{font-size:12px;line-height:1.25}
.custom-color-control small{font-size:10px;line-height:1.25;color:#806477}
.custom-color-control .color-control-arrow{margin-left:auto;font-size:18px}
.custom-color-control:focus-within{outline:2px solid #94608b;outline-offset:2px}
.custom-color-control:hover{border-color:#a8789e;background:#f8eaf5}
.color-row>.inline-color-control{display:inline-flex;flex:0 0 auto;align-items:center;gap:6px;min-height:44px;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.custom-section .inline-color-control input[type=color]{flex:0 0 44px;width:44px;height:44px;min-width:44px;padding:3px;border-radius:10px}
.custom-section .inline-color-control>span{display:block;color:#62405d;font-size:11px;font-weight:600;white-space:nowrap}
.custom-sections:has([data-feature-field=hairColor]){align-content:start;row-gap:6px}
.custom-section[data-feature-field=hairColor]{padding:4px 6px 2px!important}
.custom-section[data-feature-field=hairColor] .field-label{margin-bottom:3px;font-size:11px}
.custom-section[data-feature-field=hairColor] .color-row{gap:5px;margin:0}
.custom-section[data-feature-field=hairColor] .color-swatch{width:28px;height:28px;min-width:28px;min-height:28px}
.custom-section[data-feature-field=hairColor] .inline-color-control{min-height:32px;gap:4px}
.custom-section[data-feature-field=hairColor] .inline-color-control input[type=color]{flex-basis:30px;width:30px;height:30px;min-width:30px;padding:2px;border-radius:8px}
.custom-section[data-feature-field=hairColor] .inline-color-control>span{font-size:10px}
.custom-section[data-feature-field=hair]{padding-top:4px!important}
.color-picker{max-height:122px}
.color-picker .custom-color{order:-1;flex-basis:100%;width:100%;flex-wrap:wrap}
.color-picker .field-label{order:-2;display:flex;align-items:center;justify-content:space-between;gap:12px}
.color-picker .remove-color-piece{border:0;background:transparent;color:#8f647f;font:600 11px/1.2 inherit;padding:2px 0;cursor:pointer}
.color-picker .remove-color-piece:hover{color:#a72269;text-decoration:underline}
.custom-color .custom-color-control{flex:1;min-width:170px;font-size:12px}
.custom-color .custom-color-control input{width:40px;height:40px;min-width:40px}
.custom-panel .default-swatch{width:auto;min-width:72px;padding:0 9px}
.custom-panel .default-swatch>span{display:block;color:#493142;font-size:11px;font-weight:700;text-shadow:0 1px 2px #fff9}
.nail-preview svg,.avatar-render[data-camera=nails] svg{overflow:hidden}
.avatar-render[data-camera=nails]{animation:cameraSettle .24s ease-out}
@media(max-width:700px){
  .style-toolbox{grid-template-columns:repeat(6,minmax(0,1fr))}
  .style-tool{flex-direction:column;gap:2px}
  .style-tool strong{font-size:10px}
  .custom-color-control{gap:7px;padding:6px}
  .custom-color .custom-color-control{min-width:0;width:100%;flex-basis:100%}
  .custom-color .btn{display:none} /* The same remove action stays on the item and Your look. */
  .custom-color-control small{font-size:9px}
  .custom-color-control .color-control-arrow{display:none}
  .custom-section[data-feature-field=nailShape] .option-grid,.custom-section[data-feature-field=nailDesign] .option-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  .custom-section[data-feature-field=hairColor] .color-swatch{width:25px;height:25px;min-width:25px;min-height:25px}
  .custom-section[data-feature-field=hairColor] .inline-color-control input[type=color]{flex-basis:27px;width:27px;height:27px;min-width:27px}
  .custom-panel .nail-preview{height:66px}
  .custom-section[data-feature-field^=nail] .option-button>span:last-child{font-size:10px}
  .color-picker{max-height:122px}
}
@media(prefers-reduced-motion:reduce){.avatar-render[data-camera=nails]{animation:none}}
