/*
 * Desktop appearance contract
 * ---------------------------
 * Page Settings owns the card surface at desktop sizes. Theme skins can still
 * style widget content, but may not replace the selected card colour,
 * transparency or glow choice.
 */
@media (min-width:1024px){
  .cw-page[data-workspace-theme] .cw-stage .cw-grid .cw-widget{
    --cw-widget-surface:color-mix(
      in srgb,
      var(--cw-widget-background,var(--card)) var(--cw-widget-opacity,94%),
      transparent
    );
    border-color:color-mix(in srgb,var(--cw-widget-edge,var(--line)) 30%,transparent)!important;
    background:var(--cw-widget-surface)!important;
    color:var(--cw-widget-text,var(--ink))!important;
    backdrop-filter:blur(16px) saturate(1.08);
    -webkit-backdrop-filter:blur(16px) saturate(1.08);
  }
  .cw-page[data-workspace-theme] .cw-stage .cw-grid .cw-widget>.cw-widget-head,
  .cw-page[data-workspace-theme] .cw-stage .cw-grid .cw-widget>.cw-widget-body{
    background-color:transparent!important;
    background-image:none!important;
  }

  /* Keep depth separate from the optional coloured edge glow. */
  .cw-page[data-shadow=none] .cw-grid .cw-widget{
    box-shadow:0 0 20px color-mix(in srgb,var(--cw-glow,transparent) 14%,transparent)!important;
  }
  .cw-page[data-shadow=soft] .cw-grid .cw-widget{
    box-shadow:0 7px 18px rgba(0,0,0,.12),0 0 22px color-mix(in srgb,var(--cw-glow,transparent) 16%,transparent)!important;
  }
  .cw-page[data-shadow=strong] .cw-grid .cw-widget{
    box-shadow:0 14px 34px rgba(0,0,0,.18),0 0 28px color-mix(in srgb,var(--cw-glow,transparent) 20%,transparent)!important;
  }
  .cw-page[data-glow-enabled=true] .cw-grid .cw-widget:hover{
    box-shadow:0 15px 36px rgba(0,0,0,.2),0 0 34px color-mix(in srgb,var(--cw-glow,transparent) 25%,transparent)!important;
  }
  .cw-page[data-glow-enabled=false][data-shadow=none] .cw-grid .cw-widget,
  .cw-page[data-glow-enabled=false][data-shadow=none] .cw-grid .cw-widget:hover{
    box-shadow:none!important;
  }
  .cw-page[data-glow-enabled=false][data-shadow=soft] .cw-grid .cw-widget,
  .cw-page[data-glow-enabled=false][data-shadow=soft] .cw-grid .cw-widget:hover{
    box-shadow:0 7px 18px rgba(0,0,0,.12)!important;
  }
  .cw-page[data-glow-enabled=false][data-shadow=strong] .cw-grid .cw-widget,
  .cw-page[data-glow-enabled=false][data-shadow=strong] .cw-grid .cw-widget:hover{
    box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
  }

  /* The Airmail timer is a plain paper ticket, without a purple inner wash. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer .cw-widget-body,
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer .cw-timer-reference-mini,
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer .cw-timer-ref-face{
    background:transparent!important;
    box-shadow:none!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer
  .cw-timer-reference-mini>footer{
    width:100%;
    gap:10px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer
  .cw-timer-reference-mini>footer :is(.cw-timer-ref-start,.cw-timer-ref-secondary){
    min-width:0!important;
    flex:1 1 0!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer .cw-timer-ref-start::before{
    content:none!important;
  }

  /* Notes follows the reference: one clean writing surface, not a card in a card. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes .cw-widget-body,
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes .cw-notes-small{
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes .cw-notes-small{
    border:0!important;
    padding:6px 1px 14px!important;
    transform:none!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes .cw-notes-small::after{
    display:none!important;
    content:none!important;
  }

  /* Restore square calendar day targets; the selected day is circular again. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-calendar
  .cw-calendar-reference-mini .cw-calendar-month-grid button{
    width:auto!important;
    max-width:100%!important;
    height:100%!important;
    max-height:100%!important;
    aspect-ratio:1!important;
    justify-self:center!important;
  }

  /* Minimal mode remains the final escape hatch over every desktop skin. */
  .cw-page[data-minimal-widgets=true] .cw-stage .cw-grid .cw-widget,
  .cw-page[data-minimal-widgets=true] .cw-stage .cw-grid .cw-widget:hover{
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    filter:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
}

/*
 * Compact Airmail fit
 * -------------------
 * The reference grid uses deliberately short cards. Keep the controls easy to
 * hit, but scale the visible chrome and widget internals to the space they
 * actually occupy.
 */
@media (min-width:1024px){
  /* The envelope edge is always the recognisable red / blue Airmail stripe.
     Accent colour remains independent and continues to theme controls. */
  .cw-page[data-widget-design=airmail]{
    --lm-red:#cf3f2e;
    --lm-blue:#2d4f9b;
  }

  /* Quieter headers: the 36px targets remain usable, while the drawn controls
     no longer dominate every card. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget>.cw-widget-head{
    min-height:54px!important;
    gap:6px!important;
    padding:7px 8px 7px 11px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-title{
    gap:7px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-title>span{
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    flex-basis:32px!important;
    border-radius:9px!important;
    font-size:15px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-title h3{
    font-size:clamp(14px,3.25cqw,17px)!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-title small{
    margin-top:1px!important;
    font-size:10px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions{
    gap:2px!important;
    opacity:1!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions
  :is(.cw-open-app,.cw-header-delete){
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    border:0!important;
    border-radius:10px!important;
    box-shadow:none!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions .cw-open-app{
    background:transparent!important;
    color:var(--lm-blue)!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions>.cw-header-delete{
    background:transparent!important;
    color:#b53a34!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions .cw-open-app:is(:hover,:focus-visible){
    background:color-mix(in srgb,var(--lm-blue) 15%,transparent)!important;
    box-shadow:0 0 0 2px color-mix(in srgb,var(--lm-blue) 12%,transparent)!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions>.cw-header-delete:is(:hover,:focus-visible){
    background:color-mix(in srgb,#c63d35 14%,transparent)!important;
    box-shadow:0 0 0 2px color-mix(in srgb,#c63d35 10%,transparent)!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions .cw-open-app::before{
    display:none!important;
    content:none!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions .cw-settings-gear{
    display:block!important;
    width:17px!important;
    height:17px!important;
    fill:none!important;
    stroke:currentColor!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions .cw-settings-gear *{
    fill:none!important;
    stroke:currentColor!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-actions>.cw-header-delete svg{
    width:15px!important;
    height:15px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid
  .cw-widget[data-grid-h="6"]>.cw-widget-head{
    min-height:48px!important;
    padding-block:5px!important;
  }

  /* Timer: reserve a calm face area and one clean action row. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer>.cw-widget-body{
    padding:7px 17px 10px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer .cw-timer-reference-mini{
    grid-template-rows:minmax(46px,1fr) 38px!important;
    gap:4px!important;
    overflow:hidden!important;
    padding:4px 14px 6px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer
  .cw-timer-reference-mini .cw-timer-ref-face output{
    font-size:clamp(42px,13cqw,58px)!important;
    line-height:.92!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer .cw-timer-ref-face::after{
    right:-58px!important;
    width:54px!important;
    height:32px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer
  .cw-timer-reference-mini>footer{
    gap:8px!important;
    padding:0!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer
  .cw-timer-reference-mini>footer :is(.cw-timer-ref-start,.cw-timer-ref-secondary){
    min-height:36px!important;
    height:36px!important;
    border-radius:9px!important;
    font-size:12px!important;
    box-shadow:none!important;
  }

  /* Radio: the artwork owns the feature row and the volume track gets a
     separate row below it instead of crossing the cover. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio>.cw-widget-body{
    padding:8px 17px 8px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio .cw-radio-medium{
    grid-template-rows:minmax(0,1fr) 22px!important;
    gap:7px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio{
    --cw-airmail-radio-art:clamp(80px,40cqh,96px);
  }
  .cw-page[data-widget-design=airmail] .cw-grid
  .cw-widget[data-widget-layout="medium"].cw-widget-radio .cw-radio-medium .cw-radio-feature{
    grid-template-columns:var(--cw-airmail-radio-art) minmax(0,1fr) auto!important;
    gap:14px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid
  .cw-widget[data-widget-layout="medium"].cw-widget-radio .cw-radio-medium .cw-radio-feature>
  :is(.cw-radio-cover,.cw-music-upload-art){
    width:var(--cw-airmail-radio-art)!important;
    min-width:var(--cw-airmail-radio-art)!important;
    height:var(--cw-airmail-radio-art)!important;
    border-radius:12px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio .cw-radio-copy{
    gap:3px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio .cw-radio-copy strong{
    font-size:clamp(14px,3.3cqw,17px)!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio .cw-radio-copy small{
    margin-top:1px!important;
    font-size:8px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio
  .cw-radio-medium .cw-radio-transport{
    gap:7px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio
  .cw-radio-medium .cw-radio-transport button{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    min-height:30px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio
  .cw-radio-medium .cw-radio-transport .cw-radio-play{
    width:48px!important;
    min-width:48px!important;
    height:48px!important;
    min-height:48px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-radio .cw-radio-range{
    min-height:22px!important;
    align-self:end!important;
    padding:0 0 10px!important;
  }

  /* Notes: a simple list on the card surface, with no nested notepad. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes>.cw-widget-body{
    padding:4px 12px 10px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes .cw-notes-small{
    gap:4px!important;
    padding:2px 0 8px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes
  :is(.cw-note-card-tape,.cw-note-sticker-layer,.cw-note-mini-heading,.cw-note-preview-title){
    display:none!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes .cw-note-preview{
    gap:5px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes .cw-note-line{
    overflow:hidden!important;
    font-size:clamp(10px,2.65cqw,11px)!important;
    line-height:1.45!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes .cw-widget-head::after{
    right:82px!important;
    top:-4px!important;
    font-size:24px!important;
  }

  /* The shorter Calendar header needs its arrows lowered with the title. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-calendar .cw-calendar-head{
    top:-47px!important;
    right:78px!important;
    height:34px!important;
  }

  /* Weather: keep the main reading and all four metrics in distinct tracks. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather>.cw-widget-body{
    padding:5px 14px 10px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-layout{
    grid-template-rows:minmax(0,1fr) auto!important;
    gap:3px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-main{
    min-height:0!important;
    align-items:center!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-main strong{
    font-size:clamp(36px,11cqw,42px)!important;
    line-height:.9!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-main>div>span{
    margin-top:2px!important;
    font-size:9px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-icon{
    width:58px!important;
    height:50px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-strip{
    padding-top:4px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-strip>span{
    gap:2px!important;
    padding:1px 4px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-strip small{
    font-size:7px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather .cw-weather-strip b{
    font-size:9px!important;
  }

  /* Daily Goals: four rows now have a real minimum track and compact content,
     so no checkbox or label can intrude into the next goal. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-goals>.cw-widget-body{
    position:relative;
    z-index:1;
    padding:5px 15px 6px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-goals .cw-goal-list{
    height:100%!important;
    grid-template-rows:repeat(4,minmax(19px,1fr))!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-goals
  .cw-goal-list>.cw-premium-row{
    height:auto!important;
    min-height:0!important;
    padding:2px 4px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-goals .cw-goal-copy{
    min-height:0!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-goals .cw-goal-copy>strong{
    overflow:hidden!important;
    font-size:10px!important;
    line-height:1.2!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-goals .cw-goal-copy>strong::before{
    width:14px!important;
    height:14px!important;
    flex-basis:14px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-goals::after{
    z-index:0!important;
    right:10px!important;
    bottom:3px!important;
    opacity:.55;
  }
}

@media (min-width:1024px){
  @container widget (max-width:260px){
    .cw-page[data-widget-design=airmail] .cw-widget-notes .cw-widget-head::after{
      display:none!important;
      content:none!important;
    }
  }
}

/*
 * Transparent neutral surfaces
 * ----------------------------
 * Child controls must inherit the glass card instead of painting an opaque
 * cream rectangle over a customised background.
 */
@media (min-width:1024px){
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-notes::before{
    display:none!important;
    content:none!important;
  }

  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-quicklinks
  .cw-launchpad-tile{
    border-color:color-mix(in srgb,var(--cw-widget-edge) 34%,transparent)!important;
    background:color-mix(in srgb,var(--cw-widget-text) 6%,transparent)!important;
    box-shadow:none!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-quicklinks
  .cw-launchpad-link{
    background:transparent!important;
  }

  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer
  .cw-timer-reference-mini>footer{
    background:transparent!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-timer
  .cw-timer-reference-mini .cw-timer-ref-secondary{
    border-color:color-mix(in srgb,var(--cw-widget-edge) 34%,transparent)!important;
    background:color-mix(in srgb,var(--cw-widget-text) 6%,transparent)!important;
    color:var(--cw-widget-text)!important;
    box-shadow:none!important;
  }

  /* Reserve a clean track for every Weather metric and keep the content above
     the envelope edge. */
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather>
  .cw-widget-body{
    position:relative;
    z-index:1;
    box-sizing:border-box;
    overflow:hidden!important;
    padding:6px 14px 15px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid
  .cw-widget-weather[data-widget-layout="medium"] .cw-weather-layout{
    grid-template-rows:minmax(52px,1fr) minmax(29px,auto)!important;
    gap:3px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather
  .cw-weather-main strong{
    font-size:clamp(34px,10cqw,39px)!important;
    line-height:1!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather
  .cw-weather-icon{
    width:52px!important;
    height:46px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather
  .cw-weather-strip{
    min-height:29px;
    padding:5px 0 1px!important;
  }
  .cw-page[data-widget-design=airmail] .cw-grid .cw-widget-weather
  .cw-weather-strip :is(small,b){
    line-height:1.15!important;
  }

  /* Full widget apps use the same user-selected surface and ink as their card,
     even when the surrounding desk palette is Modern, Forest or another theme. */
  .cw-page[data-widget-design=airmail]
  :is(.cw-widget-app-dialog,.cw-widget-app){
    --lm-card:color-mix(in srgb,var(--cw-widget-background) var(--cw-widget-opacity,94%),transparent);
    --lm-card2:color-mix(in srgb,var(--cw-widget-background) 88%,var(--cw-widget-text));
    --lm-ink:var(--cw-widget-text);
    --lm-ink-soft:color-mix(in srgb,var(--cw-widget-text) 68%,var(--cw-widget-background));
    --lm-line-soft:color-mix(in srgb,var(--cw-widget-edge) 34%,transparent);
    color:var(--cw-widget-text)!important;
  }
  .cw-page[data-widget-design=airmail] .cw-widget-app-dialog,
  .cw-page[data-widget-design=airmail] .cw-widget-app,
  .cw-page[data-widget-design=airmail] .cw-widget-app-body,
  .cw-page[data-widget-design=airmail] .cw-widget-app-head{
    border-color:var(--lm-line-soft)!important;
    background:var(--lm-card)!important;
    color:var(--cw-widget-text)!important;
  }
}
