/* likun.im | Sierra Blue Glass | 2026-10-21
   Homepage-only skin. Geometry, content, layout and scroll interactions are preserved.
   Sierra/sky colors below are a custom website palette, not Apple device specifications.
   Load after likun-shell.css. Glass belongs to controls; content remains readable. */
:root {
  color-scheme:light;
  --sky-page:#F5F8FB; --sky-surface:#FFF; --sky-surface-soft:#EDF3F8;
  --sky-ink:#202D3A; --sky-muted:#5E6D7D;
  --sky-brand:#90ABC4; --sky-brand-light:#BFDFF5; --sky-brand-strong:#466D93;
  --sky-metal:#C2D0DE; --sky-metal-blue:#91AFC8; --sky-metal-shadow:#394F68;
  --sky-dark:#111C29; --sky-dark-raised:#1A2A3C;
  --sky-dark-text:#F6F9FC; --sky-dark-muted:#BDCADA;
  --sky-glass:rgba(255,255,255,.72); --sky-glass-edge:rgba(255,255,255,.84);
  --sky-shadow:0 14px 42px rgba(35,55,75,.09);
  --paper:var(--sky-page); --white:#FFF; --ink:var(--sky-ink);
  --muted:var(--sky-muted); --line:rgba(65,89,111,.13);
  --accent:var(--sky-brand); --accent-rgb:144,171,196; --dark:var(--sky-dark);
  /* Legacy aliases: retain contracts without retaining orange UI colors. */
  --lk-paper:var(--sky-page); --lk-surface:var(--sky-surface-soft); --lk-white:#FFF;
  --lk-ink:var(--sky-ink); --lk-muted:var(--sky-muted);
  --lk-orange:var(--sky-brand); --lk-orange-soft:#E5EEF6;
  --lk-orange-ink:var(--sky-brand-strong); --lk-orange-display:#537A9D;
  --lk-focus:#396589; --lk-charcoal:var(--sky-dark);
  --lk-shadow:var(--sky-shadow); --visit-color:#466D93;
}
html,body{background:var(--sky-page);color:var(--sky-ink)}
::selection{background:#CEE3F3;color:#192B3E}
:focus-visible{outline-color:#466D93}
.skip-link{background:#254866;color:#FFF}
.section-index,.muted-ink{color:#647789}
.marquee{background:linear-gradient(180deg,#F5F8FB,#EFF4F8);color:#283C4D}
.marquee-group>i{color:#779AB8}
/* Shared navigation: neutral floating glass, not a saturated blue bar. */
body .lk-header.site-header,body .lk-header.site-header.is-scrolled{
 background:rgba(248,251,254,.82);
 -webkit-backdrop-filter:blur(24px) saturate(1.22);
 backdrop-filter:blur(24px) saturate(1.22);
 color:var(--sky-ink);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.98),0 1px 0 rgba(78,111,139,.10),0 8px 28px rgba(21,44,65,.065);
}
.lk-header .wordmark{color:#202D3A}
.lk-header .lk-star{color:#7FB8DE!important}
.lk-header .header-descriptor{color:#5F7080}
.lk-header .desktop-nav [aria-current=page]{color:#466D93}
.lk-header .desktop-nav>a:hover,.lk-header .nav-group>button:hover,.lk-header .nav-group>button[aria-expanded=true]{background:rgba(164,194,218,.18);color:#345B7C}
body .lk-header .header-contact{
 background:linear-gradient(145deg,rgba(235,245,252,.9),rgba(209,226,239,.62));
 color:#294F6C;border:1px solid rgba(255,255,255,.85)!important;
 box-shadow:inset 0 1px 0 #FFF,0 4px 16px rgba(51,85,112,.065);
}
body .lk-header .header-contact:hover{background:#D6E7F3;color:#203F59;box-shadow:var(--sky-shadow)}
body .lk-header .nav-drop{
 background:rgba(250,253,255,.94);color:#202D3A;
 border:1px solid rgba(255,255,255,.9)!important;
 -webkit-backdrop-filter:blur(28px) saturate(1.18);backdrop-filter:blur(28px) saturate(1.18);
 box-shadow:inset 0 1px 0 #FFF,0 20px 54px rgba(31,55,78,.13);
}
.lk-header .nav-drop a:hover{background:rgba(188,213,232,.24)}
.lk-header .nav-drop small{color:#5E7182}
.lk-header .lk-menu-button span{background:#253C4E}
/* Hero: a lit graphite-blue studio, rather than neon/cyberpunk. */
.hero-scroll,.hero-scroll>.hero{background:#111C29;color:#F6F9FC}
.hero-scroll .hero-backdrop{
 background:radial-gradient(ellipse 44% 63% at 78% 36%,rgba(136,204,245,.20),transparent 77%),
 radial-gradient(ellipse 48% 34% at 66% 91%,rgba(120,190,235,.10),transparent 78%),
 linear-gradient(118deg,#0E1721 0%,#172534 56%,#111D2B 100%);
}
.hero-scroll .hero-floor{background:radial-gradient(ellipse,rgba(150,205,240,.26),rgba(108,157,190,.04) 51%,transparent 73%);opacity:.68}
.hero-scroll .hero-shade{background:linear-gradient(90deg,rgba(10,18,27,var(--hero-mask)) 0%,rgba(13,22,33,.45) 31%,transparent 57%)}
.hero-scroll .hero h1,.hero-scroll .hero h2.hs-headline{color:#F6F9FC}
.hero-scroll .hero h1>span,.hero-scroll .hero h2.hs-headline>span,.hero-scroll .hero-title-accent,.hero-scroll .hero .hs-headline .hs-orange{color:#A9D6F4}
@supports (background-clip:text){
 .hero-scroll .hero h1>span,.hero-scroll .hero h2.hs-headline>span,.hero-scroll .hero-title-accent,.hero-scroll .hero .hs-headline .hs-orange{
  background:linear-gradient(115deg,#88CCF5 0%,#B6E0FB 55%,#D7F0FF 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
 }
}
.hero-scroll .hero-eyebrow{color:#B7C7D5}
.hero-scroll .hero-description{color:#C1CDD9}
.hero-scroll .hero-text-link{color:#DDE8F0}
.hero-scroll .hs-annotation{color:#AABECE}
.hero-scroll .hs-annotation strong{color:#D6E8F4}
.hero-scroll .hs-interact-help,.hero-scroll .hero-bottom-note{color:#ACBFCE}
.hero-scroll .hs-step,.hero-scroll .hs-step b{color:#A1B3C3}
.hero-scroll .hs-step.is-current,.hero-scroll .hs-step.is-current b{color:#D5EBFA}
.hero-scroll .hs-step:before{background:#64798B}
.hero-scroll .hs-step.is-current:before{background:#B5DBF4;box-shadow:0 0 9px rgba(181,219,244,.3)}
.hero-scroll .hero-replay,.hero-scroll .motion-button,.hero-scroll .hero-replay>span:first-child{color:#BECDDB}
.hero-scroll .hs-interact:focus-visible{outline-color:#C6E5F9}
.hero-scroll .scroll-line{border-color:#859BAE}
.pill-button.accent-button{
 background:linear-gradient(135deg,#97CEF5 0%,#83BFEA 58%,#6FB0E0 100%);
 color:#17324A;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.82),inset 0 -1px 0 rgba(48,87,117,.12),0 9px 25px rgba(110,162,204,.18);
}
.pill-button.accent-button:hover{background:linear-gradient(135deg,#AFDCFB,#97CEF5);color:#142F44;box-shadow:inset 0 1px 0 #FFF,0 14px 32px rgba(110,162,204,.26)}
.hero-scroll .hero-text-link{background:rgba(214,234,249,.045);box-shadow:inset 0 0 0 1px rgba(209,231,249,.13),inset 0 1px 0 rgba(255,255,255,.08)}
.hero-scroll .hero-text-link:hover{background:rgba(214,234,249,.095);color:#FFF}
.hero-scroll .hero .status-dot{background:#B5D6EF}
/* Three existing capability panels retain their identities and mechanics. */
#intro.ca-section{background:#F5F8FB;color:#202D3A}
#intro .ca-eyebrow i{background:#779DBD}
#intro .ca-eyebrow>span,#intro .ca-heading-aside p{color:#5E7181}
#intro #intro-title>span{color:#6D8192}
#intro .ca-heading-aside>a{color:#466D93}
#intro .ca-design{
 --ca-base:#C7DCEB;--ca-ink:#243B4C;--ca-sub:#4C687D;--ca-button:#355D7A;--ca-button-ink:#FFF;
 background:radial-gradient(ellipse at 80% 3%,rgba(250,254,255,.92),transparent 57%),linear-gradient(135deg,#E0EDF6,#BAD3E5 58%,#91B3CD);
}
#intro .ca-design .ca-scrim{background:linear-gradient(0deg,#BDD5E6 0%,rgba(189,213,230,.96) 30%,transparent 78%)}
#intro .ca-design .ca-d-disc{background:linear-gradient(145deg,#F1F8FC,#A6C6DC 57%,#7698B4);box-shadow:inset 3px 5px 8px #FFFFFFAA,inset -10px -5px 12px #53769433,20px 35px 60px #42657D30}
#intro .ca-design .ca-d-shadow{background:#466B862F}
#intro .ca-design .ca-d-poster{box-shadow:1px 2px 0 #C4D9E8,3px 3px 0 #8AA6BC,16px 20px 26px #34566E2A}
#intro .ca-design .ca-d-poster-front{background:#F3F8FB;color:#253B4B}
#intro .ca-design .ca-d-poster-back{background:#293D4F;color:#EFF6FC}
#intro .ca-design .ca-d-star{color:#91B5D0;text-shadow:1px 1px 0 #D3EAF8,3px 4px 0 #6387A1,6px 8px 0 #789DB7,14px 15px 19px #385B782A}
#intro .ca-design .ca-d-swatches>i{background:linear-gradient(135deg,#F7FAFC,#B7CBD8);box-shadow:0 9px 14px #324E642A,inset 2px 2px 2px #FFFFFF88}
#intro .ca-design .ca-d-swatches>i:nth-child(2){background:linear-gradient(135deg,#BADBF0,#739CB9)}
#intro .ca-design .ca-d-swatches>i:nth-child(3){background:linear-gradient(135deg,#536D81,#293E50)}
#intro .ca-design .ca-d-swatches>span{color:#4A657B}
#intro .ca-design .ca-d-ball{background:radial-gradient(circle at 27% 23%,#FFF,#DFECF6 25%,#A1B5C5 55%,#4D667A 75%,#D8EAF5 95%);box-shadow:9px 14px 24px #3D617C30}
#intro .ca-build{
 --ca-base:#203242;--ca-ink:#F1F7FC;--ca-sub:#BECEDB;--ca-button:#B3CEE2;--ca-button-ink:#1B3448;
 background:radial-gradient(ellipse at 72% 10%,rgba(134,165,189,.42),transparent 65%),#24394B;
}
#intro .ca-build .ca-scrim{background:linear-gradient(0deg,#203242 0%,rgba(32,50,66,.96) 31%,transparent 78%)}
#intro .ca-build .ca-b-glow{background:radial-gradient(ellipse at 59% 30%,#C7E5F339,transparent 59%)}
#intro .ca-build .ca-b-window,#intro .ca-build .ca-b-phone{background:#F0F6FB;color:#253B4D}
#intro .ca-build .ca-b-top,#intro .ca-build .ca-b-widget,#intro .ca-build .ca-b-phone-card{background:#DDE9F1}
#intro .ca-build .ca-b-content>strong em,#intro .ca-build .ca-b-phone-logo>span,#intro .ca-build .ca-b-phone-tabs>span:first-child{color:#577F9F}
#intro .ca-build .ca-b-widget>b,#intro .ca-build .ca-b-phone-orb{color:#95B8D3;text-shadow:3px 5px 0 #648AA7,9px 12px 15px #3A64812A}
#intro .ca-build .ca-b-fake-button{background:#385D78;color:#F6FBFF}
#intro .ca-build .ca-b-code{background:#162C3CF2;color:#D8E8F5}
#intro .ca-build .ca-b-cube{background:linear-gradient(120deg,#B6D5E9,#658FAE);box-shadow:inset 2px 2px 1px #E7F7FF99,5px 5px 0 #426782,14px 23px 20px #0002}
#intro .ca-ai{
 --ca-base:#D3DAE7;--ca-ink:#2A384A;--ca-sub:#55677D;--ca-button:#435C79;--ca-button-ink:#FFF;
 background:radial-gradient(ellipse at 80% 5%,rgba(255,255,255,.87),transparent 55%),linear-gradient(135deg,#E9EDF5,#D1D9E8 59%,#ABBAD0);
}
#intro .ca-ai .ca-scrim{background:linear-gradient(0deg,#CFD8E7 0%,rgba(207,216,231,.95) 33%,transparent 80%)}
#intro .ca-bottom{color:#5E7181}
/* Projects: only the gallery UI changes; project artwork palettes remain intact. */
.works-gallery{--wg-paper:#F6F9FC;--wg-muted:#B6C5D2;background:radial-gradient(ellipse 60% 36% at 60% 0%,rgba(132,166,194,.09),transparent 83%),linear-gradient(145deg,#172637,#111D2A);color:#F6F9FC}
.wg-heading h2{color:#F6F9FC}
.wg-kicker,.wg-heading-aside p{color:#C0CDDA}
.wg-kicker i{background:#B1D3ED}
.wg-kicker span,.wg-hint{color:#A8BBCC}
.wc-surface{background:linear-gradient(145deg,#2A3B4C,#203140);box-shadow:inset 0 1px 0 rgba(225,241,255,.12),0 16px 30px rgba(0,0,0,.14)}
.wc-item.is-open .wc-surface{box-shadow:inset 0 1px 0 rgba(240,249,255,.16),0 26px 50px -18px rgba(0,0,0,.42)}
.wc-card:focus-visible{outline-color:#C1E3F8}
.wc-meta-top{color:#D7E2ED}
.wc-meta>p{color:#BDCADA}
.wg-bottom,.wg-bottom>span{color:#B2C3D1}
.wg-bottom>a{color:#DCEBF6}
.wc-card .lv-rest svg{fill:#466D93}
/* Experiments: a small frosted control bar, not a blurred whole section. */
.playground{background:radial-gradient(ellipse 51% 60% at 70% 45%,rgba(153,185,213,.09),transparent 80%),linear-gradient(145deg,#1B2E40,#182838);color:#F6F9FC}
.playground .marker-dot{background:#B1D3EC}
.playground .section-index{color:#B2C3D3}
.playground h2>span{color:#B7D6EF}
.playground-copy>p,.playground-links,.experiment-hint,.experiment-tag{color:#BDCDDC}
.light-button{background:linear-gradient(145deg,#E4F0F8,#BBD3E5);color:#243E53;box-shadow:inset 0 1px 0 #FFFFFFCC,0 10px 28px #0B172733}
.light-button:hover{background:#DAEDF9;color:#243E53}
.experiment-controls{background:rgba(46,68,89,.58)!important;border:1px solid rgba(220,239,255,.22)!important;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:inset 0 1px 0 #FFFFFF26,0 15px 36px #0813214D}
.experiment-controls button{background:transparent;color:#DAE6F0}
.experiment-controls button.is-active{background:linear-gradient(145deg,#DEEDF8,#B7CFE2);color:#203B50;box-shadow:inset 0 1px 0 #FFFFFFBB}
/* Journal: low-chroma blue atmospheres and high-contrast functional text. */
.journal-orbit{--jo-orange:#466D93;--jo-ink:#202D3A;--jo-muted:#5E6D7D;--jo-line:#ADBDCC;background:#F5F8FB;color:#202D3A}
.jo-ambient{background:#F5F8FB}
.jo-glow:nth-child(1){background:radial-gradient(ellipse 55% 65% at 51% 106%,#A5CAE84D,transparent 86%),radial-gradient(ellipse 45% 40% at 18% 72%,#D2EAF54D,transparent 85%)}
.jo-glow:nth-child(2){background:radial-gradient(ellipse 55% 65% at 51% 106%,#B9C6DF45,transparent 86%),radial-gradient(ellipse 45% 40% at 22% 72%,#E2E8F24D,transparent 85%)}
.jo-glow:nth-child(3){background:radial-gradient(ellipse 55% 65% at 51% 106%,#B3D7E645,transparent 86%),radial-gradient(ellipse 45% 40% at 76% 70%,#D8EEF54D,transparent 85%)}
.jo-glow:nth-child(4){background:radial-gradient(ellipse 55% 65% at 51% 106%,#A7C1DA45,transparent 86%),radial-gradient(ellipse 45% 40% at 18% 70%,#DEEBF34D,transparent 85%)}
.jo-intro-copy,.jo-topic,.jo-more,.jo-skip,.jo-more-label{color:#5B6F80}
.jo-heading h2>span,.jo-symbol{color:#466D93}
.jo-topic svg{stroke:#466D93}
.jo-filters button{background:rgba(255,255,255,.65);color:#50697E;box-shadow:inset 0 1px 0 #FFF}
.jo-filters button[aria-pressed=true]{background:#365E7D;color:#FFF}
.jo-section-nav button,.jo-section-nav button .jo-nav-number{color:#536D80}
.jo-section-nav button[aria-selected=true]{background:rgba(255,255,255,.76);color:#365E7D;box-shadow:inset 0 1px 0 #FFF,0 6px 18px #28476412}
.jo-cta{background:linear-gradient(145deg,#EDF5FB,#DCEAF4);color:#2F5473;box-shadow:inset 0 1px 0 #FFF,0 5px 18px #294A6510}
.jo-cta:hover{background:#D6E8F5;color:#244A68;box-shadow:0 10px 24px #294A651A}
.jo-node-no{background:#FFFFFFB3;color:#476983}
.jo-node.is-current .jo-node-no{background:#466D93;color:#FFF}
.jo-node-name,.jo-ready .jo-cue,.jo-ready .jo-fraction,.jo-fraction [data-jo-count]{color:#566F82}
.jo-arc-main{stroke:#91A9BD}.jo-trace{stroke:#709BBE}
/* About: keep both copies of the scrolling mask synchronized in color. */
#about.as-section{--as-paper:#EDF3F8;--as-ink:#243A4C;--as-mute:#5B758B;--as-accent:#688EAE}
#about .as-background{background:radial-gradient(ellipse at 76% 78%,#B9D9EE24,transparent 65%),#EDF3F8}
#about .as-background-word{color:#486D880C}
#about .as-marker>span,#about .as-copy p{color:#5B7182}
#about .as-tags>span{background:#DDE8F1;color:#405F78}
#about .as-link{color:#365F7F}
#about .as-visual{background:#CEDFEA}
#about .as-poster{background:radial-gradient(ellipse at 25% 12%,#FFFFFFB3,transparent 65%),linear-gradient(140deg,#DFEDF6,#B6CDDF 82%)}
#about .as-poster-top,#about .as-poster-location{color:#536F84}
#about .as-poster-signature{color:#294A63}
#about .as-shade{background:linear-gradient(90deg,#0F1D2BF2 0%,#182D40D9 33%,#233D554A 66%,transparent)}
#about .as-overlay .as-heading{color:#F6F9FC}
#about .as-overlay .as-heading>span{color:#C1DFF3}
#about .as-overlay .as-copy p{color:#DEEBF4}
#about .as-overlay .as-tags>span{background:#E7F4FF1F;color:#E0EFFA}
#about .as-overlay .as-link,#about .as-overlay .as-marker{color:#F0F7FD}
#about .as-overlay .as-marker>span{color:#C5DBEC}
#about .as-object .sculpture-ring{border-color:#9EBFD8;box-shadow:inset 4px 0 6px #E9F7FF,5px 0 1px #6086A1,4px 23px 22px #294A6433}
#about .as-object .sculpture-ring:nth-child(3){border-color:#7EA2BF}
#about .as-object .sculpture-ring:nth-child(4){border-color:#CBE5F6;box-shadow:inset 3px 0 4px #FFF,4px 0 1px #85ACC7,4px 23px 22px #294A642E}
#about .as-object .sculpture-center{color:#D9EDF9;text-shadow:3px 10px 15px #638DAF}
/* Contact and footer: calm dark-to-porcelain transition. */
.contact{background:radial-gradient(ellipse 48% 86% at 84% 28%,#91BEE22B,transparent 80%),linear-gradient(135deg,#213A50,#162B3D 64%,#132434);color:#F6F9FC}
.contact-top,.contact h2,.contact-email{color:#F6F9FC}
.contact-bottom>span,.contact-top>span+span{color:#CBDDEA}
.contact-orb{background:#D9EDFC14!important;border:1px solid #DEF1FF3D!important;color:#EAF6FE;box-shadow:inset 0 1px 0 #FFFFFF38,0 14px 36px #07172733;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.contact-orb:hover{background:#D9EDFC29!important;color:#FFF}
.copy-email{background:#D9EDFC17;color:#E5F3FC;box-shadow:inset 0 1px 0 #FFFFFF21}
.copy-email:hover{background:#D9EDFC2B}
body .lk-footer.site-foot{background:#EDF3F8!important;color:#243B4D;box-shadow:inset 0 1px 0 #FFFFFFE0}
.lk-footer .wordmark{color:#243B4D}
.lk-footer .lk-star{color:#6FA8D0!important}
.lk-footer .lk-footer-top p,.lk-footer .lk-footer-bottom{color:#5A7083}
.lk-footer .lk-footer-columns :is(h2,h3){color:#506A7F}
.lk-footer .lk-footer-columns a{color:#2C475D}
.lk-footer a:hover{color:#36678E}
/* Dialogs/mobile. */
.settings-dialog,.project-detail,.lk-mobile.mobile-menu{background:#F5F8FB;color:#202D3A}
.project-detail p{color:#5E6D7D}
.project-detail .detail-close,.project-detail .detail-status,.lk-mobile details[open] summary{background:#E3EDF5;color:#3B5B75}
.project-detail .detail-links a{background:#365D7B;color:#FFF}
.project-detail .detail-links a:hover{background:#274C6B;color:#FFF}
.lk-mobile nav a[aria-current=page],.lk-mobile nav summary[aria-current=page]{color:#466D93}
.toast{background:#233D52;color:#EDF8FF;border-color:#D9F0FF26}
/* Explicit fallbacks: no dependency on background blur support. */
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
 body .lk-header.site-header,body .lk-header.site-header.is-scrolled,body .lk-header .nav-drop{background:#F2F7FB}
 .experiment-controls{background:#2C465D!important}.contact-orb{background:#35546B!important}
}
@media(max-width:900px){body .lk-header.site-header,body .lk-header.site-header.is-scrolled{background:rgba(247,251,254,.94)}}
@media(max-width:820px){
 .hero-scroll .hero-shade{background:linear-gradient(180deg,#0C1621C7 0%,#0E19264A 36%,transparent 60%)}
 #about .as-shade{background:linear-gradient(180deg,#0F1D2BBF,#182D4057 30%,#182D4080 49%,#102334F2 66%,#102334F7)}
}
@media(prefers-reduced-transparency:reduce){
 body .lk-header.site-header,body .lk-header.site-header.is-scrolled,body .lk-header .nav-drop{background:#F2F7FB;-webkit-backdrop-filter:none;backdrop-filter:none}
 .experiment-controls{background:#2C465D!important;-webkit-backdrop-filter:none;backdrop-filter:none}
 .contact-orb{background:#35546B!important;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media(prefers-reduced-motion:reduce){.lk-header *,.lk-footer *,.experiment-controls{transition:none!important}}
@media(forced-colors:active){
 .hero-scroll .hero h1>span,.hero-scroll .hero h2.hs-headline>span,.hero-scroll .hero-title-accent,.hero-scroll .hero .hs-headline .hs-orange{background:none;color:CanvasText}
 .pill-button.accent-button,.hero-scroll .hero-text-link,.contact-orb{border:1px solid ButtonText!important}
}

#about .as-midtone{background:#122334}