/* Production bridge for the approved v17 home/equipment composition. */
@import url('./aligned-shell.css');
@import url('./spec-region.css');
@import url('./home-cards.css');
@import url('./spec-equipment.css');
.app.aligned{position:fixed;inset:0;height:100dvh;min-height:0;border:0;border-radius:0;margin:auto;color:var(--ink);background:#dfedf7 url('./assets/explore-background-v05.webp') center top/100% 100% no-repeat;overflow:hidden}
.aligned #topbar{display:none}
.app.aligned #screen{height:100%;min-height:0;padding:calc(88px + env(safe-area-inset-top,0px)) 0 calc(120px + env(safe-area-inset-bottom,0px));scroll-padding:100px 0 120px;overflow:auto;overflow-x:hidden;overscroll-behavior-y:contain}
.aligned .corner-layer{inset:var(--shell-safe-top) 0 0}
.aligned .corner-menu summary{position:relative;cursor:pointer;list-style:none;touch-action:manipulation}.aligned .corner-menu summary::-webkit-details-marker{display:none}
.aligned .corner-menu nav{position:absolute;width:180px;padding:10px;border-radius:22px 8px 22px 22px;background:var(--surface);color:var(--ink);border:1px solid white}
.aligned .corner-menu nav button{display:flex;width:100%;min-height:48px;align-items:center;gap:12px;padding:10px 12px;text-align:left;border-radius:12px;font-size:14px}
.aligned .corner-menu nav button[aria-current=page]{background:#e4ebf3;color:var(--brand-blue)}.aligned .corner-menu nav svg{width:20px;height:20px}
.aligned .corner-menu[open] summary{background:#1c18551c}
.aligned .round-button{border-radius:50%;display:grid;place-items:center;min-height:44px}
.aligned .preview-title{font-size:12px;font-weight:550;letter-spacing:.06em;text-align:center;line-height:20px;color:white;margin:0 80px 14px}
.aligned .app-search{display:flex;align-items:center;gap:9px;padding:0 11px}
.aligned .app-search input{width:100%;min-width:0;background:transparent;border:0;color:white;padding:12px 0;font-size:14px}
.aligned .app-search button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:0 2px}.aligned .app-search svg{width:19px}
.aligned .region-frame{height:auto}
.aligned .milk-panel{position:relative;color:var(--ink)}
.aligned .milk-panel:before,.aligned .milk-panel:after{content:"";position:absolute;left:0;right:0}
.aligned .panel-caption{display:flex;align-items:center;justify-content:space-between;font-size:13px}.aligned .panel-caption h2{font-size:15px;font-weight:650;letter-spacing:0}
.aligned .quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.aligned .soft-key{display:flex;flex-direction:column;align-items:center;gap:12px;padding:0;min-width:0;text-align:center;font-size:12px;font-weight:500}
.aligned .soft-key>span:first-child{position:relative;width:64px;height:64px;min-height:58px;display:grid;place-items:center;border-radius:22px;background:linear-gradient(140deg,#fffefa,#e7eaf0);box-shadow:9px 12px 21px #183b5629,-5px -5px 13px #fff,inset 1px 1px 1px #fff,inset -1px -2px 2px #183b561c;border:1px solid #ffffffc4}
.aligned .soft-key svg{width:29px;height:29px;filter:drop-shadow(1px 2px 0 #fff) drop-shadow(2px 4px 2px #183b5633);stroke-width:2.15;color:var(--brand-indigo)}
.aligned .soft-key>span.amber{background:linear-gradient(140deg,#fffaf0,#eee7d1)}.aligned .soft-key .amber svg{color:#87671c}
.aligned .soft-key>span.green{background:linear-gradient(140deg,#f4fff9,#dbe8e4)}.aligned .soft-key .green svg{color:var(--success)}
.aligned .soft-key>span.blue{background:linear-gradient(140deg,#f5faff,#dce6f1)}.aligned .soft-key .blue svg{color:var(--brand-blue)}
.aligned .soft-key:active>span:first-child{box-shadow:inset 4px 4px 7px #183b562b,inset -2px -2px 4px #ffffff91;transform:translateY(2px)}
.aligned .home-news-link{display:flex;align-items:center;gap:12px;padding:18px 1px 0;margin-top:20px;border-top:1px solid var(--line);text-align:left;width:100%;font-size:14px;min-height:64px}
.aligned .home-news-link>span{flex:1}.aligned .home-news-link small{display:block;font-size:11px;color:var(--muted)}
.aligned #home-news{margin-top:30px}.aligned #home-news h2{font-size:15px}.aligned #home-news h3{font-size:14px;font-weight:550}
.aligned .equipment-stamp{justify-content:space-between}.aligned .equipment-stamp time{font-size:11px}
.aligned .equipment-stamp button{width:44px;min-height:44px;border-radius:15px;color:var(--accent);border:1px solid #8fb8d680;background:#195a9666;box-shadow:inset 1px 1px 1px #fff4,3px 4px 7px #103f7159;display:grid;place-items:center}
.aligned .equipment-headline h2{font-size:27px;line-height:1.4;max-width:230px;letter-spacing:-.025em;flex:1;font-weight:600}
.aligned .equipment-section-title h2{font-size:16px;letter-spacing:.02em;font-weight:600}
.aligned .equipment-detail{padding-left:0;line-height:1.75}.aligned .equipment-detail dl{font-size:11px;margin:12px 0 0}.aligned .equipment-detail dl>div{display:flex;gap:8px;flex-wrap:wrap}.aligned .equipment-detail dd{margin:0 0 0 auto}
.aligned .equipment-badge[data-state=reachable]{color:#20604e}.aligned .equipment-badge[data-state=pending]{color:#866018}.aligned .equipment-badge[data-state=unreachable]{color:#9e3a28}
.aligned .equipment-events li{grid-template-columns:1fr;gap:4px}.aligned .equipment-events p{padding-left:14px}
.aligned .eq-method{line-height:1.8}.aligned .eq-method summary{min-height:48px}
@media(max-width:350px){.aligned .soft-key>span:first-child{width:58px;height:58px}.aligned .equipment-headline h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){.aligned .soft-key:active>span:first-child{transform:none}.aligned *{scroll-behavior:auto!important}}

/* Match the approved four independent corners: safe-area offsets position
   controls only. Never paint a full-width bar across the central opening. */
/* A fixed, opaque app lets iOS use the same light blue for its native status area
   and prevents the native scroll-edge blur over the independent upper curves. */
html:has(.app.aligned),body:has(.app.aligned){background:#dfedf7}
.app.aligned{--shell-safe-top:env(safe-area-inset-top,0px);--shell-safe-bottom:env(safe-area-inset-bottom,0px)}
.aligned .corner-layer{--bottom-fill:linear-gradient(180deg,#3885bd,#195a96);--bottom-ink:#fff;--bottom-active:var(--accent);--bottom-rim:#f2f8ff;--bottom-shadow:#123d6559}
.aligned #screen:is([data-view=tools],[data-view=news])+.corner-layer{--bottom-fill:linear-gradient(180deg,#3885bd,#195a96);--bottom-ink:#fff;--bottom-active:var(--accent);--bottom-rim:#f2f8ff;--bottom-shadow:#101a4070}
/* The iPhone status/Dynamic Island area is intentionally retained above the
   four corners. There is no corresponding full-width footer strip. */
.aligned .corner-layer:before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--shell-safe-top);background:#dfedf7;pointer-events:none}
/* Keep the corner material attached to the physical page edge. Reserve the
   Home-indicator inset inside each corner; do not lift the entire shape. */
.aligned .corner-layer [data-corner^=bottom]{height:calc(76px + var(--shell-safe-bottom))}
.aligned .corner-layer [data-corner^=bottom]:before{height:100%}
.aligned .corner-layer [data-corner=top-left]:before,.aligned .corner-layer [data-corner=top-right] summary:before{background:linear-gradient(180deg,#dfedf7,#bbd3e7 60%,#9ebed8)}
.aligned .corner-layer [data-corner=top-left],.aligned .corner-layer [data-corner=top-right] summary{color:#173e59}
.aligned .corner-layer [data-corner=top-left][aria-current=page]{color:#195a96}

/* The straight upper shelf ends at 100/166 of each 44cqw contour.
   Center all four controls on that responsive column, not a fixed 32px inset. */
.aligned .corner-layer{--corner-control-width:max(88px,26.5cqw)}
.aligned .corner-layer .corner-button,.aligned .corner-layer .corner-menu{width:var(--corner-control-width)}
.aligned .corner-layer .corner-button,.aligned .corner-layer .corner-menu summary{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center}
.aligned .corner-layer [data-corner=top-left],.aligned .corner-layer [data-corner=top-right] summary{padding:0 0 15px}
.aligned .corner-layer [data-corner^=bottom]{padding:10px 0 var(--shell-safe-bottom)}
.aligned .corner-layer .corner-button>svg,.aligned .corner-layer .corner-menu summary>svg{position:static;flex:none}
.aligned .corner-layer .corner-button[aria-current=page]:after{left:calc(50% - 2px);right:auto}
.aligned .corner-layer [data-corner=top-left][aria-current=page]:after{top:49px;bottom:auto}
.aligned .corner-layer [data-corner^=bottom][aria-current=page]:after{bottom:calc(11px + var(--shell-safe-bottom))}

/* Each lower corner has its own deep-blue material and contour shadow.
   Keep the center transparent; never join the shapes with a footer bar. */
.aligned .corner-layer .corner-button,.aligned .corner-layer .corner-menu summary{filter:none}
.aligned .corner-layer [data-corner^=bottom]{filter:drop-shadow(0 -1px 0 var(--bottom-rim)) drop-shadow(0 -3px 4px var(--bottom-shadow))}
.aligned .corner-layer .round-button{box-shadow:inset 0 1px 0 #ffffff70,inset 0 -1px 0 #123d6540,0 1px 2px #103f7130}
.aligned .corner-layer .corner-button svg,.aligned .corner-layer .corner-menu summary svg{filter:none}


.aligned .tool-workflows{margin-top:30px}.aligned .tool-workflows h2{font-size:16px}.aligned .workflow-tool{display:flex;align-items:center;gap:12px;text-align:left;width:100%;min-height:78px;padding:15px 0;border-bottom:1px solid var(--line)}
.aligned .workflow-tool>svg{width:24px;height:24px;flex-shrink:0;color:var(--brand-blue)}.aligned .workflow-tool>span{flex:1;min-width:0}.aligned .workflow-tool strong{font-size:14px;display:block}.aligned .workflow-tool small{font-size:11px;color:var(--muted);display:block;margin-top:4px}.aligned .tool-workflows>.secondary{margin-top:20px}

.home-workflow-grid{margin-top:18px}.pagination>.secondary{min-width:48px;width:52px;padding:12px;display:grid;place-items:center}.pagination>.secondary svg{width:23px;height:23px}


.aligned .file-controls-slot{height:0;overflow:hidden;transition:height 360ms cubic-bezier(.22,.72,.18,1)}
.aligned .file-controls{display:flow-root;padding-bottom:12px}
.aligned .file-sheet{z-index:1}
.aligned .file-disclosure{position:absolute;top:-38px;left:50%;transform:translateX(-50%);display:grid;place-items:center;min-width:48px;min-height:44px;padding:10px;color:var(--brand-blue);border-radius:50%;background:var(--sheet)}
.aligned .file-disclosure svg{width:15px;height:15px;fill:currentColor;stroke-width:1.5;transform:rotate(180deg);transition:transform 360ms cubic-bezier(.22,.72,.18,1)}
.aligned .file-disclosure[aria-expanded=true] svg{transform:rotate(0)}
@media(prefers-reduced-motion:reduce){.aligned .file-controls-slot,.aligned .file-disclosure svg{transition:none}}

/* Business shortcuts use the same light materials as the first six keys. */
.aligned .soft-key>span.violet{background:linear-gradient(140deg,#fbf7ff,#e6def2)}

/* Home news belongs directly below the carousel, on the blue background. */
.aligned #home-news{margin:6px 24px 30px;color:#fff}
.aligned #home-news .news-teaser{padding:14px 16px 8px;border:1px solid #ffffff45;border-radius:22px;background:linear-gradient(135deg,#164d8826,#30277544);box-shadow:inset 0 1px #ffffff12}
.aligned #home-news .section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0}
.aligned #home-news h2{font-size:12px;color:var(--accent);margin:0}
.aligned #home-news .text-button{color:#e4eefb;font-size:11px;min-height:32px;padding:0}
.aligned #home-news .text-button svg{width:15px;height:15px}
.aligned .home-blue{min-height:calc(var(--home-viewport,100dvh) - 88px - env(safe-area-inset-top,0px) + 16px);padding-bottom:88px;display:flex;flex-direction:column;box-sizing:border-box}
.aligned #home-news .home-news-carousel{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;border-radius:22px}
.aligned #home-news .home-news-carousel::-webkit-scrollbar{display:none}
.aligned #home-news .news-teaser{flex:0 0 100%;min-width:0;box-sizing:border-box;margin-right:18px;scroll-snap-align:start}
.aligned #home-news .home-news-carousel:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.aligned #home-news .home-headline{display:block;min-width:0;color:#fff;text-decoration:none;padding:4px 0 12px}
.aligned #home-news .home-headline h3{font-size:14px;line-height:1.65;font-weight:550;margin:0}
.aligned #home-news .home-headline p{font-size:10px;line-height:1.5;color:#dbe7f7;margin:0}
.aligned #home-news .news-warning{font-size:11px;padding:8px 10px;margin:6px 0}
.aligned #home-news .home-headline p svg{width:12px;height:12px;vertical-align:middle}

.aligned #home-news .news-track{display:flex;align-items:stretch}
.aligned #home-news .home-news-carousel.is-loop{overflow:hidden;scroll-snap-type:none;touch-action:pan-y pinch-zoom}
.aligned #home-news .home-news-carousel.is-loop .news-track{touch-action:pan-y pinch-zoom}

.aligned #home-news .home-headline .home-news-meta{margin:0 0 7px}

/* In-flow shortcut in the reserved home area; the tool grid remains below. */
.aligned .home-tools-jump{align-self:center;display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px 22px;margin:auto 0 0;border:1px solid #ffffff65;border-radius:24px;color:#173e59;background:linear-gradient(145deg,#fff1a0,var(--accent));box-shadow:inset 0 1px #fff8,0 4px 10px #100b3d44;font-size:14px;font-weight:600}
.aligned .home-tools-jump svg{width:20px;height:20px}.aligned .home-tools-jump:active{transform:translateY(1px)}
.aligned #home-tools:focus{outline:none}.aligned .home-tools-jump:focus-visible{outline:2px solid white;outline-offset:4px}

.aligned .tool-title{display:flex;align-items:center;justify-content:center;gap:9px;width:fit-content;max-width:100%;min-height:42px;margin:0 auto 24px;padding:8px 20px;border:1px solid #c6d7e5;border-radius:22px;background:linear-gradient(145deg,#f6fbff,#dce9f4);box-shadow:inset 0 1px #fff,0 3px 7px #183b5618;color:var(--ink);font-size:16px;line-height:1.5;font-weight:600;letter-spacing:0}
.aligned .tool-title svg{width:20px;height:20px;flex:none;color:var(--brand-blue)}
/* Keep enough scroll range to place the tool grid below the fixed corners,
   even when all nine tools fit on a tall screen. */
.aligned #home-tools{min-height:calc(var(--home-viewport,100dvh) - var(--reading-top,82px));box-sizing:border-box}
