/* YUGEN MOTION shared animation layer */
:root{
  --ease-out:cubic-bezier(.22,.8,.24,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
}

.scroll-progress{
  position:fixed; top:0; left:0; height:3px; width:100%;
  transform-origin:0 50%; transform:scaleX(0);
  background:linear-gradient(90deg, var(--accent, #e63946), #ff8a5c);
  z-index:9999; pointer-events:none;
}
.site-header{ transition:box-shadow .35s var(--ease-soft), background-color .35s var(--ease-soft), transform .5s var(--ease-out); }
.site-header.scrolled{ box-shadow:0 8px 30px rgba(0,0,0,.45); }
.site-header .nav{ transition:padding .35s var(--ease-soft); }
.site-header.scrolled .nav{ padding-top:8px; padding-bottom:8px; }
@keyframes navDrop{ from{ opacity:0; transform:translateY(-100%);} to{ opacity:1; transform:none;} }
.site-header{ animation:navDrop .8s var(--ease-out) backwards; }
.nav-links a{ position:relative; }
.nav-links a::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .35s var(--ease-out); opacity:.85;
}
.nav-links a:hover::after,.nav-links a.active::after{ transform:scaleX(1); }
@keyframes markGlow{
  0%,100%{ text-shadow:0 0 0 rgba(255,255,255,0); }
  50%{ text-shadow:0 0 14px rgba(255,255,255,.55); }
}
.brand-mark{ display:inline-block; animation:markGlow 4.5s ease-in-out infinite; transition:transform .5s var(--ease-out); }
.brand:hover .brand-mark{ transform:rotate(-8deg) scale(1.12); }

@keyframes riseIn{ from{ opacity:0; transform:translateY(28px);} to{ opacity:1; transform:none;} }
@keyframes artIn{ from{ opacity:0; transform:translateX(60px) scale(.94);} to{ opacity:1; transform:none;} }
@keyframes wordIn{
  from{ opacity:0; transform:translateY(60%) skewY(6deg); filter:blur(6px); }
  to{ opacity:1; transform:none; filter:blur(0); }
}
:is(.hero,.page-hero) .eyebrow{ animation:riseIn .8s var(--ease-out) .15s backwards; }
:is(.hero,.page-hero) h1 .line{ display:inline-block; animation:wordIn 1s var(--ease-out) backwards; }
:is(.hero,.page-hero) h1 .line:nth-child(1){ animation-delay:.3s; }
:is(.hero,.page-hero) h1 .line:nth-child(3){ animation-delay:.5s; }
:is(.hero,.page-hero) .lede{ animation:riseIn .9s var(--ease-out) .75s backwards; }
:is(.hero,.page-hero) .hero-actions{ animation:riseIn .9s var(--ease-out) .95s backwards; }
:is(.hero,.page-hero) .footer-social{ animation:riseIn .9s var(--ease-out) 1.1s backwards; }
:is(.hero,.page-hero) .mini-stats > div{ animation:riseIn .8s var(--ease-out) backwards; }
:is(.hero,.page-hero) .mini-stats > div:nth-child(1){ animation-delay:.95s; }
:is(.hero,.page-hero) .mini-stats > div:nth-child(2){ animation-delay:1.1s; }
:is(.hero,.page-hero) .mini-stats > div:nth-child(3){ animation-delay:1.25s; }
:is(.hero,.page-hero) :is(.hero-art,.page-hero-art){ animation:artIn 1.2s var(--ease-out) .5s backwards; }
@keyframes floaty{
  0%,100%{ transform:translateY(0) rotate(0deg); }
  50%{ transform:translateY(-14px) rotate(.6deg); }
}
:is(.hero-art,.page-hero-art) img{ animation:floaty 7s ease-in-out 1.8s infinite; will-change:transform; }
@keyframes moonPulse{
  0%,100%{ transform:scale(1) translate(0,0); opacity:.9; }
  50%{ transform:scale(1.12) translate(-12px,10px); opacity:1; }
}
.moon-glow{ animation:moonPulse 9s ease-in-out infinite; }
@keyframes shimmer{ to{ background-position:200% center; } }
:is(.hero,.page-hero) h1 .accent{
  background:linear-gradient(90deg, currentColor 0%, #ffd2c2 25%, currentColor 50%);
  background-size:200% auto; -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; animation:shimmer 5s linear 1.6s infinite;
}
:is(.hero,.page-hero) h1 .line.accent{ animation:wordIn 1s var(--ease-out) .5s backwards, shimmer 5s linear 1.6s infinite; }
.mini-stats svg{ transition:transform .5s var(--ease-out); }
.mini-stats > div:hover svg{ transform:rotate(-10deg) scale(1.2); }

.btn{ position:relative; overflow:hidden; transition:transform .3s var(--ease-out), box-shadow .3s var(--ease-soft), background-color .3s, border-color .3s, color .3s; }
.btn:hover{ transform:translateY(-3px); }
.btn:active{ transform:translateY(-1px) scale(.98); }
.btn-primary:hover{ box-shadow:0 10px 26px rgba(230,57,70,.4); }
.btn::before{
  content:""; position:absolute; top:0; left:-120%; width:60%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.35), transparent);
  transform:skewX(-20deg); transition:left .7s var(--ease-out); pointer-events:none;
}
.btn:hover::before{ left:140%; }
.btn svg,.section-link svg{ transition:transform .3s var(--ease-out); }
.btn:hover svg,.section-link:hover svg{ transform:translateX(5px); }
.footer-social a{ transition:transform .3s var(--ease-out), background-color .3s, border-color .3s; }
.footer-social a:hover{ transform:translateY(-4px) scale(1.12) rotate(-6deg); }

@keyframes reveal{ from{ opacity:0; transform:translateY(36px) scale(.97);} to{ opacity:1; transform:none;} }
.js .reveal{ opacity:0; }
.js .reveal.in{ opacity:1; animation:reveal .8s var(--ease-out) var(--d,0s) backwards; }
.js .section-head.reveal.in .section-title{ animation:riseIn .7s var(--ease-out) backwards; }
.card{ transition:transform .45s var(--ease-out), box-shadow .45s var(--ease-soft), border-color .3s; will-change:transform; }
.card:hover{ transform:translateY(-10px); box-shadow:0 18px 40px rgba(0,0,0,.5); }
.card-cover{ overflow:hidden; }
.card-cover img{ transition:transform .9s var(--ease-out), filter .5s; }
.card:hover .card-cover img{ transform:scale(1.09); filter:brightness(1.08) saturate(1.1); }
.card-badge{ transition:transform .35s var(--ease-out); }
.card:hover .card-badge{ transform:translateY(-2px) scale(1.06); }
.card-title-overlay{ transition:transform .5s var(--ease-out); }
.card:hover .card-title-overlay{ transform:translateY(-6px); }
.card-cover-glyph{ transition:transform .7s var(--ease-out), opacity .5s; }
.card:hover .card-cover-glyph{ transform:scale(1.25) rotate(6deg); }
.rating{ display:inline-block; transition:transform .3s var(--ease-out); }
.card:hover .rating,.feat-card:hover .rating{ transform:scale(1.12); }
.feat-card{ transition:transform .45s var(--ease-out), box-shadow .45s, border-color .3s; }
.feat-card:hover{ transform:translateY(-8px); box-shadow:0 16px 36px rgba(0,0,0,.4); }
.feat-icon svg{ transition:transform .6s var(--ease-out); }
.feat-card:hover .feat-icon svg{ transform:translateY(-4px) rotate(-8deg) scale(1.1); }
@keyframes iconBob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-5px);} }
.feat-card:nth-child(odd) .feat-icon svg{ animation:iconBob 5s ease-in-out infinite; }
.feat-card:nth-child(even) .feat-icon svg{ animation:iconBob 5s ease-in-out 1.2s infinite; }
.feat-card:hover .feat-icon svg{ animation:none; }
.feat-card > div:first-child{ transition:transform .5s var(--ease-out), box-shadow .4s; }
.feat-card:hover > div:first-child{ transform:rotate(-8deg) scale(1.12); box-shadow:0 0 18px rgba(230,57,70,.35); }
.pill{ transition:transform .35s var(--ease-out), box-shadow .35s, border-color .3s, background-color .3s; cursor:pointer; }
.pill:hover{ transform:translateY(-5px) scale(1.05); box-shadow:0 10px 24px rgba(230,57,70,.25); }
.pill:active{ transform:scale(.97); }
.pill > span:first-child{ display:inline-block; transition:transform .5s var(--ease-out); }
.pill:hover > span:first-child{ transform:rotate(-15deg) scale(1.25); }
.pill .count{ transition:transform .3s var(--ease-out); display:inline-block; }
.pill:hover .count{ transform:scale(1.2); }
@keyframes ctaGlow{ 0%,100%{ box-shadow:0 0 0 0 rgba(230,57,70,0); } 50%{ box-shadow:0 0 40px 2px rgba(230,57,70,.16); } }
.cta-banner{ animation:ctaGlow 5s ease-in-out infinite; position:relative; overflow:hidden; }
.cta-banner::after{ content:""; position:absolute; top:0; left:-60%; width:40%; height:100%; background:linear-gradient(100deg, transparent, rgba(255,255,255,.07), transparent); transform:skewX(-20deg); animation:ctaSweep 7s ease-in-out 2s infinite; pointer-events:none; }
@keyframes ctaSweep{ 0%{ left:-60%; } 35%,100%{ left:140%; } }
@keyframes borderPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(230,57,70,0); } 50%{ box-shadow:0 0 0 6px rgba(230,57,70,.12); } }
.newsletter-box{ animation:borderPulse 4s ease-in-out infinite; transition:transform .4s var(--ease-out); }
.newsletter-box:hover{ transform:translateY(-4px); }
.newsletter-form input{ transition:box-shadow .3s, border-color .3s, transform .3s var(--ease-out); }
.newsletter-form input:focus{ transform:scale(1.02); box-shadow:0 0 0 3px rgba(230,57,70,.35); outline:none; }
.footer-col a{ display:inline-block; transition:transform .3s var(--ease-out), color .3s; }
.footer-col a:hover{ transform:translateX(6px); }

