.field-home {
  display: none;
}

@media (max-width: 760px) {
  :root {
    --field-home-gutter: max(1.25rem, env(safe-area-inset-left));
    --field-home-control: 56px;
  }

  html {
    scroll-padding-top: calc(68px + env(safe-area-inset-top));
  }

  body {
    padding-bottom: calc(69px + env(safe-area-inset-bottom));
  }

  .site-header,
  .site-header.scrolled,
  .site-header.open {
    position: fixed;
    height: calc(68px + env(safe-area-inset-top));
    padding: env(safe-area-inset-top)
      max(1.25rem, env(safe-area-inset-right)) 0
      max(1.25rem, env(safe-area-inset-left));
    background: var(--ink);
    color: var(--white);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .site-header .brand {
    font-size: 0.78rem;
    letter-spacing: 0.18em;
  }

  .site-header nav,
  .site-header.open nav,
  .menu-button {
    display: none !important;
  }

  .header-actions {
    margin-left: auto;
  }

  .header-search {
    width: 46px;
    min-width: 46px;
    height: 46px;
    border: 1px solid #fffdf766;
    border-radius: 50%;
    background: transparent;
    color: var(--white);
  }

  .hero {
    display: none;
  }

  .hero-copy {
    display: none;
  }

  .hero-art {
    inset: 68px 0 0;
    width: 100%;
    height: 164px;
    border-radius: 0;
    background: #315b5d;
  }

  .hero-art .entity-visual,
  .hero-art picture,
  .hero-art img {
    width: 100%;
    height: 100%;
  }

  .hero-art img {
    display: block;
    object-fit: cover;
    object-position: 50% 52% !important;
  }

  .hero-art .visual-badge,
  .hero-art .visual-credit {
    display: none;
  }

  .field-home {
    display: block;
    position: relative;
    z-index: 2;
    min-height: calc(
      100dvh - 69px - env(safe-area-inset-bottom)
    );
    padding-top: calc(68px + env(safe-area-inset-top));
    background: var(--paper);
    color: var(--ink);
  }

  .field-home-main {
    display: grid;
    gap: 0.7rem;
    padding: 1rem max(1.25rem, env(safe-area-inset-right)) 1.25rem
      max(1.25rem, env(safe-area-inset-left));
  }

  .field-home-context {
    min-width: 0;
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr);
    align-items: center;
    gap: 0.65rem;
    padding-bottom: 0.65rem;
    border-bottom: 1px solid #132f2726;
  }

  .field-home-context-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--sea);
    box-shadow: 0 0 0 4px #3b6c701c;
  }

  .field-home.is-locating .field-home-context-dot {
    animation: field-home-pulse 1.8s ease-in-out infinite;
  }

  .field-home.is-live .field-home-context-dot {
    background: #3f835f;
    box-shadow: 0 0 0 4px #3f835f1f;
  }

  @keyframes field-home-pulse {
    50% {
      opacity: 0.45;
      transform: scale(0.78);
    }
  }

  .field-home-context-label {
    display: block;
    margin-bottom: 0.1rem;
    color: #132f279e;
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  .field-home h1 {
    max-width: 13ch;
    margin: 0;
    font: 400 clamp(2.25rem, 10vw, 3rem) / 0.92 var(--serif);
    letter-spacing: -0.04em;
    overflow-wrap: normal;
  }

  .field-home h1 em {
    color: var(--rust);
    font-weight: 400;
  }

  .field-home-lead {
    max-width: 42ch;
    margin: 0;
    color: #132f27c7;
    font-size: 0.72rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }

  .field-home-primary {
    width: 100%;
    min-height: 62px;
    border: 1px solid var(--lime);
    border-radius: 4px;
    background: var(--lime);
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    padding: 0.75rem 1rem;
    font-size: 0.92rem;
    font-weight: 700;
    cursor: pointer;
  }

  .field-home-primary-copy {
    display: grid;
    justify-items: center;
    gap: 0.12rem;
    min-width: 0;
  }

  .field-home-primary-copy strong {
    font: inherit;
  }

  .field-home-primary-copy small,
  .field-home-primary-copy > span {
    font-size: 0.66rem;
    font-weight: 500;
    line-height: 1.25;
  }

  .field-home-primary-copy small {
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }

  .field-home-primary-arrow {
    margin-left: auto;
  }

  .field-home.is-live .field-home-lead {
    color: #132f27bd;
  }

  .field-home.is-live .field-home-primary {
    min-height: 72px;
    justify-content: flex-start;
    padding-inline: 1rem 0.85rem;
    text-align: left;
  }

  .field-home.is-live .field-home-primary-copy {
    justify-items: start;
  }

  .field-home.is-live .field-home-primary-copy strong {
    max-width: 24ch;
    font-size: 0.94rem;
    line-height: 1.15;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .field-home.is-live .field-home-primary-copy > span {
    max-width: 31ch;
    opacity: 0.78;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .field-home-primary:hover,
  .field-home-primary:focus-visible {
    border-color: var(--ink);
    background: var(--sun);
  }

  .field-home-primary:disabled {
    cursor: wait;
    opacity: 0.78;
  }

  .field-home-primary svg,
  .field-home-search svg,
  .field-home-quick svg,
  .field-home-secondary-actions svg,
  .field-home-more svg,
  .field-home-preview svg,
  .field-dock svg {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .field-home-search {
    min-height: var(--field-home-control);
    margin: 0;
    border: 1px solid #132f2780;
    border-radius: 3px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 0.55rem;
    padding: 0 0.9rem;
    background: var(--white);
  }

  .field-home-search:focus-within {
    border-color: var(--ink);
    box-shadow: 0 0 0 2px #dce85c80;
  }

  .field-home-search input {
    width: 100%;
    min-width: 0;
    min-height: 52px;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 0.9rem;
  }

  .field-home-quick {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    margin: 0;
  }

  .field-home-quick button {
    min-width: 0;
    min-height: 64px;
    border: 1px solid #132f2766;
    border-radius: 3px;
    background: transparent;
    color: var(--ink);
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    align-content: center;
    gap: 0.08rem 0.65rem;
    padding: 0.6rem 0.75rem;
    text-align: left;
    font-size: 0.82rem;
    cursor: pointer;
  }

  .field-home-quick button > svg {
    grid-column: 1;
    grid-row: 1 / 3;
  }

  .field-home-quick button > span,
  .field-home-quick button > small {
    grid-column: 2;
    min-width: 0;
  }

  .field-home-quick button[data-open-bird-guide] {
    border-color: var(--ink);
    background: #e7eeea;
  }

  .field-home-quick button[data-open-bird-guide] svg {
    color: var(--rust);
  }

  .field-home-quick button small {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: #132f27b8;
    font-size: 0.64rem;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .field-home.is-live .field-home-quick button {
    min-height: 68px;
  }

  .field-home-quick button:hover,
  .field-home-quick button:focus-visible {
    border-color: var(--ink);
    background: #e7eeea;
  }

  .field-home-quick svg {
    width: 27px;
    height: 27px;
  }

  .field-home-horizon {
    min-width: 0;
    min-height: 64px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid #132f2729;
    border-left: 4px solid var(--sea);
    border-radius: 3px;
    background: #e7eeea;
  }

  .field-home-horizon[hidden] {
    display: none;
  }

  .field-home-horizon > div {
    min-width: 0;
  }

  .field-home-horizon-mark {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    font: 400 1rem / 1 var(--serif);
  }

  .field-home-horizon h2 {
    margin: 0;
    font-size: 0.74rem;
    line-height: 1.2;
  }

  .field-home-horizon p {
    margin: 0.15rem 0 0;
    color: #132f27b5;
    font-size: 0.62rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }

  .field-home-horizon ol {
    display: grid;
    gap: 0;
    margin: 0.5rem 0 0;
    padding: 0;
    list-style: none;
  }

  .field-home-horizon li {
    min-width: 0;
    border-top: 1px solid #132f2724;
  }

  .field-home-horizon li > button,
  .field-home-horizon li > div {
    width: 100%;
    min-width: 0;
    min-height: 52px;
    border: 0;
    background: transparent;
    color: inherit;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0;
    text-align: left;
    font: inherit;
  }

  .field-home-horizon li > button {
    cursor: pointer;
  }

  .field-home-horizon li > button:hover,
  .field-home-horizon li > button:focus-visible {
    outline: 0;
    background: #fffdf780;
    box-shadow: 0 0 0 2px var(--ink);
  }

  .field-home-horizon-role {
    color: #132f27a8;
    font-size: 0.57rem;
    font-weight: 750;
    letter-spacing: 0.08em;
    line-height: 1.15;
    text-transform: uppercase;
  }

  .field-home-horizon-copy {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
  }

  .field-home-horizon-copy strong,
  .field-home-horizon-copy small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .field-home-horizon-copy strong {
    font-size: 0.72rem;
    line-height: 1.2;
  }

  .field-home-horizon-copy small {
    color: #132f27b5;
    font-size: 0.6rem;
    line-height: 1.25;
  }

  .field-home-horizon-arrow {
    justify-self: end;
    font-size: 0.9rem;
  }

  .field-home-horizon li[data-horizon-role="caution"] {
    color: var(--rust);
  }

  .field-home-tools {
    min-width: 0;
    border-top: 1px solid #132f2726;
    border-bottom: 1px solid #132f2726;
  }

  .field-home-tools summary {
    min-height: 48px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 20px;
    align-items: center;
    gap: 0.55rem;
    list-style: none;
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 700;
  }

  .field-home-tools summary::-webkit-details-marker {
    display: none;
  }

  .field-home-tools summary small {
    color: #132f2799;
    font-size: 0.6rem;
    font-weight: 500;
  }

  .field-home-tools summary::after {
    content: "+";
    justify-self: end;
    font: 400 1.35rem / 1 var(--serif);
  }

  .field-home-tools[open] summary::after {
    content: "−";
  }

  .field-home-tools summary:focus-visible {
    outline: 2px solid var(--ink);
    outline-offset: 3px;
  }

  .field-home-tools-body {
    display: grid;
    gap: 0.55rem;
    padding: 0 0 0.7rem;
  }

  .field-home-secondary-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  .field-home-secondary-actions button {
    min-width: 0;
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    border: 1px solid #132f2766;
    border-radius: 3px;
    background: transparent;
    cursor: pointer;
  }

  .field-home-secondary-actions button:hover,
  .field-home-secondary-actions button:focus-visible {
    border-color: var(--ink);
    background: #e7eeea;
  }

  .field-home-secondary-actions svg {
    width: 24px;
    height: 24px;
  }

  .field-home-more {
    min-height: 50px;
    margin: 0.55rem auto 0;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.82rem;
    text-decoration: none;
    cursor: pointer;
  }

  .field-home-more:hover,
  .field-home-more:focus-visible {
    text-decoration: underline;
  }

  .field-home-status {
    margin: 0;
    color: var(--rust);
    font-size: 0.7rem;
    line-height: 1.4;
    text-align: center;
  }

  .field-home-preview {
    display: none;
    border-top: 1px solid #132f2730;
    background: #dce8e2;
    color: var(--ink);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 62px;
    align-items: center;
    gap: 1rem;
    padding: 1.15rem max(1.25rem, env(safe-area-inset-right)) 1.15rem
      max(1.25rem, env(safe-area-inset-left));
    text-decoration: none;
  }

  .field-home-preview strong,
  .field-home-preview small {
    display: block;
  }

  .field-home-preview strong {
    font: 400 1.75rem / 1 var(--serif);
  }

  .field-home-preview small {
    margin-top: 0.35rem;
    max-width: 31ch;
    color: #132f27bd;
    font-size: 0.68rem;
    line-height: 1.4;
  }

  .field-home-preview > svg {
    width: 50px;
    height: 50px;
    justify-self: end;
    color: var(--sea);
  }

  .field-home-preview:hover,
  .field-home-preview:focus-visible {
    background: #cfded7;
  }

  .field-home-preview {
    display: none !important;
  }

  body.field-home-current .location-hud,
  body.field-home-current .field-dock-state {
    display: none !important;
  }

  /* The field screen already has a full-width search box. Keeping the second
     header search icon made the first viewport ask the same question twice. */
  body.field-home-current .header-search {
    display: none;
  }

  /* Tracking remains an always-on engine, while "På tur" is the one-tap view
     into the live journey, route and sharing controls. Keep four primary
     choices in the dock; help stays available from the contextual recovery
     flows instead of displacing the journey users actually came for. */
  #field-dock.field-dock:has(#field-hike) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  #field-dock #field-hike {
    display: grid;
  }

  #field-dock #field-help {
    display: none;
  }

  /* The live home card already changes to the useful place nearby, while the
     matching OS notification remains available. Do not duplicate it with a
     large nine-second overlay across the first outdoor decision screen. */
  body.field-home-current .proximity-toast {
    display: none !important;
  }

  .mood-strip {
    display: none !important;
  }

  .nearby {
    display: none;
    padding: 1.5rem max(1.25rem, env(safe-area-inset-right)) 1.75rem
      max(1.25rem, env(safe-area-inset-left));
    background: #dce8e2;
    color: var(--ink);
    overflow: visible;
  }

  .nearby::before,
  .nearby-intro,
  .radar-art {
    display: none;
  }

  .nearby-panel {
    min-height: 0;
    padding: 0;
    background: transparent;
    color: var(--ink);
  }

  .location-start {
    min-height: 0;
    padding: 0;
  }

  .location-start h3 {
    margin: 0 0 0.8rem;
    font: 400 2rem / 1 var(--serif);
  }

  .location-start .location-button {
    width: 100%;
    min-height: 54px;
    justify-content: center;
    border-color: var(--ink);
    background: var(--ink);
    color: var(--white);
  }

  .location-start .location-status {
    margin: 0.75rem 0 0;
    font-size: 0.7rem;
  }

  .manual-fallback {
    margin-top: 0.75rem;
    border-top-color: #132f2730;
  }

  .proximity-alert-control {
    margin-top: 1rem;
    border-color: #132f2730;
    background: #edf2ed;
  }

  .atlas.atlas-mobile-idle .atlas-result-head,
  .atlas.atlas-mobile-idle .atlas-grid,
  .atlas.atlas-mobile-idle .atlas-more,
  .atlas.atlas-mobile-idle .atlas-method {
    display: none !important;
  }

  .island-map-section.map-app,
  .atlas {
    display: none;
  }

  .nearby:target,
  .island-map-section.map-app:target,
  body.mobile-guide-expanded .atlas {
    display: block;
  }

  body:has(.island-map-section.map-app:target) .proximity-toast {
    display: none !important;
  }

  body:not(.mobile-guide-expanded) #plan,
  body:not(.mobile-guide-expanded) #hidden-gems,
  body:not(.mobile-guide-expanded) #quiet-gems,
  body:not(.mobile-guide-expanded) #omraader,
  body:not(.mobile-guide-expanded) #steder,
  body:not(.mobile-guide-expanded) .season-note,
  body:not(.mobile-guide-expanded) #praktisk,
  body:not(.mobile-guide-expanded) #om-guiden,
  body:not(.mobile-guide-expanded) footer {
    display: none !important;
  }

  .field-dock {
    width: 100%;
    max-width: none;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 69px;
    padding-bottom: env(safe-area-inset-bottom);
  }

  .field-dock a,
  .field-dock button {
    min-height: 69px;
  }

  .field-dock a > span,
  .field-dock button > span {
    display: grid;
    place-items: center;
    min-height: 25px;
  }

  .field-dock svg {
    width: 23px;
    height: 23px;
  }

  #field-dock.field-dock:has(#field-hike) strong {
    font-size: 0.68rem;
    line-height: 1.1;
    letter-spacing: 0.035em;
  }

  #field-dock a[aria-current="location"] {
    background: var(--ink);
    color: var(--lime);
    box-shadow: inset 0 -3px 0 var(--lime);
  }

  #field-dock.field-dock.field-results-ready
    > #field-results:not([aria-current="location"]) {
    background: #244b4e;
    color: #fff;
    box-shadow: none;
  }

  #field-dock a[aria-current="location"] strong {
    color: inherit;
  }

  .field-dock #field-help {
    background: #244b4e;
  }

  .field-dock #field-help:hover,
  .field-dock #field-help:focus-visible {
    background: var(--rust);
  }

  #field-dock #field-hike.active {
    background: #244b4e;
    color: #fff;
  }

  body.hike-mode-open #field-dock #field-hike.active {
    background: var(--lime);
    color: var(--ink);
    box-shadow: inset 0 -3px 0 var(--ink);
  }

  .saved-hud,
  .location-hud {
    bottom: calc(78px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 359px) {
  .field-home-main {
    padding-inline: 14px;
  }

  .field-home h1 {
    font-size: 2.2rem;
  }

  .field-home-quick {
    gap: 5px;
  }

  .field-home-quick button {
    min-height: 62px;
    gap: 0.08rem 0.45rem;
    padding-inline: 0.55rem;
    font-size: 0.72rem;
  }

  .field-home-quick svg {
    width: 23px;
    height: 23px;
  }

  .field-home-horizon {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 0.55rem;
    padding-inline: 0.55rem;
  }

  .field-home-horizon-mark {
    width: 30px;
    height: 30px;
  }

  .field-home-tools summary small {
    display: none;
  }
}

@media (max-width: 760px) and (max-height: 720px) and (orientation: portrait) {
  .field-home-main {
    gap: 0.55rem;
    padding-top: 0.7rem;
  }

  .field-home-context {
    padding-bottom: 0.5rem;
  }

  .field-home h1 {
    font-size: clamp(2rem, 9vw, 2.55rem);
  }

  .field-home-primary,
  .field-home.is-live .field-home-primary {
    min-height: 60px;
  }

  .field-home-quick button,
  .field-home.is-live .field-home-quick button {
    min-height: 58px;
  }

  .field-home-horizon {
    min-height: 58px;
    padding-block: 0.5rem;
  }
}

@media (max-width: 760px) and (max-height: 620px) and (orientation: portrait) {
  .field-home {
    min-height: calc(100dvh - 75px - env(safe-area-inset-bottom));
  }

  .field-home-context-label {
    display: none;
  }

  .field-home-tools summary {
    min-height: 44px;
  }
}

@media (max-width:940px) and (max-height:500px) and (orientation: landscape) {
  html {
    scroll-padding-top: calc(60px + env(safe-area-inset-top));
  }

  body {
    padding-bottom: calc(69px + env(safe-area-inset-bottom));
  }

  .site-header,
  .site-header.scrolled,
  .site-header.open {
    height: calc(60px + env(safe-area-inset-top));
    padding: env(safe-area-inset-top)
      max(1.25rem, env(safe-area-inset-right)) 0
      max(1.25rem, env(safe-area-inset-left));
  }

  .site-header nav {
    display: none;
  }

  .menu-button {
    display: block;
    min-width: 56px;
    min-height: 48px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 999px;
  }

  .site-header.open nav {
    position: fixed;
    top: calc(60px + env(safe-area-inset-top));
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-content: start;
    overflow-y: auto;
    background: var(--ink);
    padding: 1rem max(1.25rem, env(safe-area-inset-right))
      calc(1rem + env(safe-area-inset-bottom))
      max(1.25rem, env(safe-area-inset-left));
  }

  .site-header.open nav a {
    display: flex;
    align-items: center;
    min-height: 48px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  .field-home {
    display: none;
  }

  .hero,
  .mood-strip,
  .atlas,
  .nearby,
  #plan,
  #hidden-gems,
  #quiet-gems,
  #omraader,
  #steder,
  .season-note,
  #praktisk,
  #om-guiden,
  footer {
    display: none !important;
  }

  .island-map-section.map-app {
    display: block;
    margin-top: calc(60px + env(safe-area-inset-top));
  }
}

@media (max-width: 760px), (max-width:940px) and (max-height:500px) and (orientation: landscape) {
  body.mobile-map-visible #field-dock.field-dock {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media print {
  .field-home {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .field-home.is-locating .field-home-context-dot {
    animation: none;
  }
}