/* Shared base primitives. Brand tokens in this block are deployment contracts. */
:root {
    color-scheme: light;
    --brand-primary: #5b7fff;
    --brand-cyan: #00afef;
    --brand-deep-blue: #1089b8;
    --ink: #14273d;
    --muted: #53677c;
    --dim: #647989;
    --line: rgba(28, 79, 118, .15);
    --panel: rgba(255, 255, 255, .9);
    --panel-strong: #ffffff;
    --cyan: var(--cyan-bright);
    --cyan-bright: #087da8;
    --blue: var(--brand-primary);
    --sand: #a66f22;
    --danger: #b83e4c;
    --success: #197657;
    --shadow: 0 24px 70px rgba(31, 67, 99, .13);
    --radius: 24px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    color: var(--ink);
    background:
        radial-gradient(circle at 77% 17%, rgba(0, 175, 239, .1), transparent 29rem),
        radial-gradient(circle at 10% 88%, rgba(91, 127, 255, .08), transparent 34rem),
        linear-gradient(145deg, #fbfdff 0%, #f1f6fa 52%, #f8fbfd 100%);
    font-family: "Segoe UI Variable Text", "Segoe UI", Arial, sans-serif;
    line-height: 1.5;
}

button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
.hidden { display: none !important; }

.ambient { position: fixed; z-index: -2; border-radius: 50%; filter: blur(1px); pointer-events: none; }
.ambient-one { width: 34rem; height: 34rem; right: -11rem; top: -13rem; border: 1px solid rgba(0, 175, 239, .12); box-shadow: inset 0 0 120px rgba(91, 127, 255, .06); }
.ambient-two { width: 26rem; height: 26rem; left: -13rem; bottom: -9rem; background: rgba(91, 127, 255, .055); }
.grain { position: fixed; inset: 0; z-index: -1; opacity: .045; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E"); }

.site-header {
    width: min(1440px, calc(100% - 48px));
    min-height: 86px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--line);
}
.brand { display: inline-flex; align-items: center; gap: 13px; letter-spacing: .14em; }
.brand strong { display: block; color: #152d48; font-size: .91rem; font-weight: 760; }
.brand small { display: block; margin-top: 2px; color: var(--brand-primary); font-size: .5rem; font-weight: 650; letter-spacing: .18em; }
.brand-mark { position: relative; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(91, 127, 255, .28); border-radius: 13px; background: linear-gradient(145deg, rgba(91, 127, 255, .1), rgba(0, 175, 239, .05)); }
.brand-mark img { display: block; width: 38px; height: auto; filter: drop-shadow(0 7px 10px rgba(30, 81, 119, .2)); }
.header-actions { display: flex; align-items: center; gap: 10px; }
.secure-pill { display: flex; align-items: center; gap: 8px; padding: 8px 12px; color: var(--muted); border: 1px solid var(--line); border-radius: 99px; font-size: .72rem; }
.secure-pill i, .build-state i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px rgba(25, 118, 87, .1); }
.language-button, .ghost-button, .text-button { cursor: pointer; border: 0; background: transparent; }
.language-button { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; color: var(--cyan-bright); font-size: .72rem; font-weight: 700; }
.ghost-button { padding: 9px 13px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); font-size: .78rem; }