/* Page-specific animation rules retained from the original inline blocks. */
.card.featured:hover{ transform:translateY(-6px); }
.js .featured.in > div:last-child > *{ animation:riseIn .7s var(--ease-out) backwards; }
.js .featured.in > div:last-child > *:nth-child(1){ animation-delay:.25s; }
.js .featured.in > div:last-child > *:nth-child(2){ animation-delay:.35s; }
.js .featured.in > div:last-child > *:nth-child(3){ animation-delay:.45s; }
.js .featured.in > div:last-child > *:nth-child(4){ animation-delay:.55s; }
.js .featured.in > div:last-child > *:nth-child(5){ animation-delay:.65s; }
@keyframes badgePulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(230,57,70,.5); } 50%{ box-shadow:0 0 0 8px rgba(230,57,70,0); } }
.featured .card-badge{ animation:badgePulse 2.8s ease-out infinite; }
body:has(.featured) .card-name{ transition:color .3s, transform .4s var(--ease-out); }
body:has(.featured) .card:hover .card-name{ color:var(--crimson, #e63946); transform:translateX(3px); }
body:has(.featured) .card-meta span{ transition:transform .3s var(--ease-out); }
body:has(.featured) .card:hover .card-meta span:first-child{ transform:translateX(2px); }

.page-hero .grid-4 > div{ animation:riseIn .8s var(--ease-out) backwards; transition:transform .4s var(--ease-out); }
.page-hero .grid-4 > div:nth-child(1){ animation-delay:.95s; }
.page-hero .grid-4 > div:nth-child(2){ animation-delay:1.1s; }
.page-hero .grid-4 > div:nth-child(3){ animation-delay:1.25s; }
.page-hero .grid-4 > div:nth-child(4){ animation-delay:1.4s; }
.page-hero .grid-4 > div:hover{ transform:translateY(-5px); }
.page-hero .grid-4 .mini-stat-num > span{ display:inline-block; transition:transform .5s var(--ease-out); }
.page-hero .grid-4 > div:hover .mini-stat-num > span{ transform:scale(1.3) rotate(-12deg); }
.feat-card ul li{ transition:transform .3s var(--ease-out), background-color .3s, color .3s; cursor:pointer; }
.feat-card ul li:hover{ transform:translateX(6px); background-color:rgba(230,57,70,.08); }
.feat-card ul li > span{ display:inline-block; transition:transform .3s var(--ease-out); }
.feat-card ul li:hover > span{ transform:scale(1.25); }
@keyframes bookFloat{ 0%,100%{ transform:translateY(0) rotate(0); } 50%{ transform:translateY(-8px) rotate(-6deg); } }
.book-emoji{ display:inline-block; animation:bookFloat 4.5s ease-in-out infinite; }
.feat-card:hover > .book-emoji{ transform:none; box-shadow:none; }
.grid-4 > .feat-card .feat-icon{ animation:iconBob 5s ease-in-out infinite; }
.grid-4 > .feat-card:nth-child(2) .feat-icon{ animation-delay:.6s; }
.grid-4 > .feat-card:nth-child(3) .feat-icon{ animation-delay:1.2s; }
.grid-4 > .feat-card:nth-child(4) .feat-icon{ animation-delay:1.8s; }
.grid-4 > .feat-card:hover .feat-icon{ animation:none; }

.stat-card{ transition:transform .45s var(--ease-out), box-shadow .45s, border-color .3s; }
.stat-card:hover{ transform:translateY(-8px); box-shadow:0 16px 36px rgba(0,0,0,.45); }
.stat-icon{ display:inline-block; transition:transform .5s var(--ease-out); }
.stat-card:hover .stat-icon{ transform:scale(1.25) rotate(-10deg); }
@keyframes statIn{ from{ opacity:0; transform:translateY(40px);} to{ opacity:1; transform:none;} }
.stat-strip .stat-card{ animation:statIn .9s var(--ease-out) backwards; }
.stat-strip .stat-card:nth-child(1){ animation-delay:1.0s; }
.stat-strip .stat-card:nth-child(2){ animation-delay:1.12s; }
.stat-strip .stat-card:nth-child(3){ animation-delay:1.24s; }
.stat-strip .stat-card:nth-child(4){ animation-delay:1.36s; }

.sidebar-card{ transition:transform .4s var(--ease-out), box-shadow .4s, border-color .4s; }
.sidebar-card:hover{ transform:translateY(-4px); box-shadow:0 14px 32px rgba(0,0,0,.4); }
.filter-list li{ transition:transform .3s var(--ease-out), background-color .3s, color .3s; cursor:pointer; }
.filter-list li:hover{ transform:translateX(6px); }
.filter-list li .count{ display:inline-block; transition:transform .3s var(--ease-out); }
.filter-list li:hover .count{ transform:scale(1.2); }
@keyframes activePulse{ 0%,100%{ opacity:1; } 50%{ opacity:.7; } }
.filter-list li.active{ animation:activePulse 3s ease-in-out infinite; }
.tool-list li{ transition:transform .3s var(--ease-out), background-color .3s; }
.tool-list li:hover{ transform:translateX(6px); }
.tool-list li > span:first-child{ display:inline-block; transition:transform .5s var(--ease-out); }
.tool-list li:hover > span:first-child{ transform:rotate(-20deg) scale(1.3); }
.toolbar select{ transition:border-color .3s, box-shadow .3s, transform .3s var(--ease-out); }
.toolbar select:hover{ transform:translateY(-2px); }
.toolbar select:focus{ box-shadow:0 0 0 3px rgba(230,57,70,.3); outline:none; }
.view-btn{ transition:transform .3s var(--ease-out), background-color .3s, color .3s; }
.view-btn:hover{ transform:translateY(-3px) scale(1.08); }
.view-btn:active{ transform:scale(.94); }
body:has(#all-drawings) .card-meta span:last-child{ display:inline-block; transition:transform .3s var(--ease-out); }
body:has(#all-drawings) .card:hover .card-meta span:last-child{ transform:scale(1.15); }
.rank-item{ transition:transform .35s var(--ease-out), background-color .3s; }
.rank-item:hover{ transform:translateX(6px); }
.rank-num{ display:inline-block; transition:transform .4s var(--ease-out), text-shadow .3s; }
.rank-item:hover .rank-num{ transform:scale(1.35); text-shadow:0 0 12px rgba(230,57,70,.7); }
.rank-thumb,.mini-thumb{ overflow:hidden; }
.rank-thumb img,.mini-thumb img{ transition:transform .7s var(--ease-out), filter .4s; }
.rank-item:hover .rank-thumb img{ transform:scale(1.18); filter:brightness(1.1); }
.mini-thumb{ transition:transform .4s var(--ease-out), box-shadow .4s; }
.mini-thumb:hover{ transform:translateY(-4px) rotate(-2deg); box-shadow:0 10px 22px rgba(0,0,0,.45); }
.mini-thumb:hover img{ transform:scale(1.15); filter:brightness(1.1); }
@keyframes ideaFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-6px);} }
.idea-card{ animation:ctaGlow 5s ease-in-out infinite, ideaFloat 6s ease-in-out infinite; transition:box-shadow .4s; }
.idea-card:hover{ box-shadow:0 16px 40px rgba(230,57,70,.3); animation-play-state:paused; }

body:has(#team) .feat-card:hover > .feat-icon,
body:has(.form-card) .feat-card:hover > .feat-icon{ transform:none; box-shadow:none; }
body:has(#team) .feat-card:hover,
body:has(.form-card) .feat-card:hover{ border-color:rgba(230,57,70,.45); }
.step-card{ position:relative; transition:transform .45s var(--ease-out), box-shadow .45s, border-color .3s; }
.step-card:hover{ transform:translateY(-10px); box-shadow:0 18px 40px rgba(0,0,0,.5); border-color:rgba(230,57,70,.45); }
.step-card .step-num svg{ transition:transform .6s var(--ease-out); animation:milestonePulse 4.5s ease-in-out infinite; }
.step-card:hover .step-num svg{ transform:scale(1.2) rotate(-8deg); animation:none; }
.step-card .step-num span{ transition:text-shadow .4s, transform .5s var(--ease-out); }
.step-card:hover .step-num span{ text-shadow:0 0 18px rgba(230,57,70,.6); transform:scale(1.08); }
@keyframes milestonePulse{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-4px); } }
.step-card:nth-child(2) .step-num svg{ animation-delay:.5s; }
.step-card:nth-child(3) .step-num svg{ animation-delay:1s; }
.step-card:nth-child(4) .step-num svg{ animation-delay:1.5s; }
.team-card{ transition:transform .45s var(--ease-out), box-shadow .45s, border-color .3s; }
.team-card:hover{ transform:translateY(-10px); box-shadow:0 18px 40px rgba(0,0,0,.5); }
.team-photo{ overflow:hidden; transition:transform .6s var(--ease-out), box-shadow .5s; }
.team-photo img{ transition:transform .8s var(--ease-out), filter .5s; }
.team-card:hover .team-photo{ transform:scale(1.06) rotate(-3deg); box-shadow:0 0 0 4px rgba(230,57,70,.35), 0 0 26px rgba(230,57,70,.35); }
.team-card:hover .team-photo img{ transform:scale(1.12); filter:brightness(1.08); }
.team-role{ transition:letter-spacing .4s var(--ease-out); }
.team-card:hover .team-role{ letter-spacing:.04em; }

.feat-card.form-card:hover{ transform:none; box-shadow:none; border-color:var(--border); }
.feat-card form input,.feat-card form textarea{ transition:box-shadow .3s var(--ease-soft), border-color .3s, transform .3s var(--ease-out), background-color .3s; }
.feat-card form input:hover,.feat-card form textarea:hover{ border-color:rgba(230,57,70,.5) !important; }
.feat-card form input:focus,.feat-card form textarea:focus{ outline:none; border-color:var(--crimson, #e63946) !important; box-shadow:0 0 0 3px rgba(230,57,70,.28), 0 8px 22px rgba(0,0,0,.35); transform:translateY(-2px); }
.feat-card form label{ transition:color .3s, transform .3s var(--ease-out); }
.feat-card form div:focus-within > label{ color:var(--crimson, #e63946) !important; transform:translateX(4px); }
.feat-card form .btn{ margin-top:4px; }
@keyframes wiggle{ 0%,100%{ transform:rotate(0) scale(1); } 25%{ transform:rotate(-12deg) scale(1.15); } 60%{ transform:rotate(9deg) scale(1.15); } }
.feat-card h3 svg{ transition:color .3s; }
.feat-card:hover h3 svg{ animation:wiggle .7s var(--ease-out); color:var(--crimson, #e63946); }

/* Contact form validation states */
.contact-field-error{ display:block; color:#ff8a9d; font-size:12px; line-height:1.4; margin-top:6px; }
.contact-field-error:empty{ display:none; }
.contact-form input.contact-field-invalid,.contact-form textarea.contact-field-invalid{ border-color:#ff5470 !important; }
.contact-form-status{ color:var(--text-low); font-size:13px; line-height:1.5; margin:0; }
.contact-form-status.is-ready{ color:#8dd8ac; }
.contact-submit:disabled{ cursor:wait; opacity:.7; transform:none; }

@keyframes stepPulse{ 0%,100%{ transform:scale(1); opacity:.9; } 50%{ transform:scale(1.12); opacity:1; } }
.step-icon{ display:inline-block; transition:transform .6s var(--ease-out); }
.step-card:hover .step-icon{ transform:rotate(180deg) scale(1.2); }
.step-card:nth-child(1) .step-icon{ animation:stepPulse 4s ease-in-out 0s infinite; }
.step-card:nth-child(2) .step-icon{ animation:stepPulse 4s ease-in-out .5s infinite; }
.step-card:nth-child(3) .step-icon{ animation:stepPulse 4s ease-in-out 1s infinite; }
.step-card:nth-child(4) .step-icon{ animation:stepPulse 4s ease-in-out 1.5s infinite; }
.step-card:nth-child(5) .step-icon{ animation:stepPulse 4s ease-in-out 2s infinite; }
.step-card:hover .step-icon{ animation:none; }
.feat-icon{ display:inline-block; }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; animation-delay:0s !important; transition-duration:.001ms !important; }
  .js .reveal{ opacity:1; }
}

/* Search uses the existing site surfaces and controls. */
.search-box{ cursor:pointer; }
.search-box:focus-visible{ outline:2px solid var(--crimson); outline-offset:3px; }
.search-open{ overflow:hidden; }
.site-search[hidden]{ display:none; }
.site-search{ position:fixed; inset:0; z-index:1000; display:flex; align-items:flex-start; justify-content:center; padding:11vh 24px 32px; }
.site-search-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.72); }
.site-search-panel{ position:relative; width:min(680px, 100%); max-height:78vh; overflow:auto; background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-md); box-shadow:0 24px 70px rgba(0,0,0,.55); padding:24px; }
.site-search-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.site-search-head h2{ font-family:var(--font-display); font-size:22px; font-weight:800; }
.site-search-close{ width:34px; height:34px; border:1px solid var(--border); border-radius:8px; background:transparent; color:var(--text-mid); font-size:24px; line-height:1; }
.site-search-close:hover{ border-color:var(--crimson); color:var(--text-hi); }
.site-search-form{ display:flex; align-items:end; gap:10px; }
.site-search-label{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.site-search-form input{ min-width:0; flex:1; background:var(--bg-raised); border:1px solid var(--border); border-radius:8px; padding:12px 14px; color:var(--text-hi); font-size:13.5px; font-family:inherit; }
.site-search-form input:focus{ outline:none; border-color:var(--crimson); box-shadow:0 0 0 3px rgba(230,57,70,.28); }
.site-search-status{ color:var(--text-low); font-size:13px; padding:18px 0 12px; }
.site-search-results{ display:grid; gap:8px; }
.site-search-result{ display:flex; flex-direction:column; gap:3px; padding:13px 14px; border:1px solid var(--border); border-radius:8px; background:var(--bg-raised); }
.site-search-result:hover{ border-color:var(--crimson); background:var(--bg); }
.site-search-result strong{ color:var(--text-hi); font-size:14px; }
.site-search-result span{ color:var(--text-low); font-size:12.5px; }
@media (max-width:560px){
  .site-search{ padding:76px 14px 20px; }
  .site-search-panel{ padding:18px; max-height:84vh; }
  .site-search-form{ align-items:stretch; flex-direction:column; }
  .site-search-form .btn{ width:100%; justify-content:center; }
}
@media (max-width:980px){
  .nav-actions .search-box{ display:flex; width:40px; padding:9px 12px; }
  .nav-actions .search-box span{ display:none; }
}
@media (max-width:560px){
  .site-search-form .btn{ justify-content:center; }
}

/* Drawing gallery interactions */
html.drawing-page{ overflow-x:hidden; }
.drawing-empty-state{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-md); color:var(--text-low); padding:28px; text-align:center; margin-bottom:40px; }
.drawing-empty-state[hidden]{ display:none; }
.drawing-list-view{ display:flex; flex-direction:column; gap:12px; }
.drawing-list-view .card{ display:grid; grid-template-columns:180px 1fr; min-height:140px; }
.drawing-list-view .card-cover{ aspect-ratio:auto; min-height:140px; }
.drawing-list-view .card-body{ display:flex; flex-direction:column; justify-content:center; }
.drawing-modal[hidden]{ display:none; }
.drawing-modal{ position:fixed; inset:0; z-index:1100; display:flex; align-items:center; justify-content:center; padding:28px; }
.drawing-modal-open{ overflow:hidden; }
.drawing-modal-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.86); }
.drawing-lightbox-panel,.drawing-timelapse-panel{ position:relative; z-index:1; width:min(1100px,100%); max-height:calc(100vh - 56px); overflow:auto; background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-md); box-shadow:0 24px 80px rgba(0,0,0,.65); }
.drawing-lightbox-panel{ padding:18px; display:flex; flex-direction:column; align-items:center; }
.drawing-modal-close{ position:absolute; top:12px; right:12px; z-index:2; width:36px; height:36px; border:1px solid var(--border); border-radius:8px; background:rgba(10,10,12,.8); color:var(--text-hi); font-size:25px; line-height:1; cursor:pointer; }
.drawing-modal-close:hover,.drawing-modal-close:focus-visible{ border-color:var(--crimson); outline:none; }
.drawing-lightbox-image{ display:block; width:auto; max-width:100%; height:auto; max-height:calc(100vh - 190px); object-fit:contain; border-radius:6px; }
.drawing-lightbox-info{ align-self:stretch; padding:18px 8px 4px; }
.drawing-lightbox-info h2,.drawing-timelapse-panel h2{ font-family:var(--font-display); font-size:22px; margin-bottom:5px; }
.drawing-lightbox-meta{ color:var(--crimson); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.drawing-lightbox-description,.drawing-timelapse-description{ color:var(--text-low); font-size:13.5px; margin-top:8px; }
.drawing-timelapse-panel{ width:min(720px,100%); padding:28px; }
.drawing-timelapse-placeholder{ border:1px dashed var(--border); border-radius:var(--radius-md); padding:44px 24px; text-align:center; margin-bottom:24px; background:var(--bg-raised); }
.drawing-timelapse-icon{ display:flex; align-items:center; justify-content:center; width:52px; height:52px; border-radius:50%; margin:0 auto 16px; background:rgba(233,30,77,.12); color:var(--crimson); }
.drawing-timelapse-placeholder strong{ display:block; color:var(--text-hi); font-family:var(--font-display); font-size:18px; }
.drawing-timelapse-placeholder p{ color:var(--text-low); font-size:13px; max-width:48ch; margin:8px auto 0; }
@media (max-width:560px){
  .drawing-list-view .card{ grid-template-columns:110px 1fr; min-height:110px; }
  .drawing-list-view .card-cover{ min-height:110px; }
  .drawing-modal{ padding:12px; }
  .drawing-lightbox-panel,.drawing-timelapse-panel{ max-height:calc(100vh - 24px); }
  .drawing-lightbox-panel{ padding:10px; }
  .drawing-lightbox-image{ max-height:calc(100vh - 190px); }
  .drawing-timelapse-panel{ padding:20px; }
}
@media (max-width:980px){
  .drawing-page-layout{ grid-template-columns:1fr !important; }
}

/* Inline Blog reader */
.article-card{ cursor:pointer; }
.article-viewer[hidden]{ display:none; }
.article-viewer{ background:var(--bg); }
.article-viewer-head{ display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:30px; }
.article-viewer-label{ color:var(--text-low); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.article-reader{ max-width:820px; margin:0 auto; }
.article-reader-meta{ display:flex; align-items:center; gap:14px; color:var(--text-low); font-size:13px; margin-bottom:14px; }
.article-reader-category{ color:var(--crimson); font-family:var(--font-display); font-weight:700; text-transform:uppercase; letter-spacing:.1em; }
.article-reader h1{ font-family:var(--font-display); font-size:clamp(32px,5vw,58px); line-height:1.08; font-weight:900; margin-bottom:18px; }
.article-reader-excerpt{ color:var(--text-mid); font-size:17px; line-height:1.7; max-width:60ch; margin-bottom:28px; }
.article-reader-image{ width:100%; height:auto; border-radius:var(--radius-lg); border:1px solid var(--border); margin-bottom:34px; }
.article-reader-content{ max-width:680px; margin:0 auto; color:var(--text-mid); font-size:16px; line-height:1.85; }
.article-reader-content p{ margin-bottom:22px; }
.article-reader-content .article-lead{ color:var(--text-hi); font-size:19px; line-height:1.75; }
.article-reader-content h2{ color:var(--text-hi); font-family:var(--font-display); font-size:25px; line-height:1.2; margin:42px 0 14px; }
.article-reader-content strong{ color:var(--text-hi); }
.article-reader-content blockquote{ border-left:3px solid var(--crimson); color:var(--text-hi); font-family:var(--font-display); font-size:21px; line-height:1.5; margin:34px 0; padding:4px 0 4px 22px; }
.article-close{ display:flex; margin:42px auto 0; }
@media (max-width:560px){
  .article-viewer-head{ align-items:flex-start; flex-direction:column-reverse; margin-bottom:24px; }
  .article-reader h1{ font-size:34px; }
  .article-reader-excerpt{ font-size:15px; }
  .article-reader-image{ margin-bottom:26px; }
  .article-reader-content{ font-size:15px; line-height:1.75; }
  .article-reader-content .article-lead{ font-size:17px; }
  .article-reader-content h2{ font-size:22px; margin-top:34px; }
  .article-reader-content blockquote{ font-size:18px; margin:28px 0; }
}