/* RobinX visual system. All application logic lives in the original scripts. */
:root {
  --bg: #080b17;
  --ink: #f1f5ff;
  --muted: #9aa7be;
  --line: rgba(165, 191, 235, .17);
  --acid: #86f5e8;
  --card: #11182a;
  --card-text: #f1f5ff;
  --violet: #a5a5ff;
  --orange: #ffb67c;
  --panel: #10182b;
  --mono: "DM Mono", monospace;
}
html { scrollbar-color: #3c5273 #080b17; }
body {
  background: radial-gradient(ellipse 58% 34% at 82% 5%, rgba(73, 83, 190, .18), transparent 72%),
              radial-gradient(ellipse 52% 29% at -13% 42%, rgba(23, 171, 195, .08), transparent 75%), #080b17;
  color: var(--ink);
}
body::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .28;
  background-image: linear-gradient(rgba(129, 175, 227, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(129, 175, 227, .055) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(to bottom, black, transparent 80%);
}
body > .site-header, body > main, body > footer { position: relative; z-index: 1; }
::selection { background: var(--acid); color: #07101b; }
.dot { color: var(--acid); }
.site-header, main, footer { width: min(1320px, calc(100% - 80px)); }
.site-header { height: 86px; border-bottom-color: rgba(162, 191, 238, .17); }
.wordmark { gap: 11px; font-size: 1.03rem; letter-spacing: -.045em; }
.wordmark-mark {
  width: 38px; height: 38px; border-radius: 10px; color: #07131c; border: 0;
  background: linear-gradient(135deg, #a5fff2 0%, #73d5f5 55%, #928bff 100%);
  box-shadow: 0 0 0 1px rgba(160, 244, 242, .18), 0 8px 24px rgba(33, 211, 213, .16);
  font-size: 1.03rem; font-weight: 500;
}
.wordmark:hover .wordmark-mark { border-color: transparent; box-shadow: 0 0 24px rgba(115, 213, 245, .42); }
.wordmark .dot { margin-left: -8px; }
.site-nav { gap: clamp(14px, 2.3vw, 36px); }
.site-nav a { color: #a4b1c8; font-size: .68rem; letter-spacing: .12em; }
.site-nav a:first-child { color: #a4b1c8; }
.site-nav a:hover, .site-nav a[aria-current], .site-nav a[data-section-current] { color: var(--acid); border-bottom-color: var(--acid); }
.domain, .crumb { color: #7184a1; font-size: .62rem; letter-spacing: .13em; }
.command-hint { color: #9badc8; }
.command-hint kbd, .command-title kbd, .command-help kbd { border-color: #394a68; box-shadow: inset 0 -1px 0 #25334e; }
.status-dot, .featured-live-dot { background: var(--acid); border-color: var(--acid); box-shadow: 0 0 0 4px rgba(134,245,232,.09), 0 0 18px rgba(134,245,232,.53); }
.eyebrow, .section-kicker { color: var(--acid); letter-spacing: .16em; }
.cursor-glow { background: radial-gradient(circle, rgba(87, 215, 241, .085) 0%, rgba(123, 129, 240, .03) 32%, transparent 68%); }
:focus-visible { outline-color: var(--acid); }

/* Home: a personal workshop with an instrument-panel hero. */
.home-page .intro {
  min-height: 660px; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr);
  gap: clamp(32px, 5vw, 80px); align-items: center; padding: 76px 0 110px;
}
.home-page .intro::before {
  content: ""; position: absolute; width: 440px; height: 440px; right: 6%; top: 10%; z-index: -1;
  background: radial-gradient(circle, rgba(85, 94, 216, .12), transparent 68%); filter: blur(30px);
}
.hero-copy { position: relative; z-index: 2; }
.home-page .intro .eyebrow { margin: 0 0 34px; font-size: .63rem; color: #bcece9; white-space: nowrap; }
.eyebrow-index { color: #677d9d; margin-left: 6px; }
.home-page h1 { font-size: clamp(4.25rem, 6.5vw, 7rem); line-height: .99; letter-spacing: -.083em; max-width: 780px; white-space: nowrap; }
.home-page h1 .hero-line { padding-bottom: .065em; }
.home-page h1 .outlined { color: transparent; -webkit-text-stroke: 1px rgba(168, 243, 244, .9); }
.home-page .lede { max-width: 505px; margin-top: 25px; color: #aebbd0; font-size: 1.02rem; line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.action-button { min-height: 50px; padding: 0 19px; border-radius: 7px; font-size: .64rem; letter-spacing: .08em; }
.action-button-primary { color: #061720; background: var(--acid); border-color: var(--acid); font-weight: 500; }
.action-button-primary:hover { background: #bcfff6; border-color: #bcfff6; box-shadow: 0 7px 32px rgba(96, 237, 227, .23); }
.action-button-ghost, .action-button-secondary { color: #e6f0ff; background: rgba(142, 174, 236, .065); border-color: rgba(158, 195, 241, .28); }
.action-button-ghost:hover, .action-button-secondary:hover { color: var(--acid); border-color: var(--acid); background: rgba(134, 245, 232, .075); }
.home-page .hero-meta { display: flex; flex-direction: row; justify-content: space-between; align-items: center; max-width: 505px; margin-top: 63px; padding-top: 15px; border-top: 1px solid var(--line); color: #7b8faa; font-size: .58rem; }
.hero-visual { position: relative; min-width: 0; height: 480px; border: 1px solid rgba(157, 189, 241, .25); border-radius: 14px; overflow: hidden; background: linear-gradient(155deg, rgba(40, 63, 112, .37), rgba(13, 20, 39, .93) 48%, rgba(24, 29, 66, .89)); box-shadow: inset 0 1px rgba(210, 231, 255, .1), 0 26px 80px rgba(0, 0, 0, .3); }
.hero-visual::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent 50%, rgba(177, 214, 253, .02) 50%), linear-gradient(transparent 50%, rgba(177, 214, 253, .02) 50%); background-size: 26px 26px; opacity: .65; }
.visual-top { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 18px 21px; border-bottom: 1px solid rgba(162, 191, 238, .14); font: 500 .55rem var(--mono); letter-spacing: .11em; color: #8ca4c4; }
.visual-live { color: var(--acid); white-space: nowrap; }
.visual-stage { position: relative; height: 328px; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at center, rgba(48, 89, 139, .22), transparent 52%); }
.orbit { position: absolute; left: 50%; top: 50%; aspect-ratio: 1; border: 1px solid rgba(141, 203, 240, .21); border-radius: 50%; transform: translate(-50%, -50%); }
.orbit-outer { width: 330px; border-style: dashed; animation: spin 80s linear infinite; }
.orbit-middle { width: 252px; border-color: rgba(118, 245, 232, .36); box-shadow: 0 0 45px rgba(91, 216, 231, .05); }
.orbit-inner { width: 181px; border-color: rgba(142, 151, 255, .36); }
.orbit-crosshair { position: absolute; background: rgba(141, 203, 240, .13); }
.orbit-crosshair-h { height: 1px; width: 100%; }
.orbit-crosshair-v { width: 1px; height: 100%; }
.core { position: relative; width: 145px; height: 145px; display: grid; place-items: center; border: 1px solid rgba(136, 231, 240, .65); border-radius: 50%; background: radial-gradient(circle at 39% 32%, #265c80, #111e40 60%, #0b1429); box-shadow: 0 0 0 9px rgba(120, 222, 245, .035), inset 0 0 26px rgba(109, 236, 241, .12), 0 0 64px rgba(85, 225, 236, .2); }
.core > span { font: 500 3.3rem var(--mono); letter-spacing: -.16em; color: #d7ffff; text-shadow: 0 0 26px rgba(102, 247, 235, .54); padding-right: .18em; }
.core small { font-size: .52em; color: var(--acid); }
.orbit-node { position: absolute; width: 9px; height: 9px; border: 2px solid #c3fff6; background: #5be8e1; border-radius: 50%; box-shadow: 0 0 18px #6bf6e9; }
.node-a { top: 50px; left: calc(50% + 104px); }.node-b { bottom: 60px; left: calc(50% - 139px); }.node-c { top: 84px; left: calc(50% - 113px); width: 6px; height: 6px; background: #b1a9ff; border-color: #b1a9ff; box-shadow: 0 0 14px #a8a2ff; }
.visual-caption { position: absolute; font: 500 .58rem var(--mono); letter-spacing: .07em; color: #99c9d5; }
.caption-a { right: 9%; top: 25%; }.caption-b { left: 9%; bottom: 22%; color: #afaaf9; }
.visual-bottom { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr 20px; align-items: center; gap: 16px; padding: 17px 21px; border-top: 1px solid rgba(162, 191, 238, .14); }
.visual-bottom div { display: flex; flex-direction: column; gap: 5px; }.visual-bottom span { font: 500 .54rem var(--mono); letter-spacing: .1em; color: #7186a5; }.visual-bottom strong { font-size: .77rem; font-weight: 600; }.visual-bottom b { color: var(--acid); font-size: 1.1rem; }
@keyframes spin { to { transform: translate(-50%, -50%) rotate(360deg); } }

/* Home content */
.home-section-line { border-color: rgba(162, 191, 238, .22); color: #8598b3; font-size: .62rem; }
.home-section-line > span:first-child, .section-kicker { color: var(--acid); }
.home-section-intro { align-items: end; padding: 55px 0 37px; }
.home-section-intro h2 { font-size: clamp(3.5rem, 6.4vw, 6.4rem); line-height: .99; }
.home-section-intro h2 em, .home-apps-heading h2 em, .home-about em { color: var(--acid); font-style: normal; }
.home-section-intro > p { color: #adbad0; line-height: 1.8; }
.home-featured { padding: 25px 30px 0; border: 1px solid rgba(112, 217, 226, .42); border-left: 1px solid rgba(112, 217, 226, .42); border-radius: 12px; background: linear-gradient(115deg, rgba(20, 57, 85, .69), rgba(15, 26, 50, .96) 54%, rgba(39, 40, 84, .7)); box-shadow: inset 0 1px rgba(206, 250, 251, .09), 0 20px 55px rgba(0, 0, 0, .17); }
.home-featured:after { border-color: rgba(109, 233, 236, .1); box-shadow: 0 0 0 75px rgba(121, 170, 255, .018), 0 0 0 150px rgba(121, 170, 255, .009); }
.featured-topline { color: #91a6c2; }.featured-topline span:first-child { color: var(--acid); }
.featured-content { display: grid; grid-template-columns: 1fr minmax(280px, .8fr); align-items: center; gap: 20px; padding: 39px 0 46px; }
.feature-number { color: #8aa6c3; font: 500 .6rem var(--mono); letter-spacing: .15em; }
.featured-content h3 { margin-top: 14px; font-size: clamp(2.8rem, 4.5vw, 4.9rem); }.featured-content p { color: #aebed3; max-width: 430px; }.featured-content .action-button { margin-top: 25px; }
.featured-bottom { color: #9db2c9; border-top-color: rgba(148, 211, 238, .19); }.featured-bottom span { color: #617d9c; }
.screen-art { position: relative; min-height: 305px; border: 1px solid rgba(130, 186, 223, .15); border-radius: 8px; overflow: hidden; background: linear-gradient(rgba(117, 184, 238, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(117, 184, 238, .045) 1px, transparent 1px), radial-gradient(circle at 55% 60%, rgba(88, 193, 232, .12), transparent 60%); background-size: 24px 24px, 24px 24px, auto; }
.screen-art::before, .screen-art::after { content: ""; position: absolute; z-index: 0; background: rgba(140, 202, 240, .26); }.screen-art::before { width: 1px; height: 100%; left: 50%; }.screen-art::after { height: 1px; width: 100%; top: 60%; }
.screen-screen { position: absolute; z-index: 1; display: flex; align-items: start; justify-content: end; padding: 10px; border: 1px solid rgba(115, 241, 238, .8); border-radius: 6px; color: #bdfffa; background: linear-gradient(135deg, rgba(57, 140, 181, .25), rgba(57, 140, 181, .07)); box-shadow: 0 0 28px rgba(76, 221, 233, .09), inset 0 0 22px rgba(76, 221, 233, .07); font: 500 .58rem var(--mono); }.screen-large { width: 72%; height: 61%; left: 14%; top: 19%; }.screen-mid { width: 42%; height: 39%; left: 17%; top: 41%; border-color: rgba(167, 157, 255, .9); color: #c6c1ff; background: linear-gradient(135deg, rgba(111, 100, 202, .38), rgba(111, 100, 202, .12)); }.screen-small { width: 11%; height: 30%; left: 66%; top: 50%; border-color: rgba(255, 188, 133, .9); color: #ffcea7; background: linear-gradient(135deg, rgba(209, 123, 89, .34), rgba(209, 123, 89, .09)); padding: 5px; font-size: .44rem; }
.home-utility-grid { gap: 12px; margin-top: 12px; }
.home-utility-card { min-height: 280px; padding: 26px; border: 1px solid rgba(157, 189, 239, .19); border-radius: 10px; background: linear-gradient(135deg, rgba(32, 48, 83, .55), rgba(15, 23, 43, .97) 60%); position: relative; overflow: hidden; }
.home-utility-card::before { content: ""; position: absolute; width: 170px; height: 170px; right: -55px; top: -65px; border: 1px solid rgba(151, 197, 247, .1); border-radius: 50%; box-shadow: 0 0 0 27px rgba(151, 197, 247, .025), 0 0 0 55px rgba(151, 197, 247, .016); }
.home-utility-card:hover, .home-utility-card:focus-visible { border-color: rgba(134, 245, 232, .7); background-color: #172842; box-shadow: 0 18px 45px rgba(0, 0, 0, .22), inset 0 1px rgba(180, 243, 255, .07); transform: translateY(-3px); }
.utility-top { color: #889ebb; }.utility-category { color: #a9b1ff; }.home-utility-card h3 { margin-top: 38px; font-size: clamp(1.45rem, 2.15vw, 2rem); }.home-utility-card p { color: #9eafc7; }.utility-bottom { color: #869cb7; border-top-color: rgba(149, 184, 230, .18); }.utility-arrow { color: var(--acid); }
.home-toolbox-end { border-bottom-color: var(--line); }.home-toolbox-end p { color: #9baec8; }
.home-about { position: relative; align-items: center; padding: 42px 36px; margin: 0 0 100px; border: 1px solid rgba(145, 170, 238, .22); border-radius: 10px; background: linear-gradient(100deg, rgba(31, 41, 78, .72), rgba(17, 25, 45, .45)); }
.home-about span:first-child { color: var(--violet); }.home-about p { max-width: 730px; font-size: clamp(1.15rem, 1.7vw, 1.6rem); line-height: 1.5; color: #d6dff0; letter-spacing: -.03em; }.home-about::after { content: "✳"; font-size: 3.6rem; color: rgba(134, 245, 232, .45); }
.home-apps-heading { padding-top: 48px; }.home-apps-heading h2 { font-size: clamp(3.1rem, 5.4vw, 5.7rem); line-height: 1.02; }.home-apps-heading p:last-child { color: #a2b2c9; }
.text-link { color: var(--acid); }.home-app-list { gap: 10px; }.home-app-list a { min-height: 106px; padding: 23px; border-color: rgba(149, 180, 231, .23); border-radius: 9px; background: linear-gradient(120deg, rgba(31, 43, 77, .68), rgba(15, 23, 43, .91)); }.home-app-list a:hover, .home-app-list a:focus-visible { border-color: var(--acid); background: #17243d; transform: translateY(-2px); }.home-app-list strong { font-size: 1.12rem; }.home-app-list small { color: #8fa1bb; }.home-app-list a:first-child small { color: var(--acid); }.home-app-list a > span:last-child { color: var(--acid); }

/* Toolbox index and the reference library. */
.toolbox-page:not(.utility-page) .toolbox-intro { padding: 86px 0 65px; background: radial-gradient(ellipse at 82% 45%, rgba(89, 99, 218, .14), transparent 53%); }
.toolbox-page .toolbox-intro h1, .apps-page .apps-intro h1 { letter-spacing: -.075em; }
.toolbox-glyphs { opacity: .12; color: #8ca3ff; }.toolbox-page .toolbox-intro-bottom > p:first-child { color: #adbad1; }
.use-note { border-left-color: rgba(134, 245, 232, .47); color: #8499b5; }
.toolbox-heading, .section-heading { border-bottom-color: var(--line); }.toolbox-heading h2, .section-heading h2 { font-size: .72rem; letter-spacing: .15em; }.toolbox-heading span { color: #8ea2c0; }
.section-description { color: #a6b5cc; }.web-utilities { padding-top: 58px; }.utility-grid { gap: 13px; }
.tool-card { border: 1px solid rgba(153, 186, 236, .2); border-radius: 10px; background: linear-gradient(145deg, #17223b, #10182b 60%, #111a2e); overflow: hidden; }
.toolbox-page .utility-card { min-height: 300px; }.tool-card::before { content: ""; position: absolute; width: 140px; height: 140px; right: -54px; top: -55px; border: 1px solid rgba(156, 196, 247, .13); border-radius: 50%; box-shadow: 0 0 0 25px rgba(156, 196, 247, .022), 0 0 0 50px rgba(156, 196, 247, .015); pointer-events: none; }
.toolbox-page .tool-card:hover, .toolbox-page .utility-card:hover { border-color: rgba(134, 245, 232, .66); background: linear-gradient(145deg, #1c2c48, #111e33); box-shadow: 0 15px 40px rgba(0,0,0,.2); transform: translateY(-2px); }
.tool-card h3 { color: #eff6ff; }.tool-card p { color: #a1b0c7; }.tool-card-meta, .tool-card-type { color: #9ab1cc; }
.tags span { border-color: rgba(154, 187, 233, .25); color: #abbed5; background: rgba(155, 183, 247, .045); }
.card-action, .filter-button, .text-button { border-color: rgba(154, 187, 233, .27); background: #111d31; color: #afc3db; border-radius: 6px; }
.card-action:hover, .filter-button:hover, .text-button:hover, .toolbox-page .card-action:hover, .toolbox-page .filter-button:hover { border-color: var(--acid); color: var(--acid); background: #19313f; }
.card-action.primary, .utility-card .card-action { color: var(--acid); border-color: rgba(134, 245, 232, .38); }
.toolbox-page .filter-button.is-active { background: rgba(134, 245, 232, .12); border-color: var(--acid); color: var(--acid); }.filter-button.is-active .filter-count { color: var(--acid); }
.search-box, .search-box input { background: #111d31; border-color: rgba(154, 187, 233, .27); color: var(--ink); }
.toolbox-workspace { padding-bottom: 110px; }.empty-state { color: #a6b5cc; }
.detail-dialog { background: #10192b; border-color: rgba(149, 190, 240, .32); color: var(--ink); }.detail-dialog::backdrop { background: rgba(3, 7, 18, .83); }.detail-header, .code-label { border-color: var(--line); background: #111f34; }.detail-description, .detail-notes { color: #abbad0; }.code-wrap, .code-wrap pre { background: #091323; border-color: var(--line); }

/* Desktop software and live utility surfaces. */
.apps-page .apps-intro { padding-top: 86px; border-bottom-color: var(--line); }.apps-intro-bottom p { color: #adbad1; }.apps-intro-bottom span { color: #9bafd0; }
.apps-projects .project-card { min-height: 264px; border: 1px solid rgba(156, 186, 237, .23); border-radius: 11px; background: linear-gradient(114deg, #17233d, #10192b 58%, #182141); }
.apps-projects .project-card:hover { border-color: var(--acid); background: linear-gradient(114deg, #1d3452, #13223a 65%, #232950); box-shadow: 0 20px 54px rgba(0,0,0,.25); }
.project-card::before { border-color: rgba(162, 194, 242, .14); box-shadow: 0 0 0 60px rgba(141, 183, 247, .018), 0 0 0 120px rgba(141, 183, 247, .009); }
.project-icon { border-radius: 12px; background: linear-gradient(140deg, #a2fff0, #73cbea); color: #071625; }.project-smtp .project-icon { background: linear-gradient(140deg, #c5baff, #8199ff); }.project-files .project-icon { background: linear-gradient(140deg, #ffd1a9, #ffac89); }
.project-label { color: var(--acid); }.project-copy p { color: #adbad1; }.project-card:hover .project-copy p { color: #d1def0; }.project-art { opacity: .13; }.project-card:hover .project-art { opacity: .24; }.project-art svg { stroke: #8ddff1; }.project-smtp .project-art svg { stroke: #a6a8ff; }.project-files .project-art svg { stroke: #ffc096; }
.project-status { border-color: rgba(158, 188, 231, .25); background: rgba(7, 14, 30, .66); }.project-status.is-live { border-color: rgba(134, 245, 232, .35); background: rgba(134, 245, 232, .055); }.project-status.is-live strong { color: var(--acid); }.project-status.is-live .project-status-dot { background: var(--acid); }.project-status small { color: #8797af; }
.open-arrow { border-color: rgba(164, 196, 240, .35); }.project-card:hover .open-arrow { background: var(--acid); color: #071625; }
.utility-page .toolbox-intro { border-bottom-color: var(--line); }.utility-page .back-link { color: #9fb5d0; }.utility-page .privacy-note { color: #9cdbdb; border-color: var(--acid); }
.options-panel, .results-panel, .hash-result { border-color: rgba(151, 185, 236, .22); background: #111b2e; }.field { color: #a6bad5; }.field input, .field select, .editor textarea, .utility-page textarea { border-color: rgba(150, 184, 232, .32); background: #0d1628; color: var(--ink); }.field input:focus-visible, .field select:focus-visible, .editor textarea:focus-visible, .utility-page textarea:focus-visible { border-color: var(--acid); outline-color: var(--acid); }
.editor-heading, .check { color: #c2d2e7; }.editor textarea::placeholder { color: #7388a5; }.utility-actions .primary { background: var(--acid); color: #071625; border-color: var(--acid); }.utility-status { color: #9eb3cd; }.hop-meta, .hash-result code { color: #adf2e8; }.file-drop { border-color: rgba(134, 245, 232, .43); background: #101b2e; }.file-drop.dragging { border-color: var(--acid); background: #19313f; }.file-drop input::file-selector-button { border-color: var(--acid); color: var(--acid); background: #13263b; }

/* Specialized tools retain their own layouts and behavior, with matching surfaces. */
.comparator-page .display-control, .comparator-page .info-card, .comparator-page .direct-comparison,
.phone-page .phone-picker, .phone-page .phone-overview, .phone-page .phone-direct, .phone-page .spec-panel, .phone-page .phone-summary, .phone-page .phone-sources,
.wizard-shell { background: #111b2e; border-color: rgba(151, 185, 236, .24); }
.comparator-page .display-control, .comparator-page .info-card, .phone-page .phone-picker, .phone-page .phone-overview { border-top-color: var(--display-color, var(--picker-color)); }
.comparator-page .visual-controls, .comparator-page .canvas-viewport { border-color: rgba(151, 185, 236, .24); background-color: #0d1729; }
.comparator-page .canvas-viewport { background-image: linear-gradient(rgba(145, 189, 238, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(145, 189, 238, .055) 1px, transparent 1px); }
.comparator-page .source-line a, .phone-page .source-line a, .phone-page .phone-sources a { color: var(--acid); }
.comparator-page .comparison-grid > div, .phone-page .direct-metric, .phone-page .bar-card { border-color: rgba(151, 185, 236, .24); background: #0d1729; }
.phone-page .phone-picker[data-side=a], .phone-page .phone-overview[data-side=a] { --picker-color: #86f5e8; }
.phone-page .phone-picker[data-side=b], .phone-page .phone-overview[data-side=b] { --picker-color: #a5a5ff; }
.phone-page .filter-toggle { border-color: rgba(151, 185, 236, .28); }
.phone-page .filter-toggle button[aria-pressed=true] { background: var(--acid); color: #071625; }
.phone-page .bar-track { background: #17243d; border-color: rgba(151, 185, 236, .26); }
.phone-page .bar-track i { background: var(--acid); }
.phone-page .bar-line:first-of-type .bar-track i, .phone-page .bar-line:nth-of-type(2) .bar-track i { background: var(--violet); }
.phone-page .spec-row { border-color: var(--line); }.phone-page .spec-row.is-unchanged { background: #0d1729; }.phone-page .spec-values { color: #d3e2f5; }.phone-page .spec-delta { color: #b7f4ee; }
.phone-page .phone-jump a { border-color: rgba(151, 185, 236, .3); color: #bbcee3; }.phone-page .phone-jump a:hover { border-color: var(--acid); color: var(--acid); }
.phone-page .direct-context b { color: var(--violet); border-color: var(--violet); }.phone-page .direct-context span:last-child b { color: var(--acid); border-color: var(--acid); }
.wizard-progress button.active, .outcome-group button.selected { background: rgba(134, 245, 232, .1); }.wizard-progress button.pass, .summary-list .pass strong { color: var(--acid); }.wizard-panel p, .wizard-panel li { color: #acbdd2; }.wizard-choice label { color: #d0deee; }
.wizard-actions .primary { color: #071625; }.diagnostic-note { border-color: var(--acid); background: rgba(134, 245, 232, .06); color: #bbe8e5 !important; }.command-box, .command-header, .summary-list li { border-color: var(--line); }.command-box pre { color: #d7e9f6; }
.zpl-notice { border-color: rgba(134, 245, 232, .36); background: rgba(134, 245, 232, .055); color: #b9cce0; }

footer { border-top-color: var(--line); color: #879ab6; }.footer-contact a { color: #d7e9f9; }.footer-contact a:hover { color: var(--acid); }.footer-contact a::before { color: #58708e; }
.command-backdrop { background: rgba(3, 7, 18, .82); }.command-palette { background: #101a2c; border-color: rgba(154, 190, 237, .32); }.command-title, .command-help { border-color: var(--line); }.command-list a.is-selected, .command-list a:hover, .command-list a:focus-visible { background: #1a2a43; border-color: rgba(134, 245, 232, .24); }.command-list a b, .command-list small { color: #8099b7; }.easter-egg { background: #15233a; border-color: rgba(134, 245, 232, .3); color: var(--acid); }

@media (max-width: 1130px) {
  .home-page .intro { grid-template-columns: 1fr; padding-bottom: 80px; }
  .home-page h1 { white-space: normal; }
  .hero-visual { height: 420px; max-width: 720px; width: 100%; }
  .visual-stage { height: 268px; }
  .home-page .hero-meta { margin-top: 45px; }
}
@media (max-width: 850px) {
  .site-header, main, footer { width: min(100% - 40px, 1320px); }
  .featured-content { grid-template-columns: 1fr; }
  .screen-art { min-height: 250px; }
  .home-about { margin-bottom: 70px; }
}
@media (max-width: 700px) {
  .site-header, main, footer { width: min(100% - 30px, 1320px); }
  .site-header { height: 72px; }
  .home-page .intro { min-height: 0; padding: 65px 0 74px; gap: 48px; }
  .home-page .intro .eyebrow { white-space: normal; font-size: .56rem; margin-bottom: 24px; }
  .home-page h1 { font-size: clamp(3.25rem, 13.6vw, 5.5rem); line-height: 1.02; }
  .home-page .lede { margin-top: 23px; font-size: .94rem; line-height: 1.7; }
  .hero-actions { margin-top: 27px; }
  .hero-actions .action-button { flex: 1 1 100%; }
  .home-page .hero-meta { margin-top: 37px; font-size: .5rem; }
  .hero-visual { height: 380px; }
  .visual-stage { height: 230px; }.orbit-outer { width: 280px; }.orbit-middle { width: 215px; }.orbit-inner { width: 155px; }.core { width: 122px; height: 122px; }.core > span { font-size: 2.9rem; }
  .node-a { top: 24px; left: calc(50% + 91px); }.node-b { bottom: 26px; left: calc(50% - 110px); }
  .home-section-intro h2 { font-size: clamp(3.3rem, 12vw, 4.5rem); }
  .featured-content { padding-top: 31px; }.featured-content h3 { font-size: clamp(2.4rem, 9vw, 3.5rem); }.featured-content .action-button { width: 100%; }
  .screen-art { min-height: 218px; }.screen-small { font-size: .35rem; }
  .home-utility-card { min-height: 245px; }.home-utility-card h3 { font-size: 1.5rem; }
  .home-about { padding: 27px 24px; }.home-about::after { display: none; }
  .home-apps-heading h2 { font-size: 3.3rem; }
  .toolbox-page:not(.utility-page) .toolbox-intro, .apps-page .apps-intro { padding-top: 66px; }
  .apps-projects .project-card { min-height: 0; }
}
@media (max-width: 380px) {
  .home-page h1 { font-size: 3.08rem; }
  .home-page .hero-meta { gap: 10px; }
  .visual-top { padding-inline: 12px; font-size: .48rem; }.visual-bottom { padding-inline: 12px; gap: 8px; }.visual-bottom strong { font-size: .67rem; }
}
@media (prefers-reduced-motion: reduce) { .orbit-outer { animation: none; } .home-utility-card, .home-app-list a { transition: none; } }