main { width: min(1440px, calc(100% - 48px)); margin: 0 auto; }
.glass-panel { border: 1px solid var(--line); background: linear-gradient(145deg, rgba(255, 255, 255, .97), rgba(246, 250, 253, .9)); box-shadow: var(--shadow); backdrop-filter: blur(24px); }
.auth-view { min-height: calc(100vh - 88px); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(360px, .63fr); gap: clamp(3rem, 9vw, 9rem); align-items: center; padding: 4rem clamp(0px, 3vw, 3rem) 6rem; }
.auth-story { position: relative; max-width: 760px; }
.eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; color: var(--cyan); font-size: .68rem; font-weight: 700; letter-spacing: .22em; }
.eyebrow > span:first-child { width: 36px; height: 1px; background: var(--cyan); box-shadow: 0 0 12px rgba(0, 175, 239, .5); }
.auth-story h1, .welcome-card h1 { margin: 0; font-family: "Segoe UI Variable Display", "Segoe UI", Arial, sans-serif; font-weight: 350; line-height: .98; letter-spacing: -.045em; }
.auth-story h1 { font-size: clamp(3.6rem, 7vw, 7.3rem); }
.auth-story h1 em, .welcome-card h1 em { color: var(--brand-primary); font-style: normal; }
.auth-story > p { max-width: 620px; margin: 30px 0 34px; color: var(--muted); font-size: clamp(.96rem, 1.4vw, 1.12rem); }
.story-metrics { display: flex; flex-wrap: wrap; gap: 34px; }
.story-metrics > div { display: grid; gap: 1px; }
.story-metrics strong { font-size: .9rem; color: #25425f; letter-spacing: .02em; }
.story-metrics span { color: var(--dim); font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; }
.bathymetry { position: relative; width: 80%; height: 132px; margin-top: 50px; opacity: .55; overflow: hidden; }
.bathymetry span { position: absolute; left: -7%; width: 112%; height: 65px; border-top: 1px solid rgba(0, 175, 239, .25); border-radius: 50%; transform: rotate(-3deg); }
.bathymetry span:nth-child(1) { top: 12px; }
.bathymetry span:nth-child(2) { top: 31px; left: -1%; }
.bathymetry span:nth-child(3) { top: 50px; left: 3%; }
.bathymetry span:nth-child(4) { top: 70px; left: 9%; }
.bathymetry span:nth-child(5) { top: 91px; left: 15%; }
.bathymetry b { position: absolute; color: rgba(41, 105, 146, .68); font-size: .56rem; font-weight: 500; letter-spacing: .08em; }
.bathymetry b:nth-of-type(1) { top: 4px; right: 5%; }.bathymetry b:nth-of-type(2) { top: 48px; right: 25%; }.bathymetry b:nth-of-type(3) { top: 88px; right: 47%; }

.login-panel { position: relative; width: 100%; max-width: 455px; justify-self: end; padding: clamp(30px, 4vw, 48px); border-radius: 30px; }
.login-panel::before { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; background: linear-gradient(135deg, rgba(91, 127, 255, .09), transparent 38%); }
.panel-icon, .dialog-mark { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(0, 175, 239, .2); border-radius: 14px; color: var(--cyan); background: rgba(0, 175, 239, .07); }
.kicker, .section-label { margin: 23px 0 8px; color: var(--cyan); font-size: .63rem; font-weight: 720; letter-spacing: .2em; }
.login-panel h2, .pair-dialog h2 { margin: 0; font-family: "Segoe UI Variable Display", "Segoe UI", Arial, sans-serif; font-size: clamp(1.9rem, 3vw, 2.55rem); font-weight: 420; letter-spacing: -.025em; }
.panel-copy { margin: 12px 0 28px; color: var(--muted); font-size: .85rem; }
label { display: block; margin: 17px 0 7px; color: #3f566d; font-size: .72rem; font-weight: 620; letter-spacing: .04em; }
.input-wrap { height: 51px; display: flex; align-items: center; gap: 10px; padding: 0 13px; border: 1px solid rgba(36, 91, 132, .2); border-radius: 12px; background: rgba(248, 251, 253, .96); transition: .2s ease; }
.input-wrap:focus-within { border-color: rgba(0, 175, 239, .65); box-shadow: 0 0 0 3px rgba(0, 175, 239, .09); }
.input-wrap > span { color: var(--dim); }
.input-wrap input { min-width: 0; flex: 1; height: 100%; color: var(--ink); border: 0; outline: 0; background: transparent; }
.reveal-button { cursor: pointer; border: 0; background: transparent; color: var(--muted); font-size: .68rem; }
.form-error { min-height: 20px; margin: 8px 0 0; color: var(--danger); font-size: .72rem; }
.primary-button, .secondary-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 18px; cursor: pointer; border-radius: 12px; font-size: .78rem; font-weight: 700; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.primary-button { color: #fff; border: 1px solid #315d9a; background: linear-gradient(110deg, #315d9a, #087da8); box-shadow: 0 12px 30px rgba(49, 93, 154, .2); }
.primary-button:hover, .secondary-button:hover { transform: translateY(-2px); }
.primary-button:disabled { cursor: not-allowed; opacity: .45; transform: none; }
.secondary-button { color: #284966; border: 1px solid rgba(45, 94, 134, .24); background: rgba(255, 255, 255, .9); }
.wide { width: 100%; }
.trust-row { display: flex; gap: 9px; margin-top: 22px; padding-top: 19px; color: var(--dim); border-top: 1px solid var(--line); font-size: .67rem; }
.trust-row > span:first-child { color: var(--cyan); }
.login-video-link { min-height: 42px; margin-top: 14px; padding: 10px 12px; display: flex; align-items: center; gap: 9px; color: var(--ocean-dark); border: 1px solid rgba(8, 125, 168, .2); border-radius: 9px; background: rgba(0, 175, 239, .045); font-size: .72rem; font-weight: 700; text-decoration: none; }
.login-video-link:hover { border-color: rgba(8, 125, 168, .4); background: rgba(0, 175, 239, .085); }
.login-video-link b { margin-left: auto; font-size: .68rem; }

.dashboard { min-height: calc(100vh - 87px); display: grid; grid-template-columns: 205px minmax(0, 1fr); gap: 22px; padding: 28px 0 70px; }
.sidebar { position: sticky; top: 24px; height: calc(100vh - 52px); padding: 18px 12px; border-radius: 20px; display: flex; flex-direction: column; justify-content: space-between; }
.sidebar nav { display: grid; gap: 6px; }
.sidebar nav a { display: flex; align-items: center; gap: 12px; padding: 12px; color: var(--muted); border: 1px solid transparent; border-radius: 11px; font-size: .76rem; transition: .2s ease; }
.sidebar nav a span:first-child { width: 22px; color: var(--dim); text-align: center; }
.sidebar nav a:hover, .sidebar nav a.active { color: #173b5b; border-color: rgba(91, 127, 255, .2); background: rgba(91, 127, 255, .075); }
.sidebar nav a.active span:first-child { color: var(--cyan); }
.sidebar-foot { display: flex; align-items: center; gap: 10px; padding: 14px 10px 4px; border-top: 1px solid var(--line); }
.sidebar-foot strong, .sidebar-foot span { display: block; }.sidebar-foot strong { font-size: .7rem; }.sidebar-foot span { margin-top: 2px; color: var(--dim); font-size: .61rem; }
.pulse-orb { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid rgba(105, 229, 179, .16); border-radius: 50%; }.pulse-orb i { width: 6px; height: 6px; border-radius: 50%; background: var(--success); box-shadow: 0 0 11px var(--success); }
.dashboard-content { min-width: 0; }
.welcome-card { position: relative; min-height: 285px; padding: clamp(28px, 4vw, 48px); overflow: hidden; border-radius: var(--radius); display: flex; align-items: center; }
.welcome-card > div:first-child { position: relative; z-index: 2; max-width: 760px; }
.welcome-card h1 { font-size: clamp(2.3rem, 4vw, 4.6rem); }
.welcome-card p { max-width: 600px; margin: 20px 0 0; color: var(--muted); font-size: .88rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 27px; }
.radar { position: absolute; width: 310px; height: 310px; right: -45px; top: -15px; border: 1px solid rgba(91, 127, 255, .13); border-radius: 50%; opacity: .78; }
.radar i { position: absolute; inset: 17%; border: 1px solid rgba(0, 175, 239, .14); border-radius: 50%; }.radar i:nth-child(2) { inset: 34%; }.radar i:nth-child(3) { inset: 48%; }
.radar::before, .radar::after { content: ""; position: absolute; left: 50%; top: 0; width: 1px; height: 100%; background: rgba(91, 127, 255, .12); }.radar::after { transform: rotate(90deg); }
.radar span { position: absolute; inset: 50% 50% 0 50%; background: conic-gradient(from -23deg, rgba(0, 175, 239, .28), transparent 28deg); transform-origin: 0 0; animation: scan 7s linear infinite; }
.radar b { position: absolute; width: 7px; height: 7px; top: 29%; left: 64%; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 16px var(--cyan); }
@keyframes scan { to { transform: rotate(360deg); } }

.connector-strip { margin-top: 18px; padding: 20px 22px; border-radius: 18px; display: grid; grid-template-columns: auto minmax(220px, 1fr) auto auto; align-items: center; gap: 18px; }
.connector-glyph { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: var(--cyan); background: rgba(0, 175, 239, .07); border: 1px solid rgba(0, 175, 239, .16); }
.connector-copy .section-label { display: block; margin: 0 0 2px; }.connector-copy h2 { margin: 0; font-size: 1rem; }.connector-copy p { margin: 3px 0 0; color: var(--muted); font-size: .68rem; }
.connector-meta { display: flex; gap: 24px; padding: 0 21px; border-left: 1px solid var(--line); border-right: 1px solid var(--line); }.connector-meta > span { display: grid; gap: 2px; }.connector-meta small { color: var(--dim); font-size: .54rem; letter-spacing: .13em; }.connector-meta strong, .connector-meta code { color: #35516c; font-size: .66rem; font-family: inherit; }.connector-meta code { max-width: 130px; overflow: hidden; text-overflow: ellipsis; }
.build-state { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: .67rem; white-space: nowrap; }.build-state.unavailable i { background: var(--sand); box-shadow: 0 0 12px var(--sand); }
.connector-notice { margin-top: 12px; padding: 16px 18px; display: grid; grid-template-columns: auto minmax(200px, 1fr) auto; align-items: center; gap: 14px; border: 1px solid rgba(166, 111, 34, .24); border-radius: 16px; background: linear-gradient(135deg, #fffaf1, #ffffff); box-shadow: 0 14px 38px rgba(69, 77, 86, .09); }
.connector-notice[data-state="outdated"], .connector-notice[data-state="unknown"] { border-color: rgba(184, 62, 76, .22); background: linear-gradient(135deg, #fff6f7, #ffffff); }
.connector-notice-icon { width: 38px; height: 38px; display: grid; place-items: center; color: #ffffff; border-radius: 12px; background: var(--sand); box-shadow: 0 7px 18px rgba(166, 111, 34, .16); font-size: .9rem; font-weight: 800; }
.connector-notice[data-state="outdated"] .connector-notice-icon, .connector-notice[data-state="unknown"] .connector-notice-icon { background: var(--danger); box-shadow: 0 7px 18px rgba(184, 62, 76, .14); }
.connector-notice-copy { min-width: 0; }.connector-notice-copy strong { display: block; color: #65491f; font-size: .76rem; }.connector-notice[data-state="outdated"] .connector-notice-copy strong, .connector-notice[data-state="unknown"] .connector-notice-copy strong { color: #8d303b; }.connector-notice-copy p { max-width: 720px; margin: 3px 0 0; color: var(--muted); font-size: .66rem; }
.connector-notice-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }.connector-notice-actions .primary-button, .connector-notice-actions .secondary-button { min-height: 40px; gap: 14px; padding: 0 14px; font-size: .67rem; }

.section-heading { margin: 38px 2px 15px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.section-heading .section-label { display: block; margin: 0 0 3px; }.section-heading h2 { margin: 0; font-family: "Segoe UI Variable Display", "Segoe UI", Arial, sans-serif; font-size: 1.65rem; font-weight: 430; }.count-pill { padding: 7px 11px; color: var(--muted); border: 1px solid var(--line); border-radius: 99px; font-size: .65rem; }
.library-controls { display: flex; align-items: end; gap: 10px; }
.target-picker { display: grid; gap: 4px; color: var(--dim); font-size: .51rem; letter-spacing: .13em; }
.target-picker select { width: min(330px, 38vw); height: 34px; padding: 0 30px 0 10px; color: #294863; border: 1px solid rgba(45, 94, 134, .22); border-radius: 9px; outline: 0; background: #ffffff; font: 600 .62rem/1 "Segoe UI", Arial, sans-serif; letter-spacing: 0; }
.target-picker select:focus { border-color: rgba(0, 175, 239, .62); box-shadow: 0 0 0 2px rgba(0, 175, 239, .1); }.target-picker select:disabled { color: var(--dim); opacity: .7; }
.module-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.module-card, .skeleton-card { min-height: 340px; border: 1px solid var(--line); border-radius: 19px; background: linear-gradient(155deg, #ffffff, #f7fafc); box-shadow: 0 13px 35px rgba(31, 67, 99, .07); }
.skeleton-card { position: relative; overflow: hidden; }.skeleton-card::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(91, 127, 255, .08), transparent); animation: shimmer 1.5s infinite; } @keyframes shimmer { to { transform: translateX(100%); } }
.module-card { position: relative; padding: 22px; display: flex; flex-direction: column; overflow: hidden; transition: transform .2s ease, border-color .2s ease; }.module-card:hover { transform: translateY(-4px); border-color: rgba(0, 175, 239, .3); }
.module-card.module-card-disabled { border-color: rgba(184, 62, 76, .2); background: linear-gradient(155deg, #fffafa, #f8f4f5); }.module-card.module-card-disabled:hover { transform: none; border-color: rgba(184, 62, 76, .32); }
.module-card::before { content: ""; position: absolute; width: 180px; height: 180px; right: -70px; top: -85px; border-radius: 50%; background: rgba(0, 175, 239, .07); }.module-card[data-accent="blue"]::before { background: rgba(91, 127, 255, .1); }.module-card[data-accent="sand"]::before { background: rgba(232, 200, 144, .07); }
.module-top { display: flex; justify-content: space-between; align-items: start; gap: 12px; }.module-icon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(0, 175, 239, .18); border-radius: 15px; color: #087da8; background: rgba(0, 175, 239, .07); font-family: "Segoe UI", Arial, sans-serif; font-size: 1.2rem; }.module-badges { max-width: 180px; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }.license-badge, .module-state { padding: 6px 8px; border: 1px solid rgba(25, 118, 87, .17); border-radius: 99px; font-size: .54rem; text-transform: uppercase; letter-spacing: .08em; text-align: center; }.license-badge { color: var(--success); background: rgba(25, 118, 87, .055); }.module-state { color: var(--muted); border-color: var(--line); background: rgba(36, 78, 112, .045); }.module-state[data-state="absent"] { color: #66798c; }.module-state[data-state="update-available"] { color: #926218; border-color: rgba(166, 111, 34, .24); background: rgba(166, 111, 34, .07); }.module-state[data-state="up-to-date"] { color: var(--success); border-color: rgba(25, 118, 87, .2); background: rgba(25, 118, 87, .065); }.module-state[data-state="local-newer"] { color: #a45328; border-color: rgba(164, 83, 40, .22); background: rgba(164, 83, 40, .06); }.module-state[data-state="unknown"], .module-state[data-state="catalog-unavailable"] { color: var(--danger); border-color: rgba(184, 62, 76, .2); background: rgba(184, 62, 76, .055); }.module-state[data-state="catalog-feed-unavailable"] { color: #926218; border-color: rgba(166, 111, 34, .24); background: rgba(166, 111, 34, .07); }.module-state[data-state="catalog-ambiguous"] { color: var(--danger); border-color: rgba(184, 62, 76, .24); background: rgba(184, 62, 76, .07); }
.module-card h3 { margin: 20px 0 7px; font-size: 1.02rem; }.module-card > p { min-height: 42px; margin: 0; color: var(--muted); font-size: .7rem; }.module-details { display: flex; flex-wrap: wrap; gap: 12px 17px; margin-top: 17px; }.module-details span { min-width: 62px; display: grid; gap: 1px; }.module-details small { color: var(--dim); font-size: .52rem; letter-spacing: .1em; }.module-details strong { color: #405c76; font-size: .66rem; font-weight: 600; overflow-wrap: anywhere; }
.module-source { position: relative; margin-top: 12px; padding: 8px 10px 8px 25px; color: #4e667d; border: 1px solid rgba(42, 91, 130, .14); border-radius: 10px; background: rgba(239, 246, 250, .7); font-size: .64rem; line-height: 1.45; }.module-source::before { content: ""; position: absolute; left: 10px; top: 12px; width: 6px; height: 6px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px rgba(25, 118, 87, .1); }.module-source[data-kind="legacy-https-unsigned"] { color: #80591d; border-color: rgba(166, 111, 34, .2); background: rgba(166, 111, 34, .055); }.module-source[data-kind="legacy-https-unsigned"]::before { background: var(--sand); box-shadow: 0 0 0 3px rgba(166, 111, 34, .1); }.module-source[data-kind="catalog-feed-unavailable"] { color: #80591d; border-color: rgba(166, 111, 34, .2); background: rgba(166, 111, 34, .055); }.module-source[data-kind="catalog-feed-unavailable"]::before { background: var(--sand); box-shadow: 0 0 0 3px rgba(166, 111, 34, .1); }.module-source[data-kind="catalog-ambiguous"], .module-source[data-kind="catalog-unavailable"] { color: #9d3440; border-color: rgba(184, 62, 76, .2); background: rgba(184, 62, 76, .055); }.module-source[data-kind="catalog-ambiguous"]::before, .module-source[data-kind="catalog-unavailable"]::before { background: var(--danger); box-shadow: 0 0 0 3px rgba(184, 62, 76, .1); }
.module-actions { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; margin-top: auto; padding-top: 20px; }.module-actions button { min-width: 0; padding: 9px 4px; cursor: pointer; color: var(--muted); border: 1px solid var(--line); border-radius: 9px; background: #ffffff; font-size: .61rem; transition: .18s ease; }.module-actions button:hover { color: var(--cyan-bright); border-color: rgba(0, 175, 239, .32); }.module-actions button.primary-action { color: #fff; border-color: #315d9a; background: linear-gradient(110deg, #315d9a, #087da8); box-shadow: 0 7px 20px rgba(49, 93, 154, .13); }
.module-actions button:focus-visible { outline: 2px solid var(--cyan-bright); outline-offset: 2px; }
.module-actions button.danger-action:not(:disabled) { color: #9d3440; border-color: rgba(184, 62, 76, .22); background: rgba(184, 62, 76, .045); }.module-actions button.danger-action:not(:disabled):hover { color: #7f2732; border-color: rgba(184, 62, 76, .4); background: rgba(184, 62, 76, .08); }
.module-actions button:disabled, .module-actions button.primary-action:disabled { cursor: not-allowed; color: var(--dim); border-color: var(--line); background: #eef3f6; box-shadow: none; opacity: .62; }

.text-button { color: var(--cyan); font-size: .69rem; }.activity-panel { min-height: 120px; padding: 8px; border-radius: 18px; }.empty-state { min-height: 104px; display: grid; place-content: center; justify-items: center; color: var(--dim); }.empty-state span { color: var(--cyan); font-size: 1.5rem; }.empty-state p { margin: 4px; font-size: .73rem; }
.job-row { display: grid; grid-template-columns: 40px minmax(130px, 1fr) 110px minmax(110px, 1fr) 82px; gap: 13px; align-items: center; padding: 12px 13px; border-bottom: 1px solid var(--line); }.job-row:last-child { border-bottom: 0; }.job-symbol { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--cyan); background: rgba(0, 175, 239, .07); }.job-title strong, .job-title small { display: block; }.job-title strong { font-size: .7rem; }.job-title small { margin-top: 2px; color: var(--dim); font-size: .59rem; }.job-status { color: var(--muted); font-size: .64rem; text-transform: capitalize; }.progress { height: 4px; overflow: hidden; border-radius: 99px; background: rgba(91, 127, 255, .12); }.progress i { display: block; height: 100%; border-radius: inherit; background: var(--cyan); }.job-time { color: var(--dim); font-size: .58rem; text-align: right; }

.device-panel { min-height: 96px; padding: 8px; border-radius: 18px; }
.device-row { display: grid; grid-template-columns: 42px minmax(155px, 1fr) 135px minmax(160px, .8fr) auto; gap: 14px; align-items: center; padding: 13px; border-bottom: 1px solid var(--line); }
.device-row:last-child { border-bottom: 0; }
.device-icon { width: 38px; height: 38px; display: grid; place-items: center; color: var(--cyan); border: 1px solid rgba(0, 175, 239, .16); border-radius: 11px; background: rgba(0, 175, 239, .06); }
.device-identity { min-width: 0; }.device-identity strong, .device-identity small { display: block; }.device-identity strong { font-size: .72rem; }.device-identity small { margin-top: 3px; color: var(--dim); font: .57rem/1.2 ui-monospace, Consolas, monospace; letter-spacing: .05em; }
.device-status { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: .64rem; }.device-status::before { content: ""; width: 6px; height: 6px; flex: 0 0 auto; border-radius: 50%; background: var(--sand); box-shadow: 0 0 9px rgba(232, 200, 144, .5); }.device-status.active::before { background: var(--success); box-shadow: 0 0 9px rgba(105, 229, 179, .55); }
.device-identity .device-inventory { max-width: 440px; overflow: hidden; color: var(--muted); font-family: "Segoe UI", Arial, sans-serif; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }.device-status.outdated { color: #9d3440; }.device-status.outdated::before { background: var(--danger); box-shadow: 0 0 0 3px rgba(184, 62, 76, .1); }
.device-status.error { color: #9d3440; }.device-status.error::before { background: var(--danger); box-shadow: 0 0 0 3px rgba(184, 62, 76, .1); }
.orphan-cleanup-list { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin-top: 8px; }.device-identity .orphan-cleanup-list > small { flex-basis: 100%; color: #9d3440; }.orphan-cleanup-button { min-height: 28px; padding: 0 8px; cursor: pointer; color: #9d3440; border: 1px solid rgba(184, 62, 76, .22); border-radius: 8px; background: rgba(184, 62, 76, .045); font-size: .56rem; }.orphan-cleanup-button:hover { color: #7f2732; border-color: rgba(184, 62, 76, .4); background: rgba(184, 62, 76, .08); }.orphan-cleanup-button:disabled { cursor: not-allowed; opacity: .5; }
.device-time { color: var(--dim); font-size: .59rem; }
.revoke-button { min-height: 34px; padding: 0 11px; cursor: pointer; color: #9d3440; border: 1px solid rgba(184, 62, 76, .16); border-radius: 9px; background: rgba(184, 62, 76, .035); font-size: .61rem; transition: .18s ease; }.revoke-button:hover { color: #7f2732; border-color: rgba(184, 62, 76, .32); background: rgba(184, 62, 76, .07); }.revoke-button:disabled { cursor: wait; opacity: .5; }

.pair-dialog { width: min(460px, calc(100% - 32px)); padding: 36px; color: var(--ink); border: 1px solid rgba(45, 94, 134, .2); border-radius: 24px; background: #ffffff; box-shadow: 0 36px 100px rgba(28, 54, 79, .24); }.pair-dialog::backdrop { background: rgba(24, 44, 62, .38); backdrop-filter: blur(8px); }.pair-dialog .kicker { margin-top: 21px; }.pair-dialog > p:not(.kicker) { color: var(--muted); font-size: .78rem; }.pair-dialog input { width: 100%; height: 56px; padding: 0 16px; color: var(--ink); border: 1px solid rgba(45, 94, 134, .25); border-radius: 12px; outline: 0; background: #f7fafc; font: 700 1.15rem/1 ui-monospace, Consolas, monospace; letter-spacing: .22em; text-align: center; text-transform: uppercase; }.pair-dialog input:focus { border-color: var(--cyan); }.dialog-close-form { position: absolute; right: 17px; top: 13px; }.dialog-close-form button { cursor: pointer; color: var(--muted); border: 0; background: transparent; font-size: 1.4rem; }.dialog-note { display: flex; gap: 9px; margin-top: 19px; padding-top: 17px; color: var(--dim); border-top: 1px solid var(--line); font-size: .65rem; }.dialog-note span:first-child { color: var(--cyan); }
.toast { position: fixed; z-index: 20; left: 50%; bottom: 24px; max-width: calc(100% - 32px); padding: 11px 16px; color: #ffffff; border: 1px solid rgba(0, 175, 239, .22); border-radius: 12px; background: rgba(25, 57, 83, .97); box-shadow: var(--shadow); font-size: .72rem; opacity: 0; pointer-events: none; transform: translate(-50%, 16px); transition: .22s ease; }.toast.show { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 1080px) {
    .auth-view { grid-template-columns: 1fr 400px; gap: 3rem; }.auth-story h1 { font-size: clamp(3.3rem, 6.6vw, 5rem); }.module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.connector-strip { grid-template-columns: auto 1fr auto; }.connector-meta { display: none; }
}
@media (max-width: 780px) {
    .site-header, main { width: min(100% - 28px, 1440px); }.secure-pill { display: none; }.auth-view { min-height: auto; grid-template-columns: 1fr; gap: 34px; padding: 52px 0 70px; }.auth-story { text-align: center; }.auth-story .eyebrow { justify-content: center; }.auth-story h1 { font-size: clamp(3.2rem, 15vw, 5.2rem); }.auth-story > p { margin-inline: auto; }.story-metrics { justify-content: center; }.bathymetry { width: 100%; margin-top: 25px; }.login-panel { justify-self: center; }.dashboard { grid-template-columns: 1fr; padding-top: 16px; }.sidebar { position: static; width: 100%; height: auto; overflow-x: auto; padding: 7px; scrollbar-width: none; }.sidebar::-webkit-scrollbar { display: none; }.sidebar nav { display: flex; }.sidebar nav a { flex: 0 0 auto; }.sidebar-foot { display: none; }.radar { opacity: .42; }.module-grid { grid-template-columns: 1fr; }.connector-strip { grid-template-columns: auto 1fr; }.build-state { grid-column: 2; }.connector-notice { grid-template-columns: auto 1fr; }.connector-notice-actions { grid-column: 2; justify-content: flex-start; }.job-row { grid-template-columns: 36px 1fr auto; }.job-row .progress, .job-row .job-time { display: none; }.device-row { grid-template-columns: 40px minmax(130px, 1fr) auto; }.device-status { justify-self: end; }.device-time { grid-column: 2; }.revoke-button { grid-column: 3; grid-row: 2; }.target-picker select { width: min(300px, 42vw); }
}
@media (max-width: 470px) {
    .site-header { min-height: 74px; }.brand small { display: none; }.ghost-button { padding: 7px 9px; }.auth-story h1 { font-size: 3.35rem; }.story-metrics { gap: 18px; }.welcome-card { min-height: 340px; align-items: flex-end; }.welcome-card .eyebrow { max-width: 250px; }.radar { right: -100px; top: -72px; }.connector-strip { padding: 16px; }.connector-glyph { display: none; }.connector-strip { grid-template-columns: 1fr; }.build-state { grid-column: 1; }.connector-notice { grid-template-columns: 1fr; padding: 15px; }.connector-notice-icon { display: none; }.connector-notice-actions { grid-column: 1; justify-content: stretch; }.connector-notice-actions .primary-button, .connector-notice-actions .secondary-button { flex: 1 1 150px; }.section-heading h2 { font-size: 1.35rem; }.count-pill { display: none; }.library-controls { max-width: 55%; }.target-picker select { width: 100%; }.pair-dialog { padding: 28px 22px; }.device-row { grid-template-columns: 38px 1fr; gap: 9px 11px; }.device-status, .device-time, .revoke-button { grid-column: 2; justify-self: start; }.device-status { grid-row: 2; }.device-time { grid-row: 3; }.revoke-button { grid-row: 4; margin-top: 3px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/*
 * Hydrotam workbench theme.
 * This final cascade deliberately refines the shared auth/dialog primitives above
 * and owns every dashboard breakpoint. Keep product-specific layout changes here.
 */
:root {
    --workbench-bg: #f3f6f8;
    --surface: #ffffff;
    --surface-soft: #f7fafb;
    --navy: #0d2f46;
    --navy-soft: #173f59;
    --ocean: #087da8;
    --ocean-dark: #075d83;
    --aqua-soft: #eaf7fb;
    --border: #dce5ea;
    --border-strong: #cbd8df;
    --text: #102c40;
    --text-soft: #486273;
    --text-faint: #637887;
    --warning: #a56315;
    --warning-soft: #fff7e9;
    --success-soft: #eaf7f1;
    --danger-soft: #fff0f2;
    --workbench-shadow: 0 18px 48px rgba(18, 52, 73, .08);
}

body {
    background:
        linear-gradient(rgba(255, 255, 255, .72), rgba(255, 255, 255, .72)),
        radial-gradient(circle at 85% 10%, rgba(0, 175, 239, .11), transparent 34rem),
        var(--workbench-bg);
    font-size: 15px;
}

.ambient-one { border-color: rgba(0, 175, 239, .08); opacity: .7; }
.ambient-two, .grain { display: none; }
.site-header, main { width: min(1600px, calc(100% - 64px)); }
.site-header { min-height: 78px; border-bottom-color: var(--border); }
.brand { gap: 11px; }
.brand-mark {
    width: 42px;
    height: 42px;
    border-color: #d7e3e9;
    border-radius: 11px;
    background: #fff;
    box-shadow: 0 7px 20px rgba(16, 51, 73, .08);
}
.brand-mark img { width: 36px; filter: none; }
.brand strong { color: var(--navy); font-size: .88rem; letter-spacing: .12em; }
.brand small { color: var(--ocean); font-size: .48rem; }
.secure-pill { color: var(--text-soft); border-color: var(--border); background: rgba(255,255,255,.72); }
.language-button, .ghost-button { border-color: var(--border-strong); background: #fff; }
.language-button:hover, .ghost-button:hover { border-color: var(--ocean); color: var(--ocean-dark); }

.glass-panel { background: #fff; border-color: var(--border); box-shadow: var(--workbench-shadow); backdrop-filter: none; }
.primary-button, .secondary-button {
    min-height: 43px;
    gap: 18px;
    border-radius: 9px;
    font-size: .73rem;
    letter-spacing: .01em;
}
.primary-button {
    border-color: var(--ocean-dark);
    background: linear-gradient(112deg, var(--ocean-dark), var(--ocean));
    box-shadow: 0 9px 22px rgba(8, 109, 154, .18);
}
.primary-button:hover, .secondary-button:hover { transform: translateY(-1px); }
.secondary-button { color: var(--navy); border-color: var(--border-strong); background: #fff; }
.text-button, .icon-button { color: var(--ocean-dark); font-weight: 700; }
.text-button:hover, .icon-button:hover { color: var(--navy); }

/* Login */
.auth-view { gap: clamp(3rem, 8vw, 8rem); padding-block: 4.5rem 6rem; }
.auth-story { max-width: 730px; }
.auth-story h1 { color: var(--navy); font-size: clamp(3.4rem, 6.4vw, 6.6rem); }
.auth-story h1 em { color: var(--ocean); }
.story-metrics { gap: 0; border-block: 1px solid var(--border); }
.story-metrics > div { min-width: 180px; padding: 18px 26px 18px 0; }
.story-metrics > div + div { padding-left: 26px; border-left: 1px solid var(--border); }
.story-metrics strong { color: var(--navy); }
.bathymetry { opacity: .35; }
.login-panel { border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 24px 70px rgba(17, 52, 75, .12); }
.login-panel::before { border-radius: 18px; background: linear-gradient(135deg, rgba(0,175,239,.07), transparent 32%); }
.panel-icon { color: var(--ocean); border-radius: 10px; background: var(--aqua-soft); }
.input-wrap { border-radius: 9px; background: #fff; }

/* Application shell */
.dashboard {
    min-height: calc(100vh - 78px);
    grid-template-columns: 184px minmax(0, 1fr);
    gap: 24px;
    padding: 22px 0 64px;
}
.sidebar {
    position: sticky;
    top: 20px;
    height: calc(100vh - 40px);
    padding: 18px 10px 14px;
    border-right: 1px solid var(--border);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.sidebar-label {
    display: block;
    margin: 3px 12px 16px;
    color: var(--text-faint);
    font-size: .57rem;
    font-weight: 750;
    letter-spacing: .16em;
}
.sidebar nav { gap: 4px; }
.sidebar nav a {
    gap: 10px;
    min-height: 43px;
    padding: 9px 11px;
    border: 0;
    border-radius: 9px;
    color: var(--text-soft);
    font-size: .72rem;
    font-weight: 620;
}
.sidebar nav a span:first-child {
    width: 25px;
    color: #9aacb7;
    font: 650 .55rem/1 ui-monospace, Consolas, monospace;
}
.sidebar nav a:hover { color: var(--navy); background: rgba(8,125,168,.055); }
.sidebar nav a.active {
    color: #fff;
    background: var(--navy);
    box-shadow: 0 8px 24px rgba(13,47,70,.16);
}
.sidebar nav a.active span:first-child { color: #6ed5f2; }
.sidebar-resources {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}
.sidebar-resource-label { margin-bottom: 10px; }
.sidebar-resource-link .external-link-mark {
    width: auto;
    margin-left: auto;
    color: #8299a8;
    font-size: .72rem;
    transition: color .2s ease, transform .2s ease;
}
.sidebar-resource-link:hover .external-link-mark {
    color: var(--ocean);
    transform: translate(1px, -1px);
}
.sidebar-foot {
    margin: 0 4px;
    padding: 14px 7px 4px;
    border-top-color: var(--border);
}
.sidebar-foot strong { color: var(--navy); font-size: .64rem; }
.sidebar-foot span { color: var(--text-faint); font-size: .56rem; }
.pulse-orb { border-color: #cce8dc; background: var(--success-soft); }
.dashboard-content { min-width: 0; }

/* Overview and connector */
.welcome-card {
    min-height: 156px;
    padding: 28px 31px;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    gap: 28px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background:
        linear-gradient(90deg, var(--navy) 0 5px, transparent 5px),
        linear-gradient(135deg, #fff, #f8fbfc);
    box-shadow: 0 14px 42px rgba(18,52,73,.065);
}
.welcome-copy { max-width: 690px; }
.welcome-card .eyebrow { margin: 0 0 13px; color: var(--ocean); }
.welcome-card .eyebrow > span:first-child { width: 24px; box-shadow: none; }
.welcome-card h1 { color: var(--navy); font-size: clamp(2rem, 3.3vw, 3.25rem); font-weight: 420; line-height: 1.04; }
.welcome-card h1 em { color: var(--ocean); font-weight: 580; }
.welcome-card p { margin: 12px 0 0; color: var(--text-soft); font-size: .79rem; }
.release-policy {
    width: min(330px, 31%);
    align-self: stretch;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 17px;
    border: 1px solid #cde7de;
    border-radius: 12px;
    background: linear-gradient(135deg, #f0faf6, #fbfefd);
}
.release-policy-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    color: #fff;
    border-radius: 50%;
    background: var(--success);
    font-weight: 800;
}
.release-policy strong, .release-policy small { display: block; }
.release-policy strong { color: #155b45; font-size: .71rem; }
.release-policy small { margin-top: 4px; color: #56766a; font-size: .62rem; line-height: 1.45; }

.connector-strip {
    margin-top: 14px;
    padding: 17px 18px;
    display: grid;
    grid-template-columns: auto minmax(260px, 1fr) auto;
    align-items: center;
    gap: 15px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 9px 28px rgba(18,52,73,.05);
}
.connector-glyph {
    position: relative;
    width: 48px;
    height: 48px;
    border-color: #cfe7ef;
    border-radius: 11px;
    color: var(--ocean-dark);
    background: var(--aqua-soft);
}
.connector-glyph i { position: absolute; inset: 7px; border: 1px solid rgba(8,125,168,.15); border-radius: 50%; }
.connector-glyph span { position: relative; z-index: 1; }
.connector-copy .section-label { margin: 0 0 3px; }
.connector-title-line { display: flex; align-items: center; gap: 10px; }
.connector-copy h2 { color: var(--navy); font-size: .92rem; }
.connector-copy p { margin-top: 2px; color: var(--text-soft); font-size: .63rem; }
.connector-meta {
    margin-top: 8px;
    padding: 0;
    display: flex;
    gap: 20px;
    border: 0;
}
.connector-meta > span { display: flex; align-items: baseline; gap: 6px; }
.connector-meta small { color: var(--text-faint); font-size: .5rem; }
.connector-meta strong, .connector-meta code { color: var(--text-soft); font-size: .57rem; }
.build-state, .live-state {
    padding: 4px 8px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #cde7dc;
    border-radius: 99px;
    color: #286a54;
    background: var(--success-soft);
    font-size: .55rem;
    white-space: nowrap;
}
.build-state i, .live-state i { width: 6px; height: 6px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px rgba(25,118,87,.1); }
.build-state.unavailable { color: #855914; border-color: #ead6b2; background: var(--warning-soft); }
.build-state.unavailable i { background: var(--warning); box-shadow: 0 0 0 3px rgba(165,99,21,.1); }
.live-state[data-state="offline"], .live-state[data-state="unpaired"], .live-state[data-state="pairing"] { color: #855914; border-color: #ead6b2; background: var(--warning-soft); }
.live-state[data-state="offline"] i, .live-state[data-state="unpaired"] i, .live-state[data-state="pairing"] i { background: var(--warning); box-shadow: 0 0 0 3px rgba(165,99,21,.1); }
.live-state[data-state="starting"], .live-state[data-state="reconnecting"] { color: #855914; border-color: #ead6b2; background: var(--warning-soft); }
.live-state[data-state="starting"] i, .live-state[data-state="reconnecting"] i { background: var(--warning); box-shadow: 0 0 0 3px rgba(165,99,21,.1); }
.live-state[data-state="working"] i { animation: pulse 1.1s infinite; }
.live-state[data-state="outdated"], .live-state[data-state="unknown"] { color: #963644; border-color: #efd0d5; background: var(--danger-soft); }
.live-state[data-state="outdated"] i, .live-state[data-state="unknown"] i { background: var(--danger); box-shadow: 0 0 0 3px rgba(184,62,76,.1); }
.live-state[data-state="error"] { color: #963644; border-color: #efd0d5; background: var(--danger-soft); }
.live-state[data-state="error"] i { background: var(--danger); box-shadow: 0 0 0 3px rgba(184,62,76,.1); }
.connector-actions { display: flex; align-items: center; gap: 8px; }
.connector-actions .primary-button, .connector-actions .secondary-button { min-width: 154px; }

.connector-notice {
    margin-top: 10px;
    padding: 14px 16px;
    border-color: #ead8b8;
    border-left: 4px solid var(--warning);
    border-radius: 10px;
    background: var(--warning-soft);
    box-shadow: none;
}
.connector-notice[data-state="outdated"], .connector-notice[data-state="unknown"] {
    border-color: #efd0d5;
    border-left-color: var(--danger);
    background: var(--danger-soft);
}
.connector-notice-icon { width: 32px; height: 32px; border-radius: 8px; box-shadow: none; }
.connector-notice-copy strong { font-size: .7rem; }
.connector-notice-copy p { font-size: .62rem; }

/* Primary work area */
.workspace-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 338px;
    gap: 20px;
    align-items: start;
    margin-top: 25px;
}
.workspace-main { min-width: 0; }
.section-heading { margin: 0 1px 13px; align-items: flex-end; }
.section-heading .section-label, .queue-heading .section-label {
    margin: 0 0 4px;
    color: var(--ocean-dark);
    font-size: .55rem;
    letter-spacing: .16em;
}
.section-heading h2, .queue-heading h2 {
    color: var(--navy);
    font-size: 1.42rem;
    font-weight: 570;
    letter-spacing: -.025em;
}
.section-heading p { max-width: 600px; margin: 5px 0 0; color: var(--text-soft); font-size: .65rem; }
.library-heading { align-items: flex-end; }
.library-controls { flex: 0 0 auto; gap: 8px; }
.target-picker { margin: 0; gap: 4px; color: var(--text-faint); font-size: .49rem; }
.target-picker select {
    width: min(265px, 27vw);
    height: 37px;
    color: var(--navy);
    border-color: var(--border-strong);
    border-radius: 8px;
    background: #fff;
}
.count-pill { padding: 8px 10px; border-color: var(--border); background: #fff; }

.module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.module-card, .skeleton-card {
    min-height: 314px;
    border-color: var(--border);
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 8px 25px rgba(18,52,73,.045);
}
.module-card {
    padding: 18px;
    overflow: hidden;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.module-card:hover {
    transform: translateY(-2px);
    border-color: #b9dbe7;
    box-shadow: 0 15px 36px rgba(18,52,73,.085);
}
.module-card::before {
    width: 94px;
    height: 3px;
    left: 18px;
    right: auto;
    top: 0;
    border-radius: 0 0 5px 5px;
    background: var(--brand-cyan);
}
.module-card[data-accent="blue"]::before { background: var(--brand-primary); }
.module-card[data-accent="sand"]::before { background: #b9853d; }
.module-card.module-card-disabled { background: #fdf9fa; }
.module-icon {
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 9px;
    color: var(--ocean-dark);
    background: var(--aqua-soft);
    font-size: .94rem;
    font-weight: 720;
}
.module-badges { max-width: 170px; flex-direction: row; flex-wrap: wrap; justify-content: flex-end; }
.license-badge, .module-state { padding: 5px 7px; font-size: .48rem; font-weight: 700; }
.module-card h3 { margin: 15px 0 5px; color: var(--navy); font-size: .98rem; line-height: 1.25; }
.module-card > p { min-height: 36px; color: var(--text-soft); font-size: .64rem; line-height: 1.45; }
.module-source { display: none; }
.module-details {
    gap: 8px;
    margin-top: 13px;
    padding: 9px 10px;
    border: 1px solid #e5ecef;
    border-radius: 8px;
    background: var(--surface-soft);
}
.module-details span { flex: 1; min-width: 55px; }
.module-details small { color: var(--text-faint); font-size: .46rem; }
.module-details strong { color: var(--navy-soft); font-size: .6rem; }
.module-action-guide {
    position: relative;
    margin-top: 11px;
    padding-left: 14px;
    color: var(--text-soft);
    font-size: .59rem;
    line-height: 1.4;
}
.module-action-guide::before {
    content: "";
    position: absolute;
    left: 0;
    top: .38em;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--success);
}
.module-card[data-state="update-available"] .module-action-guide { color: #815618; font-weight: 650; }
.module-card[data-state="update-available"] .module-action-guide::before { background: var(--warning); }
.module-card[data-state="absent"] .module-action-guide::before { background: var(--ocean); }
.module-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: auto;
    padding-top: 13px;
}
.module-actions button {
    min-height: 36px;
    padding: 7px 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-color: var(--border-strong);
    border-radius: 8px;
    color: var(--navy-soft);
    font-size: .6rem;
    font-weight: 680;
}
.module-actions button.primary-action {
    grid-column: 1 / -1;
    order: -1;
    min-height: 42px;
    border-color: var(--ocean-dark);
    background: linear-gradient(112deg, var(--ocean-dark), var(--ocean));
    box-shadow: 0 8px 18px rgba(8,109,154,.15);
    font-size: .69rem;
}
.module-actions button:disabled, .module-actions button.primary-action:disabled { display: none; }
.module-card[data-state="absent"] .module-actions button[data-action="launch"]:disabled,
.module-card[data-state="update-available"] .module-actions button[data-action="launch"]:disabled {
    display: inline-flex;
    grid-column: 1 / -1;
    color: #84939e;
    background: #f1f4f6;
}
.module-card[data-state="update-available"] .module-actions button[data-action="launch"]:disabled::before { content: "Güncellemeden sonra · "; }
html[lang="en"] .module-card[data-state="update-available"] .module-actions button[data-action="launch"]:disabled::before { content: "After update · "; }
.module-card[data-state="absent"] .module-actions button[data-action="launch"]:disabled::before { content: "Kurulumdan sonra · "; }
html[lang="en"] .module-card[data-state="absent"] .module-actions button[data-action="launch"]:disabled::before { content: "After install · "; }

.devices-section { margin-top: 31px; }
.device-panel { min-height: 94px; padding: 6px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.device-row { grid-template-columns: 40px minmax(150px, 1fr) 110px minmax(135px,.65fr) auto; padding: 11px; }
.device-icon { border-radius: 9px; }

/* Persistent job queue */
.queue-dock {
    position: sticky;
    top: 20px;
    max-height: calc(100vh - 40px);
    overflow: hidden;
    border: 1px solid #cddce4;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 17px 42px rgba(18,52,73,.09);
}
.queue-heading {
    padding: 19px 18px 15px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    color: #fff;
    background: linear-gradient(135deg, var(--navy), #123e58);
}
.queue-heading .section-label { color: #77d5ef; }
.queue-heading h2 { color: #fff; font-size: 1.3rem; }
.icon-button {
    width: 34px;
    height: 34px;
    cursor: pointer;
    color: #d9f3fa;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 8px;
    background: rgba(255,255,255,.07);
    font-size: 1rem;
}
.icon-button:hover { color: #fff; background: rgba(255,255,255,.13); }
.queue-overview {
    margin: 13px 14px 0;
    padding: 11px 12px;
    display: grid;
    grid-template-columns: auto 1fr 1fr;
    gap: 10px;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface-soft);
}
.queue-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(25,118,87,.1); }
.queue-overview > span:not(.queue-live-dot) { display: grid; padding-left: 10px; border-left: 1px solid var(--border); }
.queue-overview strong { color: var(--navy); font-size: .83rem; }
.queue-overview small { color: var(--text-faint); font-size: .5rem; }
.queue-help { margin: 10px 16px 12px; color: var(--text-soft); font-size: .58rem; line-height: 1.45; }
.activity-panel {
    min-height: 150px;
    max-height: calc(100vh - 254px);
    overflow-y: auto;
    padding: 0 8px 9px;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    scrollbar-width: thin;
    scrollbar-color: #bacbd4 transparent;
}
.job-row {
    margin-top: 7px;
    padding: 11px;
    display: grid;
    grid-template-columns: 33px minmax(0, 1fr) auto;
    gap: 7px 9px;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #fff;
}
.job-row:last-child { border-bottom: 1px solid var(--border); }
.job-row[data-status="queued"], .job-row[data-status="accepted"] { border-color: #d8e4e9; background: #fbfdfe; }
.job-row[data-status="failed"] { border-color: #efd2d7; background: #fffafb; }
.job-row[data-status="completed"] { border-color: #d3e8df; background: #fbfefc; }
.job-symbol { width: 31px; height: 31px; grid-row: 1 / span 2; border-radius: 8px; font-size: .72rem; }
.job-title strong { color: var(--navy); font-size: .66rem; overflow-wrap: anywhere; }
.job-title small { color: var(--text-faint); font-size: .53rem; }
.job-status {
    justify-self: end;
    padding: 4px 6px;
    border-radius: 99px;
    color: var(--ocean-dark);
    background: var(--aqua-soft);
    font-size: 0;
    font-weight: 750;
    text-transform: none;
}
.job-status::after { content: attr(data-label); font-size: .5rem; }
.job-row[data-status="failed"] .job-status { color: var(--danger); background: var(--danger-soft); }
.job-row[data-status="completed"] .job-status { color: var(--success); background: var(--success-soft); }
.job-progress-wrap { grid-column: 2 / -1; display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }
.progress { height: 6px; background: #e9eff2; }
.progress i { background: linear-gradient(90deg, var(--ocean), var(--brand-cyan)); transition: width .25s ease; }
.job-progress-value { color: var(--text-soft); font: 650 .52rem/1 ui-monospace, Consolas, monospace; }
.job-message { grid-column: 2 / -1; color: var(--text-soft); font-size: .54rem; line-height: 1.35; }
.job-time { grid-column: 2 / -1; color: var(--text-faint); font-size: .5rem; text-align: left; }
.queue-dock .empty-state { min-height: 164px; }

/* Operational text stays readable at default browser zoom. */
.sidebar-label { font-size: .68rem; }
.sidebar nav a { font-size: .78rem; }
.sidebar nav a span:first-child { font-size: .65rem; }
.sidebar-foot strong { font-size: .7rem; }
.sidebar-foot span { font-size: .65rem; line-height: 1.35; }
.welcome-card p { font-size: .82rem; }
.release-policy strong { font-size: .76rem; }
.release-policy small { font-size: .7rem; }
.connector-copy .section-label, .section-heading .section-label, .queue-heading .section-label { font-size: .68rem; }
.connector-copy h2 { font-size: 1rem; }
.connector-copy p { font-size: .72rem; }
.connector-meta small { font-size: .65rem; }
.connector-meta strong, .connector-meta code { font-size: .68rem; }
.build-state, .live-state { font-size: .68rem; }
.connector-notice-copy strong { font-size: .76rem; }
.connector-notice-copy p, .section-heading p { font-size: .72rem; }
.target-picker { font-size: .65rem; }
.target-picker select { font-size: .72rem; }
.count-pill { font-size: .68rem; }
.license-badge, .module-state { font-size: .64rem; }
.module-card > p { font-size: .72rem; }
.module-details small { font-size: .65rem; }
.module-details strong { font-size: .68rem; }
.module-action-guide { font-size: .68rem; }
.module-actions button { font-size: .68rem; }
.module-actions button.primary-action { font-size: .75rem; }
.device-identity strong { font-size: .76rem; }
.device-identity small, .device-time { font-size: .65rem; }
.device-status, .revoke-button, .orphan-cleanup-button { font-size: .68rem; }
.queue-overview small { font-size: .65rem; }
.queue-help { font-size: .68rem; }
.job-title strong { font-size: .72rem; }
.job-title small { font-size: .63rem; }
.job-status::after { font-size: .65rem; }
.job-progress-value { font-size: .65rem; }
.job-message { font-size: .64rem; }
.job-time { font-size: .65rem; }

@media (min-width: 1640px) {
    .workspace-grid { grid-template-columns: minmax(0, 1fr) 355px; }
    .module-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1180px) {
    .site-header, main { width: min(100% - 38px, 1600px); }
    .dashboard { grid-template-columns: 156px minmax(0, 1fr); gap: 18px; }
    .workspace-grid { grid-template-columns: minmax(0, 1fr) 305px; gap: 14px; }
    .module-grid { grid-template-columns: 1fr; }
    .release-policy { width: min(300px, 36%); }
    .connector-actions { flex-direction: column; align-items: stretch; }
    .connector-actions .primary-button, .connector-actions .secondary-button { min-width: 142px; }
    .library-heading { align-items: flex-start; }
    .library-controls { flex-direction: column; align-items: flex-end; }
}

@media (max-width: 900px) {
    .site-header, main { width: min(100% - 28px, 1600px); }
    .dashboard { grid-template-columns: 1fr; }
    .sidebar {
        position: sticky;
        z-index: 8;
        top: 0;
        width: 100%;
        height: auto;
        padding: 7px;
        overflow-x: auto;
        border: 1px solid var(--border);
        border-radius: 11px;
        background: rgba(255,255,255,.96);
        box-shadow: 0 8px 22px rgba(18,52,73,.07);
    }
    .sidebar-inner { min-width: max-content; display: flex; align-items: center; gap: 4px; }
    .sidebar-label, .sidebar-foot { display: none; }
    .sidebar nav { display: flex; }
    .sidebar nav a { min-height: 40px; padding: 8px 11px; white-space: nowrap; }
    .sidebar-resources {
        margin: 0 0 0 4px;
        padding: 0 0 0 8px;
        border-top: 0;
        border-left: 1px solid var(--border);
    }
    .workspace-grid { grid-template-columns: 1fr; }
    .queue-dock { position: static; order: -1; max-height: none; }
    .activity-panel { max-height: 440px; }
    .module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
    .site-header { min-height: 70px; }
    .secure-pill { display: none; }
    .dashboard { padding-top: 12px; }
    .welcome-card { min-height: auto; padding: 23px; flex-direction: column; }
    .welcome-card h1 { font-size: 2rem; }
    .release-policy { width: 100%; }
    .connector-strip { grid-template-columns: 1fr; }
    .connector-glyph { display: none; }
    .connector-actions { flex-direction: row; flex-wrap: wrap; }
    .connector-actions .primary-button, .connector-actions .secondary-button { min-width: 0; flex: 1 1 150px; }
    .connector-notice { grid-template-columns: auto 1fr; }
    .connector-notice-actions { grid-column: 2; justify-content: flex-start; }
    .library-heading { display: block; }
    .library-controls { margin-top: 15px; flex-direction: row; align-items: flex-end; }
    .target-picker { flex: 1; }
    .target-picker select { width: 100%; }
    .module-grid { grid-template-columns: 1fr; }
    .module-card, .skeleton-card { min-height: 300px; }
    .device-row { grid-template-columns: 38px 1fr; }
    .device-status, .device-time, .revoke-button { grid-column: 2; justify-self: start; }
    .device-status { grid-row: 2; }
    .device-time { grid-row: 3; }
    .revoke-button { grid-row: 4; }
}

@media (max-width: 460px) {
    .site-header, main { width: min(100% - 20px, 1600px); }
    .brand strong { font-size: .78rem; }
    .header-actions { gap: 5px; }
    .ghost-button { font-size: .65rem; }
    .sidebar nav a { gap: 7px; padding-inline: 9px; font-size: .72rem; }
    .sidebar nav a span:first-child { width: auto; font-size: .58rem; }
    .welcome-card { padding: 20px; }
    .connector-actions { display: grid; grid-template-columns: 1fr; }
    .connector-meta { display: flex; flex-wrap: wrap; }
    .connector-notice { grid-template-columns: 1fr; }
    .connector-notice-icon { display: none; }
    .connector-notice-actions { grid-column: 1; }
    .library-controls { align-items: stretch; }
    .count-pill { display: none; }
}

/* Task-first owner portal refinement */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

:where(button, a, input, select, summary):focus-visible {
    outline: 3px solid rgba(0, 137, 190, .35);
    outline-offset: 3px;
}

.auth-story h1 {
    max-width: 850px;
    font-size: clamp(2.8rem, 5.8vw, 4.75rem);
    line-height: 1.06;
}

.welcome-card {
    min-height: 112px;
    padding: 20px 24px;
    align-items: center;
    background: #fff;
    box-shadow: 0 7px 24px rgba(18, 52, 73, .045);
}
.welcome-card .eyebrow { margin-bottom: 7px; }
.welcome-card h1 { font-size: clamp(1.65rem, 2.2vw, 2.2rem); line-height: 1.12; }
.welcome-card p { margin-top: 6px; font-size: .78rem; }
.release-policy {
    width: min(410px, 38%);
    min-height: 62px;
    padding: 10px 13px;
    border-radius: 10px;
    background: #f5fbf8;
}
.release-policy-icon { width: 28px; height: 28px; }
.release-policy strong { font-size: .72rem; }
.release-policy small { font-size: .67rem; line-height: 1.35; }

.connector-details { margin-top: 7px; }
.connector-details > summary {
    width: max-content;
    cursor: pointer;
    color: var(--ocean-dark);
    font-size: .68rem;
    font-weight: 650;
}
.connector-details[open] > summary { margin-bottom: 8px; }
.connector-strip.is-online {
    min-height: 66px;
    padding: 10px 14px;
    grid-template-columns: auto minmax(240px, 1fr) auto;
    border-color: #cfe4db;
    background: #fbfefc;
    box-shadow: 0 5px 18px rgba(18, 52, 73, .035);
}
.connector-strip.is-online .connector-glyph { width: 38px; height: 38px; }
.connector-strip.is-online .connector-copy .section-label,
.connector-strip.is-online .connector-details { display: none; }
.connector-strip.is-online .connector-copy p { margin-top: 3px; }
.connector-strip.is-online .connector-actions .secondary-button { min-width: 0; min-height: 40px; }
.connector-strip.is-online #pair-button { background: transparent; }

.library-toolbar {
    margin: 0 0 14px;
    padding: 10px;
    display: grid;
    grid-template-columns: minmax(190px, 1fr) minmax(145px, auto) minmax(135px, auto) auto auto;
    align-items: end;
    gap: 8px;
    border: 1px solid var(--border);
    border-radius: 11px;
    background: #fff;
}
.search-control {
    min-height: 42px;
    padding: 0 11px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--border-strong);
    border-radius: 8px;
    background: #fff;
}
.search-control > span:not(.visually-hidden) { color: var(--ocean); font-size: 1rem; }
.search-control input {
    width: 100%;
    min-width: 0;
    height: 40px;
    padding: 0;
    color: var(--navy);
    border: 0;
    outline: 0;
    background: transparent;
    font-size: .78rem;
}
.toolbar-select { display: grid; gap: 4px; color: var(--text-faint); font-size: .62rem; font-weight: 700; }
.toolbar-select select {
    min-width: 135px;
    height: 42px;
    padding: 0 30px 0 10px;
    color: var(--navy);
    border: 1px solid var(--border-strong);
    border-radius: 8px;
    background: #fff;
    font-size: .72rem;
}
.update-all-button { min-height: 42px; white-space: nowrap; }
.update-all-button:disabled { display: inline-flex; opacity: .55; }
.library-toolbar .count-pill { min-height: 42px; display: inline-flex; align-items: center; white-space: nowrap; }

.module-card, .skeleton-card { min-height: 268px; }
.module-card { padding: 16px; box-shadow: 0 5px 18px rgba(18, 52, 73, .035); }
.module-card:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(18, 52, 73, .065); }
.module-icon {
    width: 44px;
    height: 44px;
    font-family: "Segoe UI Symbol", "Segoe UI", sans-serif;
    font-size: 1.3rem;
}
.module-card h3 { margin-top: 12px; font-size: 1rem; }
.module-card > p { min-height: 34px; font-size: .75rem; line-height: 1.48; }
.module-details { margin-top: 10px; padding: 8px 10px; background: #fafcfd; }
.module-action-guide { margin-top: 8px; font-size: .7rem; }
.module-action-guide[hidden] { display: none; }
.module-actions {
    display: block;
    margin-top: auto;
    padding-top: 12px;
}
.module-actions > button.primary-action {
    width: 100%;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border: 1px solid var(--ocean-dark);
    border-radius: 8px;
    background: var(--ocean-dark);
    box-shadow: none;
    font-size: .76rem;
    font-weight: 720;
}
.module-actions > button.primary-action:hover:not(:disabled) { background: #075d86; }
.module-actions > button.primary-action.focus-action { color: #083e58; border-color: rgba(0, 175, 239, .48); background: linear-gradient(110deg, #bdeeff, #80d9f7); box-shadow: 0 8px 22px rgba(0, 175, 239, .16); }
.module-actions > button.primary-action.focus-action:hover:not(:disabled) { background: linear-gradient(110deg, #a9e9ff, #68cfef); }
.module-process-state { padding: 5px 8px; color: #176f50; border: 1px solid rgba(25, 118, 87, .22); border-radius: 99px; background: rgba(25, 118, 87, .07); font-size: .55rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.module-process-state[data-state="starting"] { color: #8a641e; border-color: rgba(166, 111, 34, .24); background: rgba(166, 111, 34, .07); }
.module-process-state[data-state="not_responding"], .module-process-state[data-attention="true"] { color: #a13b47; border-color: rgba(184, 62, 76, .24); background: rgba(184, 62, 76, .07); }
.module-process-state[data-state="closed"] { color: #526774; border-color: rgba(82, 103, 116, .22); background: rgba(82, 103, 116, .07); }
.module-focus-attention { margin-top: 9px; padding: 8px 10px; color: #8f2838; border: 1px solid rgba(184, 62, 76, .25); border-radius: 7px; background: rgba(184, 62, 76, .07); font-size: .68rem; font-weight: 720; }
.module-focus-attention[hidden] { display: none; }
.module-actions > button.primary-action:disabled {
    display: inline-flex;
    color: #5f7280;
    border-color: #d7e0e5;
    background: #eef3f5;
    opacity: 1;
}
.module-more { margin-top: 7px; }
.module-more > summary {
    min-height: 36px;
    cursor: pointer;
    display: grid;
    place-items: center;
    color: var(--text-soft);
    border-radius: 7px;
    font-size: .69rem;
    font-weight: 650;
}
.module-more > summary:hover { color: var(--ocean-dark); background: #f3f8fa; }
.module-more .module-source {
    margin-top: 7px;
    display: block;
    font-size: .67rem;
}
.module-technical-detail {
    margin: 7px 2px;
    color: var(--text-faint);
    font-size: .65rem;
}
.module-secondary-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.module-secondary-actions button { min-height: 40px; }
.module-secondary-actions button:disabled { display: none; }

.workspace-grid.queue-is-collapsed { grid-template-columns: minmax(0, 1fr) 210px; }
.queue-dock { box-shadow: 0 8px 25px rgba(18, 52, 73, .06); }
.queue-heading {
    min-height: 66px;
    padding: 14px 15px;
    align-items: center;
    color: var(--navy);
    border-bottom: 1px solid var(--border);
    background: #fff;
}
.queue-heading .section-label { color: var(--ocean-dark); }
.queue-heading h2 { color: var(--navy); font-size: 1.05rem; }
.queue-heading-actions { display: flex; gap: 6px; }
.queue-heading .icon-button {
    width: 44px;
    height: 44px;
    color: var(--navy-soft);
    border-color: var(--border);
    background: #f7fafb;
}
.queue-heading .icon-button:hover { color: var(--ocean-dark); background: #eef7fa; }
.queue-dock.is-collapsed { max-height: 68px; }
.queue-dock.is-collapsed #queue-content { display: none; }
.queue-dock.is-collapsed .queue-heading { min-height: 66px; padding-inline: 12px; }
.queue-dock.is-collapsed .queue-heading .section-label,
.queue-dock.is-collapsed #refresh-jobs { display: none; }
.queue-dock.is-collapsed .queue-heading h2 { font-size: .86rem; }

.job-row { grid-template-columns: 33px minmax(0, 1fr) auto; }
.job-phases {
    grid-column: 2 / -1;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
}
.job-phases span {
    min-width: 0;
    padding: 3px 5px;
    color: var(--text-faint);
    border-radius: 5px;
    background: #f0f4f6;
    font-size: .61rem;
    white-space: nowrap;
}
.job-phases span[data-state="done"] { color: #176448; background: #edf8f3; }
.job-phases span[data-state="current"] { color: #075f89; background: #eaf6fb; }
.job-phases span[data-state="failed"] { color: #9a2e3d; background: #fcecef; }
.job-row[data-status="failed"] .progress { display: none; }
.job-row[data-status="failed"] .job-progress-wrap { grid-template-columns: 1fr; }
.job-row[data-status="failed"] .job-progress-value { color: var(--danger); font-family: inherit; font-weight: 720; }
.job-message { font-size: .68rem; line-height: 1.45; }
.job-failure-actions {
    grid-column: 2 / -1;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 7px;
}
.job-retry-button,
.job-technical-details > summary,
.job-technical-details > button {
    min-height: 36px;
    padding: 7px 9px;
    cursor: pointer;
    color: var(--ocean-dark);
    border: 1px solid var(--border-strong);
    border-radius: 7px;
    background: #fff;
    font-size: .66rem;
    font-weight: 680;
}
.job-retry-button:disabled { cursor: not-allowed; opacity: .55; }
.job-technical-details { flex: 1 1 145px; }
.job-technical-details > summary { display: inline-flex; align-items: center; }
.job-technical-details > code {
    margin: 7px 0;
    padding: 8px;
    display: block;
    overflow-wrap: anywhere;
    color: #5e3540;
    border-radius: 6px;
    background: #f8edef;
    font-size: .61rem;
    white-space: pre-wrap;
}

@media (max-width: 1280px) {
    .library-toolbar { grid-template-columns: minmax(190px, 1fr) repeat(2, minmax(135px, auto)); }
    .update-all-button, .library-toolbar .count-pill { justify-self: start; }
}

@media (max-width: 1100px) {
    .workspace-grid,
    .workspace-grid.queue-is-collapsed { grid-template-columns: 1fr; }
    .queue-dock { position: static; order: -1; max-height: none; }
    .queue-dock.is-collapsed { max-height: 68px; }
    .module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .welcome-card { display: block; }
    .release-policy { width: 100%; margin-top: 12px; }
    .connector-strip.is-online { grid-template-columns: minmax(0, 1fr); }
    .connector-strip.is-online .connector-glyph { display: none; }
    .connector-strip.is-online .connector-actions { flex-direction: row; }
    .library-toolbar { grid-template-columns: 1fr 1fr; }
    .search-control { grid-column: 1 / -1; }
    .update-all-button { grid-column: 1 / -1; width: 100%; justify-content: center; }
    .module-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .auth-story h1 { font-size: 2.45rem; }
    .welcome-card { padding: 16px; }
    .library-toolbar { grid-template-columns: 1fr; }
    .search-control,
    .update-all-button { grid-column: 1; }
    .toolbar-select select { width: 100%; }
    .library-toolbar .count-pill { display: inline-flex; }
    .module-secondary-actions { grid-template-columns: 1fr; }
    .queue-heading .icon-button { width: 42px; height: 42px; }
}