/* V18: One measured, cohesive control language. Loaded last. */
:root{--j18-blue:#207eea;--j18-text:#173057;--j18-active:#eaf3ff;--j18-outline:#dce8fa;--j18-radius:13px}
/* Preserve each action's actual handler. Only presentation is changed. */
#view :is(button.btn,button.btn2,button.ghost,button.warnbtn,button.chip,button.tinybtn,button.v11-outline),
#overlay :is(button.btn,button.btn2,button.ghost,button.warnbtn,button.chip,button.tinybtn){
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:7px!important;box-sizing:border-box!important;width:auto!important;max-width:100%!important;
  min-height:38px!important;height:auto!important;padding:8px 13px!important;
  border-radius:13px!important;line-height:1.3!important;font-size:12px!important;
  letter-spacing:0!important;font-weight:720!important;text-align:center!important;
  box-shadow:none!important;transform:none!important;text-shadow:none!important;
  white-space:normal!important;flex-shrink:0!important;
}
#view button:is(.btn,.btn2,.ghost,.chip,.tinybtn,.v11-outline) :is(svg,.i){width:15px!important;height:15px!important;flex-shrink:0!important}
/* Match the Mätning tabs: soft pill, deep blue label and a quiet selected state. */
#view :is(.toolbar,.top-filters,.section-actions,.rowactions){gap:7px!important;flex-wrap:wrap!important;align-items:center!important}
#view :is(.toolbar,.top-filters) button.chip,
#view button.btn2,#view button.ghost,#view button.v11-outline,
#view .intro>button.btn,#view .intro>button.btn2,#view .intro>button.ghost,
#view button.v15-save-strategy{
  background:#f1f5fd!important;border:1px solid #e5eefb!important;color:#48658e!important;
  border-radius:13px!important;box-shadow:none!important;
}
#view :is(.toolbar,.top-filters) button.chip.active,
#view :is(.toolbar,.top-filters) button.chip[aria-selected="true"]{
  background:#e8f3ff!important;color:#176dc9!important;border-color:#e4efff!important;
  box-shadow:0 2px 7px rgba(61,120,199,.08)!important;
}
/* True primary buttons stay blue but small; non-primary controls use soft blue. */
#view button.btn{background:#207eea!important;color:#fff!important;border:1px solid #207eea!important}
#view .intro>button:is(.btn,.btn2,.ghost),#view .intro>.v15-header-action{
  background:#eef5ff!important;color:#206bbb!important;border:1px solid #dce9fa!important;
  padding:8px 12px!important;min-height:36px!important;max-width:unset!important;width:max-content!important;
  font-size:12px!important;line-height:1.2!important;white-space:normal!important;
}
#view .intro{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:13px!important}
#view .intro>div:first-child{flex:1 1 auto!important;min-width:0!important}
#view .intro h1{overflow-wrap:anywhere!important;font-size:clamp(23px,5.5vw,29px)!important;line-height:1.18!important}
#view .rowactions button{flex:0 0 auto!important}
#view .media-import-actions{gap:8px!important}
#view .media-import-actions button{min-width:0!important;max-width:100%!important}
/* Remove the actual problematic selected-mode inset stripe/shadow. */
#view .card label.studio-radio.v15-mode-card,
#view .card label.studio-radio.v15-mode-card:has(input:checked){
  position:relative!important;display:flex!important;align-items:center!important;
  gap:13px!important;width:100%!important;min-height:76px!important;
  padding:13px 14px!important;margin:0 0 9px!important;
  border:1px solid #e0e9f5!important;border-radius:14px!important;
  box-shadow:none!important;outline:none!important;
  background:#fff!important;overflow:visible!important;
}
#view .card label.studio-radio.v15-mode-card:has(input:checked){
  background:#f1f7ff!important;border:1px solid #8dbcf4!important;
  box-shadow:none!important;outline:none!important;
}
#view .card label.studio-radio.v15-mode-card:before,
#view .card label.studio-radio.v15-mode-card:after{box-shadow:none!important}
#view .card label.studio-radio.v15-mode-card input[type=radio]{
  appearance:auto!important;-webkit-appearance:radio!important;position:static!important;
  opacity:1!important;flex:0 0 19px!important;width:19px!important;height:19px!important;
  margin:0!important;accent-color:#207eea!important;grid-column:auto!important;
}
#view .card label.studio-radio.v15-mode-card>span{
  display:flex!important;flex-direction:column!important;gap:3px!important;
  min-width:0!important;width:auto!important;max-width:100%!important;
  grid-column:auto!important;
}
#view .card label.studio-radio.v15-mode-card b{font-size:14px!important;line-height:1.3!important}
#view .card label.studio-radio.v15-mode-card small{font-size:12px!important;line-height:1.42!important;margin:0!important}
/* AI director: no rectangular image background, no CSS cropping and comfortable air. */
#view .v15-team-lead .v11-lead-robot{
  display:flex!important;flex-direction:column!important;align-items:center!important;
  width:min(100%,360px)!important;max-width:100%!important;
  padding:0!important;margin:12px auto 0!important;overflow:visible!important;
  background:transparent!important;border:none!important;box-shadow:none!important;
}
#view .v15-team-lead .v11-lead-robot:before{display:none!important}
#view .v15-team-lead .v11-lead-robot img{
  display:block!important;width:min(300px,84vw)!important;height:265px!important;
  max-width:100%!important;object-fit:contain!important;object-position:center!important;
  background:transparent!important;border:none!important;box-shadow:none!important;
  mask-image:none!important;-webkit-mask-image:none!important;
  filter:none!important;margin:0!important;padding:0!important;
}
#view .v15-team-lead .v11-lead-robot strong{margin:0!important;font-size:18px!important;line-height:1.35!important}
#view .v15-team-lead .v11-lead-robot small{margin:1px 0 0!important;font-size:12px!important;line-height:1.35!important}
/* Keep informational cards and real icon targets in their original roles. */
#view :is(.toolbar,.top-filters) button{flex:0 0 auto!important}
@media(max-width:740px){
 #view .intro{flex-direction:column!important;align-items:flex-start!important;gap:10px!important}
 #view .intro>button:is(.btn,.btn2,.ghost),#view .intro>.v15-header-action{
   align-self:flex-start!important;max-width:100%!important;width:max-content!important;
   min-height:36px!important;padding:7px 11px!important;font-size:12px!important;
 }
 #view .intro h1{font-size:clamp(23px,6vw,28px)!important}
 #view .v15-team-lead .v11-lead-robot img{width:min(300px,82vw)!important;height:256px!important}
 #view .card label.studio-radio.v15-mode-card{padding:12px!important}
 #view .toolbar button.chip{min-height:36px!important;padding:8px 11px!important}
}
