/* Portfolio skins inspired by the user's blue and blossom references. */
.skin-chip-crystal { background: conic-gradient(#1749e9 0 42%, #c7ecf8 42% 73%, #e8eefd 73%); }
.skin-chip-bloom { background: conic-gradient(#ef426f 0 35%, #ff9a72 35% 70%, #e6b9ef 70%); }

html[data-theme="crystal"] {
  --ink: #101b38;
  --muted: #63718c;
  --navy: #101b38;
  --line: #d9e4f8;
  --mint: #a9e9f1;
  --lilac: #8daaff;
  --orange: #56cce7;
  --paper: #f8fbff;
  --surface: #fff;
  --forest: #1b4be5;
  --sage: #dce9ff;
  --brass: #72b7ee;
  --blue: #96dff4;
  --clay: #a8bfff;
  scrollbar-color: #5073c5 #e7efff;
}
html[data-theme="crystal"] body { background: #f8fbff; }
html[data-theme="crystal"] ::selection { background: #b9d4ff; color: #071f60; }
html[data-theme="crystal"] :focus-visible { outline-color: #245bea; }
html[data-theme="crystal"] :is(.nav-main,.nav-actions) { background: rgba(255,255,255,.9); border-color: #e4ebfb; }
html[data-theme="crystal"] .nav-dropdown { border-color: #dbe7fc; }
html[data-theme="crystal"] .nav-dropdown a:hover { color: #245bea; }
html[data-theme="crystal"] .nav-dropdown .nav-detail { background: #e8f2ff; }
html[data-theme="crystal"] .nav-detail p { color: #586f9a; }
html[data-theme="crystal"] .nav-overlay { background: #1b377333; }
html[data-theme="crystal"] .wordmark small { color: #7184b0; }
html[data-theme="crystal"] .footer-top>a::after { color: #1c4de7; }
html[data-theme="crystal"] .button-black,
html[data-theme="crystal"] .hero-actions .button-black { background: #194ae9; color: #fff; box-shadow: 0 9px 24px #194ae92b; }
html[data-theme="crystal"] .button-black:hover,
html[data-theme="crystal"] .hero-actions .button-black:hover { background: #0a31b9; }
html[data-theme="crystal"] .button-soft { color: #1746c6; background: #ebf2ff; }
html[data-theme="crystal"] .hero-actions .button-soft { border-color: #bfd4fb; }
html[data-theme="crystal"] .hero { background: radial-gradient(ellipse at 77% 45%, #e8f3ff 0, #f9fbff 46%, #fff 82%); }
html[data-theme="crystal"] .hero h1 span { color: #111a32; }
html[data-theme="crystal"] .hero-copy::before { color: #4277eb; }
html[data-theme="crystal"] .hero-copy>p { color: #63728e; }
html[data-theme="crystal"] .logo-track .tool-logo { color: #293a5e; }
html[data-theme="crystal"] .marquee-pause { color: #5076ca; }
html[data-theme="crystal"] .stat-blue { background: #1d50ed; color: #fff; }
html[data-theme="crystal"] .stat-blue>p { color: #e8efff; }
html[data-theme="crystal"] .stat-blue .tag { background: #ffffff20; color: #fff; border-color: #ffffff35; }
html[data-theme="crystal"] .stat-pink { background: #9ee8f3; color: #153860; }
html[data-theme="crystal"] .stat-pink>p { color: #26536e; }
html[data-theme="crystal"] .stat-pink .tag { color: #153860; background: #ffffff50; border-color: #ffffff80; }
html[data-theme="crystal"] .stat-peach { background: #c8d5ff; color: #243264; }
html[data-theme="crystal"] .stat-peach>p { color: #4c5681; }
html[data-theme="crystal"] .stat-blue::after { background: #83e2f1; }
html[data-theme="crystal"] .stat-pink::after { background: #5a75e6; }
html[data-theme="crystal"] :is(.stat-card:first-child::before,.stat-card:last-child::after) { background: #fff; }
html[data-theme="crystal"] .section-rule i { background: #dce7fa; }
html[data-theme="crystal"] .cloud { background: linear-gradient(#fff,#f4f8ff 34%,#e6f7ff); }
html[data-theme="crystal"] .cloud-tabs button[aria-selected="true"] { background: #1d4dec; color: #fff; box-shadow: inset 0 -3px #87ccf6; }
html[data-theme="crystal"] .cloud-tabs button:not([aria-selected="true"]):hover { background: #e7f0ff; }
html[data-theme="crystal"] .feature-trigger { color: #65718d; }
html[data-theme="crystal"] .feature-trigger[aria-expanded="true"] { color: #153167; }
html[data-theme="crystal"] .feature-icon { background: #e9efff; }
html[data-theme="crystal"] .feature-trigger[aria-expanded="true"] .feature-icon { background: #bfddff; }
html[data-theme="crystal"] .cloud:has([data-tab="compute"][aria-selected="true"]) .feature-trigger[aria-expanded="true"] .feature-icon { background: #b9f0f6; }
html[data-theme="crystal"] .cloud:has([data-tab="shaping"][aria-selected="true"]) .feature-trigger[aria-expanded="true"] .feature-icon { background: #d8d9ff; }
html[data-theme="crystal"] .feature-description p { color: #64728a; }
html[data-theme="crystal"] :is(.feature-visual,.feature-visual>#feature-video) { background: #dcf4ff; }
html[data-theme="crystal"] .sandbox-code { background: #101b38; color: #eef4ff; }
html[data-theme="crystal"] .sandbox-code button { background: #254595; color: #fff; }
html[data-theme="crystal"] .research { background: linear-gradient(#111d3cbd,#111d3cd2),url('assets/portfolio-ink-marble.png') center / cover no-repeat; color: #f7faff; }
html[data-theme="crystal"] .research-heading p { color: #b6c8e9; }
html[data-theme="crystal"] .arrow-controls button { background: #244584; color: #fff; }
html[data-theme="crystal"] .research-card { background: #163b82; border-top-color: #88c9ff; }
html[data-theme="crystal"] .research-card:nth-child(3n + 2) { background: #116682; border-top-color: #8fe6f0; }
html[data-theme="crystal"] .research-card:nth-child(3n) { background: #34488b; border-top-color: #afbfff; }
html[data-theme="crystal"] .research-card:hover { background: #275aaf; }
html[data-theme="crystal"] .research-card::before { background: linear-gradient(140deg,#9ccaff21,transparent); }
html[data-theme="crystal"] .research-card::after { background: #d8ecff; }
html[data-theme="crystal"] .research-card .tag { background: #ffffff22; color: #e9f4ff; }
html[data-theme="crystal"] .research-card .authors { color: #c2d6f7; }
html[data-theme="crystal"] .research-logos img { filter: grayscale(1) brightness(1.6); }
html[data-theme="crystal"] .research-logos img+img { border-color: #48669b; }
html[data-theme="crystal"] .story-card { background: #183467; }
html[data-theme="crystal"] .story-card::after { background: linear-gradient(transparent,rgba(9,26,67,.86)); }
html[data-theme="crystal"] .play-story { background: #204181bb; border-color: #c8e2ff; color: #fff; }
html[data-theme="crystal"] .news-small { border-color: #dce6f8; }
html[data-theme="crystal"] :is(.news-feature p,.news-small p) { color: #65728e; }
html[data-theme="crystal"] .closing { background: linear-gradient(#fff,#e9f2ff); }
html[data-theme="crystal"] .footer-card { background: rgba(255,255,255,.79); border-top-color: #2352e6; box-shadow: 0 24px 72px #1739891f; }
html[data-theme="crystal"] .footer-column { border-color: #dce8fc; }
html[data-theme="crystal"] :is(.footer-column h3,.footer-bottom p) { color: #6b7793; }
html[data-theme="crystal"] .footer-wordmark { color: #1d42bd; opacity: .86; }
html[data-theme="crystal"] .footer-wordmark span { color: #51c8e5; }
html[data-theme="crystal"] .footer-bottom { border-color: #bbcef3; }
html[data-theme="crystal"] .footer-bottom>div { color: #526887; }
html[data-theme="crystal"] .social-links img { filter: none; }
html[data-theme="crystal"] dialog::backdrop { background: #0c1e4abc; }
html[data-theme="crystal"] .video-dialog { background: #162b5c; color: #f2f7ff; }
html[data-theme="crystal"] .video-dialog p { color: #d4e1fa; }
html[data-theme="crystal"] .cookie-dialog { background: #fff; color: #101b38; }
html[data-theme="crystal"] .cookie-dialog p { color: #64718e; }
html[data-theme="crystal"] .portfolio-dialog { border-color: #bdd3ff; box-shadow: 0 30px 100px #0f2a6952; }
html[data-theme="crystal"] .portfolio-header { border-bottom-color: #4d74e9; }
html[data-theme="crystal"] .portfolio-eyebrow { color: #4c6faa; }
html[data-theme="crystal"] .portfolio-close { color: #1947cd; background: #eaf1ff; border-color: #c6d6fa; }
html[data-theme="crystal"] .portfolio-close:hover { background: #d6e5ff; }
html[data-theme="crystal"] .portfolio-scroll-track { background: #e5efff; border-color: #c9dafb; }
html[data-theme="crystal"] .portfolio-scroll-thumb { background: #3159d9; border-color: #1741ba; }
html[data-theme="crystal"] :is(.portfolio-loading,.portfolio-markdown p,.portfolio-markdown li,.portfolio-markdown figcaption) { color: #5d6c89; }
html[data-theme="crystal"] .portfolio-markdown a { color: #2154c8; }
html[data-theme="crystal"] .portfolio-markdown blockquote { background: #e9f7ff; border-color: #7dcce8; color: #1c4e78; }
html[data-theme="crystal"] :is(.skin-toggle,.skin-options) { background: rgba(255,255,255,.94); border-color: #cbddff; }
html[data-theme="crystal"] .skin-option { background: #f1f6ff; border-color: #dce8fd; }
html[data-theme="crystal"] .skin-toggle-label { color: #667aa4; }
html[data-theme="crystal"] .skin-option[aria-pressed="true"] { background: #e1edff; border-color: #4168ea; box-shadow: inset 0 0 0 1px #4168ea; }
html[data-theme="crystal"] .skin-swatches i:nth-child(1) { background: #1d50ed; }
html[data-theme="crystal"] .skin-swatches i:nth-child(2) { background: #9ee8f3; }
html[data-theme="crystal"] .skin-swatches i:nth-child(3) { background: #d4ddff; }

html[data-theme="bloom"] {
  --ink: #33242d;
  --muted: #7b6b75;
  --navy: #2e2135;
  --line: #f0dbe7;
  --mint: #ffd2df;
  --lilac: #dfa9e9;
  --orange: #ff9566;
  --paper: #fff8fb;
  --surface: #fff;
  --forest: #d8376c;
  --sage: #f7d8ef;
  --brass: #f3a37d;
  --blue: #d7c4f5;
  --clay: #ffae90;
  scrollbar-color: #cf5c8b #f9eaf1;
}
html[data-theme="bloom"] body { background: #fffafc; }
html[data-theme="bloom"] ::selection { background: #ffc4da; color: #57223a; }
html[data-theme="bloom"] :focus-visible { outline-color: #e83a78; }
html[data-theme="bloom"] :is(.nav-main,.nav-actions) { background: rgba(255,255,255,.84); border-color: #f5e3ed; }
html[data-theme="bloom"] .nav-dropdown { border-color: #f5dce9; }
html[data-theme="bloom"] .nav-dropdown a:hover { color: #db326b; }
html[data-theme="bloom"] .nav-dropdown .nav-detail { background: #fff0f6; }
html[data-theme="bloom"] .nav-detail p { color: #8a6c7e; }
html[data-theme="bloom"] .nav-overlay { background: #7a315544; }
html[data-theme="bloom"] .wordmark small { color: #a27387; }
html[data-theme="bloom"] .footer-top>a::after { color: #d7396a; }
html[data-theme="bloom"] .button-black,
html[data-theme="bloom"] .hero-actions .button-black { background: linear-gradient(105deg,#ea386f,#ff9565); color: #fff; box-shadow: 0 10px 24px #ea386f35; }
html[data-theme="bloom"] .button-black:hover,
html[data-theme="bloom"] .hero-actions .button-black:hover { background: linear-gradient(105deg,#d8225b,#f6784c); }
html[data-theme="bloom"] .button-soft { color: #a4385e; background: #fff0f5; }
html[data-theme="bloom"] .hero-actions .button-soft { border-color: #f4bfd1; }
html[data-theme="bloom"] .hero { background: radial-gradient(ellipse at 79% 51%,#ffedec 0,#fff8fb 50%,#fffdfd 85%); }
html[data-theme="bloom"] .hero h1 span { color: #38272f; }
html[data-theme="bloom"] .hero h1 em { font-style: normal; color: #e85b72; }
html[data-theme="bloom"] .hero-copy::before { color: #ed7867; }
html[data-theme="bloom"] .hero-copy>p { color: #82717f; }
html[data-theme="bloom"] .logo-track .tool-logo { color: #5e4a59; }
html[data-theme="bloom"] .marquee-pause { color: #b95b82; }
html[data-theme="bloom"] .stat-blue { background: #ffb3a1; color: #6a2b36; }
html[data-theme="bloom"] .stat-blue>p { color: #7f4452; }
html[data-theme="bloom"] .stat-pink { background: #d63570; color: #fff; }
html[data-theme="bloom"] .stat-pink>p { color: #ffe5ef; }
html[data-theme="bloom"] .stat-pink .tag { color: #fff; background: #ffffff20; border-color: #ffffff35; }
html[data-theme="bloom"] .stat-peach { background: #d7b8ec; color: #492b57; }
html[data-theme="bloom"] .stat-peach>p { color: #64476d; }
html[data-theme="bloom"] .stat-blue::after { background: #f45a8c; }
html[data-theme="bloom"] .stat-pink::after { background: #ffa778; }
html[data-theme="bloom"] :is(.stat-card:first-child::before,.stat-card:last-child::after) { background: #fff; }
html[data-theme="bloom"] .section-rule i { background: #f5dce7; }
html[data-theme="bloom"] .cloud { background: linear-gradient(#fffdfd,#fff4f8 35%,#ffe7ed); }
html[data-theme="bloom"] .cloud-tabs button[aria-selected="true"] { background: #dc3871; color: #fff; box-shadow: inset 0 -3px #ffab94; }
html[data-theme="bloom"] .cloud-tabs button:not([aria-selected="true"]):hover { background: #ffe5ee; }
html[data-theme="bloom"] .feature-trigger { color: #806e7b; }
html[data-theme="bloom"] .feature-trigger[aria-expanded="true"] { color: #6e2b4d; }
html[data-theme="bloom"] .feature-icon { background: #fae8ef; }
html[data-theme="bloom"] .feature-trigger[aria-expanded="true"] .feature-icon { background: #ffc7d9; }
html[data-theme="bloom"] .cloud:has([data-tab="compute"][aria-selected="true"]) .feature-trigger[aria-expanded="true"] .feature-icon { background: #ffcfb8; }
html[data-theme="bloom"] .cloud:has([data-tab="shaping"][aria-selected="true"]) .feature-trigger[aria-expanded="true"] .feature-icon { background: #e7cdf5; }
html[data-theme="bloom"] .feature-description p { color: #806f7a; }
html[data-theme="bloom"] :is(.feature-visual,.feature-visual>#feature-video) { background: #ffe8f1; }
html[data-theme="bloom"] .sandbox-code { background: #3d2841; color: #fff5fa; }
html[data-theme="bloom"] .sandbox-code button { background: #814d73; color: #fff; }
html[data-theme="bloom"] .research { background: linear-gradient(#352037bd,#352037d0),url('assets/portfolio-ink-marble.png') center / cover no-repeat; color: #fff6fa; }
html[data-theme="bloom"] .research-heading p { color: #efcbd9; }
html[data-theme="bloom"] .arrow-controls button { background: #70435e; color: #fff; }
html[data-theme="bloom"] .research-card { background: #a62f62; border-top-color: #ffb5ca; }
html[data-theme="bloom"] .research-card:nth-child(3n + 2) { background: #87568e; border-top-color: #ddb6ed; }
html[data-theme="bloom"] .research-card:nth-child(3n) { background: #ba635a; border-top-color: #ffbd9d; }
html[data-theme="bloom"] .research-card:hover { background: #bc477b; }
html[data-theme="bloom"] .research-card::before { background: linear-gradient(140deg,#ffc6dc22,transparent); }
html[data-theme="bloom"] .research-card::after { background: #ffe3ed; }
html[data-theme="bloom"] .research-card .tag { background: #ffffff24; color: #fff3f8; }
html[data-theme="bloom"] .research-card .authors { color: #ffe0eb; }
html[data-theme="bloom"] .research-logos img { filter: grayscale(1) brightness(1.7); }
html[data-theme="bloom"] .research-logos img+img { border-color: #805568; }
html[data-theme="bloom"] .story-card { background: #552f4a; }
html[data-theme="bloom"] .story-card::after { background: linear-gradient(transparent,rgba(61,25,51,.84)); }
html[data-theme="bloom"] .play-story { background: #9d426cb8; border-color: #ffd6e5; color: #fff; }
html[data-theme="bloom"] .news-small { border-color: #f1dbe6; }
html[data-theme="bloom"] :is(.news-feature p,.news-small p) { color: #82717d; }
html[data-theme="bloom"] .closing { background: linear-gradient(#fffafd,#ffe8f1); }
html[data-theme="bloom"] .footer-card { background: rgba(255,255,255,.78); border-top-color: #dc4d79; box-shadow: 0 24px 72px #6f255a24; }
html[data-theme="bloom"] .footer-column { border-color: #efd9e4; }
html[data-theme="bloom"] :is(.footer-column h3,.footer-bottom p) { color: #856c7a; }
html[data-theme="bloom"] .footer-wordmark { color: #87425f; opacity: .88; }
html[data-theme="bloom"] .footer-wordmark span { color: #f38c71; }
html[data-theme="bloom"] .footer-bottom { border-color: #eed2e1; }
html[data-theme="bloom"] .footer-bottom>div { color: #7d6172; }
html[data-theme="bloom"] .social-links img { filter: none; }
html[data-theme="bloom"] dialog::backdrop { background: #32142bbd; }
html[data-theme="bloom"] .video-dialog { background: #44263f; color: #fff6fa; }
html[data-theme="bloom"] .video-dialog p { color: #f3d2e0; }
html[data-theme="bloom"] .cookie-dialog { background: #fff; color: #33242d; }
html[data-theme="bloom"] .cookie-dialog p { color: #806b79; }
html[data-theme="bloom"] .portfolio-dialog { border-color: #f0bfd2; box-shadow: 0 30px 100px #6e294b52; }
html[data-theme="bloom"] .portfolio-header { border-bottom-color: #eb7091; }
html[data-theme="bloom"] .portfolio-eyebrow { color: #ae5879; }
html[data-theme="bloom"] .portfolio-close { color: #ba3563; background: #fff0f6; border-color: #f4c9d7; }
html[data-theme="bloom"] .portfolio-close:hover { background: #ffdae8; }
html[data-theme="bloom"] .portfolio-scroll-track { background: #fbe9f0; border-color: #f4cadc; }
html[data-theme="bloom"] .portfolio-scroll-thumb { background: #df5a89; border-color: #be3569; }
html[data-theme="bloom"] :is(.portfolio-loading,.portfolio-markdown p,.portfolio-markdown li,.portfolio-markdown figcaption) { color: #7d6574; }
html[data-theme="bloom"] .portfolio-markdown a { color: #ca3f70; }
html[data-theme="bloom"] .portfolio-markdown blockquote { background: #fff0f5; border-color: #f3a2bd; color: #79395a; }
html[data-theme="bloom"] :is(.skin-toggle,.skin-options) { background: rgba(255,255,255,.94); border-color: #f0cddd; }
html[data-theme="bloom"] .skin-option { background: #fff4f8; border-color: #f3dbe6; }
html[data-theme="bloom"] .skin-toggle-label { color: #9c6a80; }
html[data-theme="bloom"] .skin-option[aria-pressed="true"] { background: #ffe8f0; border-color: #df5c8a; box-shadow: inset 0 0 0 1px #df5c8a; }
html[data-theme="bloom"] .skin-swatches i:nth-child(1) { background: #e54778; }
html[data-theme="bloom"] .skin-swatches i:nth-child(2) { background: #ff9b72; }
html[data-theme="bloom"] .skin-swatches i:nth-child(3) { background: #d9b8ec; }

@media(max-width:767px) {
  html:is([data-theme="forest"],[data-theme="crystal"],[data-theme="bloom"]) .skin-toggle-label { display: none; }
  html:is([data-theme="forest"],[data-theme="crystal"],[data-theme="bloom"]) .skin-toggle { min-height: 39px; padding: 7px 10px; }
}