/* An irregular, softly edged silhouette rather than an oval panel. No assets. */
body[data-page="sky"] {
  --clouds-outline: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 420' preserveAspectRatio='none'%3E%3Cfilter id='s' x='-3%25' y='-4%25' width='106%25' height='108%25'%3E%3CfeGaussianBlur stdDeviation='1.1'/%3E%3C/filter%3E%3Cpath fill='white' filter='url(%23s)' d='M109 342C64 350 23 320 24 279C24 242 48 215 81 212C73 165 107 125 151 127C175 80 241 76 274 111C303 65 372 62 411 105C466 80 522 111 527 159C583 151 622 190 613 238C650 267 639 326 597 346C560 367 512 361 480 359C439 390 375 380 344 363C301 392 246 382 216 363C181 374 136 368 109 342Z'/%3E%3C/svg%3E");
  --clouds-note-outline: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 700' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M112 625C58 628 26 590 32 543C1 505 11 451 44 425C14 387 21 338 52 313C20 272 28 215 68 192C45 144 80 99 125 96C147 44 208 28 253 61C294 10 361 14 401 53C445 8 516 18 549 64C597 30 663 49 684 96C738 69 796 105 801 150C853 151 879 196 863 240C903 270 901 322 872 356C901 397 887 446 861 468C885 519 860 564 818 580C804 630 751 653 710 633C666 676 607 667 572 642C526 676 471 669 435 644C390 677 331 663 303 638C257 666 203 647 180 624C155 638 130 637 112 625Z'/%3E%3C/svg%3E");
}
.clouds-deck { position: relative; margin-top: 28px; }
.clouds-item[hidden],.clouds-navigation[hidden] { display: none !important; }
.clouds-track { list-style: none; display: grid; grid-template-columns: repeat(var(--clouds-columns,3),minmax(0,1fr)); gap: 12px; margin: 0 auto; padding: 0; max-width: 1280px; align-items: center; }
.clouds-track:has(> :nth-child(2):last-child) { max-width: 1040px; }
.clouds-deck[data-clouds-single="true"] .clouds-track { max-width: 455px; }
.clouds-item { min-width: 0; position: relative; animation: clouds-arrive .65s cubic-bezier(.2,.7,.3,1) both; }
.clouds-card {
  position: relative; display: block; width: 100%; min-height: 360px; padding: 0; color: var(--sky-cloud-ink,#1b3047);
  isolation: isolate; background: transparent; text-align: center; cursor: pointer;
  filter: drop-shadow(0 14px 17px #112d441a); animation: clouds-drift 12s ease-in-out infinite; animation-delay: var(--clouds-delay,0s);
}
.clouds-face { position: absolute; inset: 0; z-index: -1; pointer-events: none; background-color: var(--sky-cloud,#fbfcff); mask: var(--clouds-outline) center / 100% 100% no-repeat; transition: background-color var(--sky-duration,1800ms) var(--sky-ease,ease); }
.clouds-face::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 19% 12% at 27% 28%,#ffffff75,transparent),radial-gradient(ellipse 16% 12% at 56% 22%,#ffffff57,transparent),radial-gradient(ellipse 14% 13% at 84% 46%,#ffffff45,transparent),linear-gradient(180deg,transparent 81%,#51789e16); }
.clouds-copy { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 360px; padding: 96px 16% 62px; }
.clouds-mark { display: flex; align-items: center; gap: 8px; font-size: 11px; letter-spacing: .09em; color: var(--sky-cloud-muted,#475e74); }
.clouds-mark .icon { width: 20px; height: 20px; }
.clouds-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font: 400 25px/1.18 Golos,sans-serif; letter-spacing: -.035em; margin-top: 12px; overflow-wrap: anywhere; }
.clouds-excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font: 400 14px/1.65 Golos,sans-serif; color: var(--sky-cloud-muted,#475e74); margin-top: 12px; overflow-wrap: anywhere; }
.clouds-read { display: inline-flex; align-items: center; gap: 12px; margin-top: 16px; font: 400 12px/1.5 Golos,sans-serif; }
.clouds-read .icon { width: 16px; height: 16px; transition: transform .2s; }
.clouds-card:hover .clouds-read .icon { transform: translateX(4px); }
.clouds-card:focus-visible { outline: none; }
.clouds-card:focus-visible .clouds-read { outline: 2px solid currentColor; outline-offset: 6px; border-radius: 3px; }
.clouds-deck:hover .clouds-card,.clouds-deck:focus-within .clouds-card,.clouds-deck[data-clouds-paused="true"] .clouds-card { animation-play-state: paused; }
.clouds-navigation { display: flex; align-items: center; justify-content: center; gap: 19px; margin-top: 12px; }
.clouds-nav-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid #d5e9ff88; border-radius: 50%; background: #18344de8; color: #f1f7ff; }
.clouds-nav-button .icon { width: 18px; height: 18px; }
.clouds-nav-button:hover { background: #2a4c6b; }
.clouds-nav-button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.clouds-counter { display: inline-flex; gap: 12px; min-width: 75px; justify-content: center; font: 400 12px/1.5 'Courier New',monospace; color: #f3f8ff; }
.clouds-counter > span:nth-child(2) { opacity: .5; }
.clouds-add { display: flex; justify-content: center; margin-top: 22px; }
.clouds-add > button { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 17px; border: 1px dashed #e8f5ff9c; border-radius: 999px; color: #f4f9ff; background: #17364dba; font: 400 13px/1.5 Golos,sans-serif; }
.clouds-add .icon { width: 17px; height: 17px; }
.clouds-add > button:hover { background: #244963; }
.clouds-add > button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.clouds-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@keyframes clouds-drift { 0%,100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@keyframes clouds-arrive { from { opacity: .35; transform: translateX(16px); } to { opacity: 1; transform: translateX(0); } }

body[data-page="sky"][data-sky-mode="dawn"] { --clouds-summer-glow: #ffe1b875; }
body[data-page="sky"][data-sky-mode="day"] { --clouds-summer-glow: #fff1c86b; }
body[data-page="sky"][data-sky-mode="dusk"] { --clouds-summer-glow: #f7bdd865; }
body[data-page="sky"][data-sky-mode="night"] { --clouds-summer-glow: #c0d8f04d; }
body[data-page="sky"][data-sky-season="summer"] .clouds-card { filter: drop-shadow(0 -5px 12px var(--clouds-summer-glow)) drop-shadow(0 17px 20px #112d4424); transition: filter var(--sky-duration,1800ms) var(--sky-ease,ease); }
body[data-page="sky"][data-sky-season="summer"] .clouds-face::before { background: radial-gradient(ellipse 19% 12% at 27% 28%,#ffffffa3,transparent),radial-gradient(ellipse 16% 12% at 56% 22%,#ffffff75,transparent),radial-gradient(ellipse 14% 13% at 84% 46%,#ffffff52,transparent),linear-gradient(180deg,transparent 81%,#51789e1a); }

body[data-page="sky"][data-sky-season="winter"] .clouds-card { filter: drop-shadow(0 15px 20px #112c452b); }
body[data-page="sky"][data-sky-season="winter"] .clouds-face::after { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: var(--sky-ice-branches),var(--sky-ice-branches); background-position: 64% 22%,19% 66%; background-size: 120px 120px,90px 90px; background-repeat: no-repeat; opacity: .72; mask-image: radial-gradient(ellipse at center,transparent 49%,#000 78%); }

/* Only the background has a cloud mask: the close button and text stay intact. */
body[data-page="sky"] dialog.cloud-note-modal { width: min(940px,calc(100% - 28px)); padding: 0; border: 0; border-radius: 0; max-height: none; overflow: visible; background: transparent; box-shadow: none; color: var(--sky-cloud-ink); }
body[data-page="sky"] dialog.cloud-note-modal .cloud-note-content { position: relative; isolation: isolate; display: flex; flex-direction: column; min-height: 390px; max-height: min(760px,calc(100dvh - 40px)); padding: 105px 12% 93px; filter: drop-shadow(0 25px 45px #07172d50); }
body[data-page="sky"] dialog.cloud-note-modal .cloud-note-content::before { content: ''; position: absolute; inset: 0; z-index: -1; background-color: var(--sky-cloud); mask: var(--clouds-note-outline) center / 100% 100% no-repeat; transition: background-color var(--sky-duration,1800ms) var(--sky-ease,ease); }
body[data-page="sky"] dialog.cloud-note-modal .cloud-note-content > .eyebrow { flex-shrink: 0; font-size: 10px; color: var(--sky-cloud-muted); }
body[data-page="sky"] dialog.cloud-note-modal h2 { flex-shrink: 0; font: 400 clamp(27px,3.2vw,39px)/1.15 Golos,sans-serif; letter-spacing: -.035em; margin: 13px 0 0; max-width: 100%; overflow-wrap: anywhere; }
body[data-page="sky"] dialog.cloud-note-modal .cloud-full-text { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--sky-line) transparent; color: var(--sky-cloud-muted); padding: 0 8px 0 0; margin-top: 22px; font-size: 16px; line-height: 1.85; }
body[data-page="sky"] dialog.cloud-note-modal .cloud-full-text::-webkit-scrollbar { width: 4px; }
body[data-page="sky"] dialog.cloud-note-modal .cloud-full-text::-webkit-scrollbar-thumb { background: var(--sky-line); border-radius: 4px; }
body[data-page="sky"] dialog.cloud-note-modal .modal-bottom { flex-shrink: 0; margin-top: 22px; padding-top: 17px; border-color: var(--sky-line); font-size: 12px; }
body[data-page="sky"] dialog.cloud-note-modal .modal-bottom .text-link { min-height: 44px; font-size: 12px; }
body[data-page="sky"] dialog.cloud-note-modal .modal-close { z-index: 4; right: 40px; top: 32px; width: 44px; height: 44px; border: 1px solid var(--sky-line); border-radius: 50%; background: var(--sky-cloud); color: var(--sky-cloud-ink); }
body[data-page="sky"][data-sky-season="winter"] dialog.cloud-note-modal .cloud-note-content::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: var(--sky-ice-branches) 79% 10% / 180px 180px no-repeat; mask-image: radial-gradient(ellipse at center,transparent 60%,#000 87%); }
@media(max-width:1000px) { .clouds-track { max-width: 900px; }.clouds-title { font-size: 24px; } }
@media(max-width:640px) {
  .clouds-deck { margin-top: 13px; }.clouds-track { gap: 0; max-width: 430px; }
  .clouds-card,.clouds-copy { min-height: 345px; }.clouds-copy { padding: 90px 16% 60px; }
  .clouds-title { font-size: 24px; }.clouds-excerpt { font-size: 14px; }.clouds-navigation { margin-top: 5px; }
  body[data-page="sky"] dialog.cloud-note-modal { width: calc(100% - 12px); }
  body[data-page="sky"] dialog.cloud-note-modal .cloud-note-content { padding: 83px 10% 70px; min-height: 340px; max-height: calc(100dvh - 24px); }
  body[data-page="sky"] dialog.cloud-note-modal h2 { font-size: 28px; margin-top: 11px; }
  body[data-page="sky"] dialog.cloud-note-modal .cloud-full-text { font-size: 15px; line-height: 1.8; margin-top: 17px; }
  body[data-page="sky"] dialog.cloud-note-modal .modal-close { top: 19px; right: 18px; }
  body[data-page="sky"] dialog.cloud-note-modal .modal-bottom { margin-top: 15px; padding-top: 11px; gap: 8px; flex-wrap: wrap; }
}
@media(max-height:500px) {
  body[data-page="sky"] dialog.cloud-note-modal .cloud-note-content { padding-block: 62px 49px; min-height: 0; }
  body[data-page="sky"] dialog.cloud-note-modal h2 { font-size: 25px; }
  body[data-page="sky"] dialog.cloud-note-modal .cloud-full-text { margin-top: 12px; }
  body[data-page="sky"] dialog.cloud-note-modal .modal-bottom { margin-top: 12px; padding-top: 7px; }
}
@media(prefers-reduced-motion:reduce) { .clouds-card,.clouds-item { animation: none; }.clouds-card,.clouds-face,.clouds-read .icon { transition: none !important; } }

.cloud-note-content h2:focus{outline:none}

body[data-page="sky"][data-sky-mode] dialog.cloud-note-modal{background:transparent;box-shadow:none;transition:none}

/* Season artwork is painted by persistent opacity layers, never swapped URLs. */
.season-decoration-set[data-season-detail="cloud"] :is(.season-detail--spring,.season-detail--summer,.season-detail--autumn) {background-image:none;}
body[data-page="sky"][data-sky-mode][data-sky-season] .clouds-face,
body[data-page="sky"][data-sky-mode][data-sky-season] dialog.cloud-note-modal .cloud-note-content::before {
  background-color:color-mix(in srgb,var(--sky-cloud),var(--season-tint) 32%);
  transition:background-color var(--sky-duration,1800ms) var(--sky-ease,ease);
}
body[data-page="sky"][data-sky-mode][data-sky-season] .clouds-card {
  filter:drop-shadow(0 -4px 9px var(--season-light)) drop-shadow(0 17px 21px var(--season-shadow));
  transition:filter var(--sky-duration,1800ms) var(--sky-ease,ease);
}
body[data-page="sky"][data-sky-mode][data-sky-season] .clouds-face::before {background:radial-gradient(ellipse 22% 13% at 30% 28%,#ffffff85,transparent),radial-gradient(ellipse 18% 12% at 57% 24%,#ffffff60,transparent),linear-gradient(180deg,transparent 78%,#51789e16);}
body[data-page="sky"][data-sky-mode][data-sky-season] .clouds-card::after,
body[data-page="sky"][data-sky-mode][data-sky-season] .clouds-face::after,
body[data-page="sky"][data-sky-mode][data-sky-season] dialog.cloud-note-modal::after,
body[data-page="sky"][data-sky-mode][data-sky-season] dialog.cloud-note-modal .cloud-note-content::after {content:none;}
.season-decoration-set[data-season-detail="cloud"] .season-detail {top:15px;right:22%;width:96px;height:76px;}
.season-decoration-set[data-season-detail="note"] .season-detail {top:14px;right:23%;width:110px;height:84px;}
.season-decoration-set:is([data-season-detail="cloud"],[data-season-detail="note"]) .season-detail--winter {inset:0;width:auto;height:auto;padding:0;background-image:var(--season-frost),var(--season-frost);background-position:79% 19%,19% 66%;background-size:140px 140px,95px 95px;-webkit-mask-image:var(--clouds-outline),radial-gradient(ellipse at center,transparent 49%,#000 78%);-webkit-mask-size:100% 100%,100% 100%;-webkit-mask-repeat:no-repeat;-webkit-mask-composite:source-in;mask-image:var(--clouds-outline),radial-gradient(ellipse at center,transparent 49%,#000 78%);mask-size:100% 100%,100% 100%;mask-repeat:no-repeat;mask-composite:intersect;}
.season-decoration-set[data-season-detail="note"] .season-detail--winter {-webkit-mask-image:var(--clouds-note-outline),radial-gradient(ellipse at center,transparent 60%,#000 87%);mask-image:var(--clouds-note-outline),radial-gradient(ellipse at center,transparent 60%,#000 87%);}
body[data-page="sky"][data-sky-mode][data-sky-season] dialog.cloud-note-modal .modal-close {background-color:color-mix(in srgb,var(--sky-cloud),var(--season-tint) 32%);border-color:color-mix(in srgb,var(--sky-line),var(--season-edge) 53%);transition:background-color var(--sky-duration,1800ms) var(--sky-ease,ease),border-color var(--sky-duration,1800ms) var(--sky-ease,ease);}
body[data-page="sky"][data-sky-mode][data-sky-season] :is(.clouds-nav-button,.clouds-add > button) {transition:background-color var(--sky-duration,1800ms) var(--sky-ease,ease),border-color var(--sky-duration,1800ms) var(--sky-ease,ease);}
body[data-page="sky"][data-sky-season="summer"] .clouds-nav-button {background:#314c42;border-color:#b2cba4;}
body[data-page="sky"][data-sky-season="summer"] .clouds-nav-button:hover {background:#3e6150;}
@media(max-width:640px) {
  .season-decoration-set[data-season-detail="cloud"] .season-detail {width:84px;height:67px;top:18px;}
  .season-decoration-set[data-season-detail="note"] .season-detail {width:88px;height:70px;top:8px;}
  .season-decoration-set:is([data-season-detail="cloud"],[data-season-detail="note"]) .season-detail--winter {inset:0;width:auto;height:auto;}
}

/* The rabbit belongs to the projects caption, so it follows text scaling and
   never moves with the cloud carousel. Its paws rest just above the letters. */
body[data-page="sky"] .profile-projects > .section-heading .eyebrow {position:relative;display:inline-block;isolation:isolate;}