/* The same universe, composed for a hand-held viewport. Desktop rules stay in
   their own scene sheets. svh keeps the composition still as browser bars move. */
html{scroll-padding-top:96px;-webkit-text-size-adjust:100%}
@media(pointer:coarse){html,body{overscroll-behavior-x:none}}
.scene-zoomed *,.scene-zoomed *:before,.scene-zoomed *:after{animation-play-state:paused!important}
.scene-zoomed :is(.nebula,.matrix-nebula,.lunevia-moon,.home-moon,.figure-glow){filter:none!important}
.scene-zoomed :is(.card,.insight-card,.sidebar,.city-suggestions),.scene-zoomed dialog::backdrop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
/* Safari can keep a fullscreen dialog, a live backdrop and a preserved-3D
   flip in separate GPU surfaces while the visual viewport is magnified. A
   revealed tarot card needs only its face during that short gesture. Keeping
   one flat surface limits compositor memory during zoom without
   disabling reading zoom or changing the normal card animation. */
@media(pointer:coarse){
  .card-vision:has(.face-settled) .vision-card-holder,
  .card-vision .vision-card.face-settled{perspective:none}
  .vision-card.face-settled :is(.card-drift,.card-tilt,.card-flipper){transform-style:flat}
  .vision-card.face-settled .card-flipper{transform:none!important;transition:none!important}
  .vision-card.face-settled .card-back{display:none}
  .vision-card.face-settled .card-front{transform:none;backface-visibility:visible;-webkit-backface-visibility:visible}
  .scene-zoomed .card-vision{height:100svh;max-height:100svh;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transition:none!important}
  .scene-zoomed .card-vision .vision-world{visibility:hidden}
  .scene-zoomed .vision-card.face-settled :is(.card-drift,.card-tilt,.card-flipper){transform:none!important;transition:none!important;animation:none!important}
  .scene-zoomed .vision-card.face-settled .card-front{box-shadow:none!important}
  .scene-zoomed .vision-card.face-settled:before{box-shadow:none!important;transition:none!important}
  .scene-zoomed .vision-card.face-settled :is(.art-depth,.card-embers,.front-foil){display:none!important;animation:none!important;mix-blend-mode:normal!important}
}
/* Static optical textures do not need a live SVG filter on every frame. */
.noise,.grain{background-image:url('/cosmic-grain.webp')!important;background-repeat:repeat!important;background-size:160px 160px!important}
@media(pointer:coarse){
 body:has(.main-scene) .nebula,.universe .nebula{background:none!important;filter:none!important}
 body:has(.main-scene) .nebula:before,.universe .nebula:before{content:'';position:absolute;background-size:100% 100%;background-repeat:no-repeat;pointer-events:none}
 body:has(.main-scene) .nebula:before{inset:-420px}
 .universe .nebula:before{inset:-330px}
 .nebula-1:before{background-image:url('/home-nebula-a.webp')}
 .nebula-2:before{background-image:url('/home-nebula-b.webp')}
 .nebula-one:before{background-image:url('/tarot-nebula-a.webp')}
 .nebula-two:before{background-image:url('/tarot-nebula-b.webp')}
 body .main-scene .card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
}
.mobile-orbit-controls,.mobile-orbit-pause,.home-header-crest{display:none}
@media(max-width:900px){body .main-scene,body .main-scene .card,body .main-scene .card *{touch-action:pan-y pinch-zoom!important;overscroll-behavior-x:contain}}
@media(max-width:900px){
  html{scrollbar-width:none}html::-webkit-scrollbar{display:none}
  body{overscroll-behavior-x:none}
  button,a,input{ -webkit-tap-highlight-color:transparent }
  input,button,a{touch-action:manipulation}
  input{scroll-margin-block:110px 150px}
  :is(.frame-header,.observatory-header,.matrix-header){padding:calc(14px + env(safe-area-inset-top)) 12px 14px;min-height:76px;align-items:center}
  :is(.exit-link,.back-link,.matrix-back){min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:flex-start;gap:8px}
  :is(.scene-tools,.observatory-header .tools,.matrix-tools){gap:0}
  :is(.icon-button,.matrix-tools button,.observatory-header .tools button){min-width:44px;min-height:44px}
  :is(.wordmark,.observatory-wordmark,.matrix-wordmark){white-space:nowrap}
  :is(.exit-label,.back-link>span:last-child,.matrix-back>span:last-child){display:none}
  .frame-footer,.observatory-footer{padding-bottom:env(safe-area-inset-bottom)}
  /* A true depth orbit. Transforms come exclusively from home.js. */
  body:has(.main-scene) header{position:absolute;inset:0 0 auto;display:grid;grid-template-columns:1fr auto;align-items:center;padding:calc(14px + env(safe-area-inset-top)) 20px 0;gap:12px 16px}
  .home-header-crest{display:flex;align-items:center;gap:10px;min-height:48px;color:#d6c497;text-decoration:none}
  .home-header-crest>span:first-child{font:36px/1 Georgia,serif;color:#e2c574;filter:drop-shadow(0 0 12px #d9bc7020)}
  .home-header-crest>span:last-child{font:400 8px/1.7 'Golos Text',sans-serif;text-transform:uppercase;letter-spacing:1.5px;color:#baa8c4}
  .home-navigation{grid-column:1/-1;order:2;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:0!important;width:100%;padding:8px 0 12px!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;backdrop-filter:none;position:relative}
  .home-navigation:after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#dec57c55,transparent)}
  .home-navigation a{position:relative;min-height:66px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;padding:4px 3px!important;text-align:center;font:400 10px/1.5 'Golos Text',sans-serif;letter-spacing:.1px;color:#c8b9d4;border:0;border-radius:0;background:none}
  .home-navigation a+a:before{content:'';position:absolute;top:12px;left:0;width:1px;height:30px;background:linear-gradient(transparent,#d5b97530,transparent)}
  .home-navigation .nav-symbol{width:20px;height:20px;min-height:20px;color:#d4b876;opacity:.8}
  .home-navigation a:active{color:#f2dcac;background:#d9bc7008}
  .btn-luna{min-height:46px;padding:8px 14px!important;font-size:11px!important;letter-spacing:.25px;gap:8px;border-color:#d9bc7040;background:linear-gradient(135deg,#c9ab6b0d,#21142a35);box-shadow:inset 0 1px #e9d5a112;border-radius:9px}
  .btn-luna:before{display:none}.btn-luna>span:first-child{font-size:22px;line-height:1}
  .btn-luna:after{left:12px;right:12px;opacity:.25}
  .hero-section{padding:calc(164px + env(safe-area-inset-top)) 0 36px!important;min-height:100svh;overflow:hidden}
  #scale-wrapper{width:100%;height:auto;position:relative;transform:none!important}
  .logo-container{margin:0 auto 0!important;padding:0 20px;position:relative;top:auto;left:auto;transform:none}
  .logo-container h1{font-size:clamp(32px,8vw,52px);letter-spacing:clamp(6px,2vw,12px)}
  .logo-container p{font-size:18px;line-height:1.4;letter-spacing:2px;margin-top:10px}
  .main-scene>.home-moon{position:absolute;top:28%;left:50%;width:clamp(240px,78vw,380px);max-width:none;transform:translate(-50%,-50%);opacity:.95;z-index:48;filter:drop-shadow(0 0 35px #e4c16425);pointer-events:none}
  .background-orbits{display:block!important;position:absolute;inset:80px -45%;width:190%;height:680px;opacity:.45;pointer-events:none}
  .main-path-ring{display:block!important;pointer-events:none;opacity:.3;width:750px;height:300px;left:50%;top:54%;transform:translate(-50%,-50%) rotate(-16deg)}
  .main-scene{display:block!important;position:relative!important;inset:auto!important;width:100%!important;height:clamp(540px,62svh,600px)!important;margin:0;padding:0;overflow:hidden;overflow:clip;scroll-snap-type:none;perspective:1100px;touch-action:pan-y;transform:none!important;isolation:isolate;z-index:50;cursor:grab}
  .main-scene:active{cursor:grabbing}
  .main-scene .card{position:absolute!important;left:50%!important;top:0!important;right:auto!important;bottom:auto!important;width:min(84vw,332px)!important;height:440px!important;min-height:0!important;padding:26px 24px 24px!important;transform-origin:center center;filter:none!important;border-color:#d5b86b45;background:radial-gradient(ellipse at 20% 0,#b99bcd12,transparent 65%),linear-gradient(150deg,#33234066,#111022c9 55%,#25182d80)!important;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);box-shadow:inset 0 0 36px #a68ab008,0 20px 40px #02010a40;transition:border-color .8s,box-shadow .8s;will-change:transform}
  .main-scene .card::before{display:block;inset:9px;opacity:.18;pointer-events:none;border-color:#d4b56b40;transform:none}
  .main-scene .card.mobile-near{border-color:#e2c87b80;box-shadow:inset 0 0 50px #d7ba7110,0 12px 50px #c3a06312}
  .main-scene .card-inner{transform:none!important;opacity:var(--orbit-ink,1)!important;filter:none;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0;animation:none!important}
  .main-scene .card .card-icon{margin-bottom:14px}.main-scene .card .card-icon svg{width:38px;height:38px}
  .main-scene .card h3{font-size:30px;line-height:1.05;margin-bottom:16px}
  .main-scene .card p{font-family:'Golos Text',system-ui,sans-serif;font-size:14px!important;line-height:1.65!important;color:#ddd3e4!important;opacity:1!important;letter-spacing:0;max-width:300px;margin-bottom:12px}
  .main-scene .card .price-tag{margin-top:12px;font-size:12px;padding:4px 0}
  .main-scene .card-invitation{opacity:1!important;transform:none!important;margin-top:16px;padding-top:12px;font-size:9px}
  .mobile-orbit-controls{display:flex;align-items:center;justify-content:center;gap:6px;position:relative;z-index:60;margin-top:-10px}
  .mobile-orbit-controls button{width:44px;height:44px;background:none;border:0;color:#b9a2c6;display:grid;place-items:center}
  .mobile-orbit-controls button::after{content:'';width:5px;height:5px;transform:rotate(45deg);border:1px solid #bca16b;transition:background .6s,box-shadow .6s,transform .6s}
  .mobile-orbit-controls button[aria-current=true]::after{background:#e6c77b;box-shadow:0 0 18px #e6c77b90;transform:rotate(45deg) scale(1.3)}
  .mobile-orbit-pause{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;margin:0 auto;padding:4px 20px;color:#c4b4ce;background:none;border:0;font:400 9px/1.5 'Golos Text',sans-serif;letter-spacing:.6px;cursor:pointer}
  .mobile-orbit-pause>span:first-child{font-size:16px;color:#d8c18b}.mobile-orbit-pause:disabled{opacity:.5}
  .mobile-orbit-hint{margin:2px 24px 0;text-align:center;font:300 15px/24px 'Cormorant Garamond',Georgia,serif;color:#b6a3c2;letter-spacing:.3px}
  .home-whisper{position:relative!important;inset:auto!important;transform:none!important;margin:20px 24px 0!important;font-size:10px;text-align:center;line-height:1.7}
  .home-cta{position:relative;inset:auto;transform:none;display:table;margin:24px auto 0;font-size:12px}
  .site-footer{padding:48px 24px calc(28px + env(safe-area-inset-bottom))!important}
  .footer-container{gap:32px!important}.footer-note{gap:16px;flex-wrap:wrap;font-size:8px;line-height:1.8}
  .footer-desc{font-size:15px;line-height:1.8}.home-notice{inset:auto 16px calc(16px + env(safe-area-inset-bottom));max-width:none}
}
@media(max-width:700px){
  :is(.wordmark,.matrix-wordmark){font-size:15px;letter-spacing:4px}
  .wordmark>span,.matrix-wordmark>span{font-size:24px;margin-right:4px}
  /* The observatory remains an open sky, including while the keyboard is up. */
  #observatory{padding:calc(108px + env(safe-area-inset-top)) 24px calc(90px + env(safe-area-inset-bottom));min-height:100svh}
  .birth-journey{width:100%;max-width:520px}
  .birth-journey h1{font-size:clamp(38px,10.6vw,60px);line-height:1.02}
  .stage-whisper{font-size:20px;line-height:1.5;max-width:330px;margin-inline:auto}
  .birth-field{margin-top:32px}.birth-field input{min-height:72px}
  .birth-field #birth-date{font-size:clamp(29px,8.4vw,40px);letter-spacing:1px}
  .birth-field #birth-time{font-size:40px}
  .birth-field #birth-place{font-size:clamp(26px,7.5vw,36px);padding-inline:8px}
  .calendar-trigger{min-width:44px;min-height:44px;top:14px;right:-8px}
  .primary-action{min-height:56px;gap:12px;font-size:11px;letter-spacing:1px;max-width:100%}
  .quiet-link,.result-tools button,.observatory-footer button{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .journey-trail{flex-wrap:wrap;gap:6px;line-height:1.6}.journey-chapters button{min-width:44px;min-height:44px}
  .observatory-footer{bottom:12px;left:20px;right:20px;font-size:8px}
  #city-results{max-height:min(240px,35svh);overscroll-behavior:contain}#city-results [role=option]{min-height:60px;padding:12px}
  .city-suggestions{backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
  /* Custom date/time controls become a reachable, scrollable celestial sheet. */
  :is(dialog.birth-calendar,dialog.matrix-calendar){width:min(440px,calc(100vw - 20px));max-height:calc(100dvh - 24px - env(safe-area-inset-top));margin:auto auto max(10px,env(safe-area-inset-bottom));padding:22px 18px calc(20px + env(safe-area-inset-bottom));border-radius:20px 20px 8px 8px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .calendar-caption button{width:44px;height:44px}.calendar-nav{grid-template-columns:44px 1fr auto 44px;gap:2px;margin-bottom:14px}
  .calendar-nav button{min-height:44px;font-size:23px}.calendar-week{margin-bottom:8px}
  .calendar-days{gap:2px}.calendar-days button{height:44px;font-size:24px;line-height:40px}
  .calendar-choices button{min-height:52px;font-size:23px}
  .calendar-note{font-size:10px;line-height:1.7;margin-top:16px;padding-top:12px}
  .clock-values{max-height:240px;gap:3px}.clock-values button{height:44px;font-size:23px}
  .clock-display button{min-width:80px;min-height:70px}.birth-clock .primary-action{font-size:11px}
  /* Matrix: the star gate and its full pattern remain visible. */
  #matrix-observatory{padding:calc(100px + env(safe-area-inset-top)) 18px calc(48px + env(safe-area-inset-bottom))}
  .matrix-intro{gap:12px}.matrix-prologue h1{font-size:clamp(46px,12.5vw,66px)}
  .matrix-lead{font-size:20px;line-height:1.4}.matrix-legend{font-size:9px;gap:16px}
  .matrix-gate{width:100%;max-width:440px;min-height:350px}.matrix-input-wrap input{font-size:clamp(29px,8vw,38px);max-width:100%;letter-spacing:1px}
  .matrix-calendar-trigger{min-width:44px;min-height:44px}.matrix-input-label{font-size:10px}
  .matrix-action{min-height:52px;font-size:11px;gap:12px}.matrix-note{font-size:9px;line-height:1.6}
  .matrix-layout{min-width:0;gap:28px}.matrix-figure{min-width:0;width:100%}.matrix-figure svg{max-width:100%;overflow:visible}
  .result-heading h2{font-size:clamp(40px,11vw,58px)}.matrix-insights{min-width:0}.matrix-result .result-actions{flex-wrap:wrap;gap:10px}
  .matrix-result-actions button,.matrix-result-actions a{min-height:48px}.matrix-node{touch-action:manipulation}
  /* Two dust worlds, rather than two cramped desktop columns. */
  #union-main{padding:calc(112px + env(safe-area-inset-top)) 20px calc(48px + env(safe-area-inset-bottom));min-height:100svh}
  .union-heading h1{font-size:clamp(43px,11.8vw,62px);line-height:1.02}.union-heading>p:last-child{font-size:20px;line-height:1.4}
  .union-births{width:100%;max-width:480px;gap:12px;grid-template-columns:minmax(0,1fr) 16px minmax(0,1fr)}
  .union-births>div{min-width:0}.union-births input{font-size:clamp(21px,5.8vw,29px);letter-spacing:0;padding-left:0;padding-right:28px;min-height:60px;width:100%}
  .union-births label{font-size:23px;letter-spacing:0}.union-births button{width:44px;height:44px;right:-8px}
  .union-launch{min-height:56px;font-size:11px;max-width:100%;gap:10px}
  .union-result-layout{min-width:0;gap:24px}.union-result-layout svg{max-width:100%}#union-result h2{font-size:46px}
  /* Tarot remains a full-screen encounter, with room for the whole meaning. */
  .scene{height:100svh;min-height:760px;max-height:none}.scene-heading{top:15%;left:20px;right:20px}
  .scene-heading h1{font-size:clamp(42px,11.5vw,62px);line-height:1.02}.scene-heading .eyebrow{line-height:1.8}
  .deck-constellation{top:37%;gap:24px;width:100%}.deck-choice{width:40%;max-width:210px}
  .deck-sculpture{width:clamp(110px,32vw,175px)}.deck-caption strong{font-size:clamp(23px,6vw,30px)}
  .scene-whisper{bottom:12%;left:28px;right:28px;line-height:1.6;font-size:16px}
  .intention-form{width:calc(100% - 40px);top:39%}.intention-scene .scene-heading{top:19%}
  .question-field input{font-size:22px;min-height:64px}.spread-selector{margin-top:34px}.arrow-button{min-width:48px;min-height:48px}
  .spread-name h2{font-size:32px}.spread-name>p{line-height:1.6}.ritual-link{min-height:54px}
  .ritual-heading{top:14%}.ritual-heart{top:40%}.reading-rail{max-width:calc(100% - 32px);gap:8px}
  .rail-slot{min-width:0}.rail-card{touch-action:manipulation}.ritual-bottom{bottom:8%}
  body.complete .reading-rail{gap:24px 16px;justify-content:center}
  body.complete .rail-slot{max-width:140px}.rail-caption{font-size:11px;line-height:1.5}
  .card-vision{height:100svh;max-height:100svh;overflow-x:hidden;overflow-y:auto;padding:calc(24px + env(safe-area-inset-top)) 22px calc(28px + env(safe-area-inset-bottom));--card-h:min(46svh,430px);overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .vision-position{position:relative;inset:auto;margin:0 24px 22px;min-height:50px}.vision-position>p{font-size:17px}
  .vision-card-holder{position:relative;left:50%;top:auto;margin:0 0 22px;height:var(--card-h);max-width:74vw}
  .vision-copy{position:relative;inset:auto;padding:0;margin:0 auto;max-width:440px}
  .vision-copy h2{font-size:36px;line-height:1.05;margin:8px 0 12px}.vision-copy>p{font-size:20px;line-height:1.45;max-width:380px;min-height:0;color:#d4c7da}
  .vision-copy .eyebrow{font-size:9px}.card-vision.revealed .vision-copy .ritual-link{opacity:.9;font-size:11px;margin-top:16px;min-height:52px}
  .vision-close{position:fixed;top:calc(10px + env(safe-area-inset-top));right:10px;min-width:44px;min-height:44px}
  .vision-ring{top:36%;width:130vw;height:130vw}.ring-two{width:160vw;height:160vw}.vision-loading{position:relative;inset:auto;margin-top:20px}
  /* Account navigation and touch targets retain their labels. */
  .workspace .topbar{padding-top:calc(14px + env(safe-area-inset-top))}
  .sidebar nav{padding-bottom:env(safe-area-inset-bottom)}
  .sidebar nav button{min-height:56px;min-width:44px}
  .copy-field input,#display-name{font-size:16px}
  #profile-dialog,#purchase-dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);overflow:auto;padding:30px 24px}
  .toast{bottom:calc(94px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px)}
}
@media(max-width:600px){
  .sidebar{height:calc(76px + env(safe-area-inset-bottom))}.sidebar nav{min-height:76px;padding:4px 8px calc(4px + env(safe-area-inset-bottom));gap:0}
  .sidebar nav button{display:flex;flex-direction:column;justify-content:center;gap:4px;padding:8px 2px;font-size:8px;line-height:1.3;letter-spacing:0}
  .sidebar nav button>span{font-size:22px;line-height:24px;margin:0}
  .workspace #content{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
  .topbar .top-actions{gap:8px}.topbar #profile-top{display:grid;width:40px;height:40px;font-size:22px}
  .welcome h1,.page-heading h1{font-size:clamp(38px,10.5vw,52px);line-height:1.04}
  .moon-room{min-height:460px}.moon-copy{z-index:2}.moon-copy h2{font-size:31px;line-height:1.12;text-shadow:0 2px 24px #070414}
  .moon-foot{gap:10px;flex-wrap:wrap}.moon-foot button{min-height:44px}
  .gift .gold-button{min-height:52px}.gift-note{font-size:10px;line-height:1.7}
  .ritual-links{gap:12px}.ritual-links a{min-width:0;padding:24px 16px}.ritual-links h3{font-size:24px;line-height:1.1}
  .copy-field{flex-direction:column;align-items:stretch;gap:10px}.copy-field input{width:100%;min-width:0}.copy-field button{min-height:48px;justify-content:center}
  .wallet-summary{flex-wrap:wrap;gap:16px}.wallet-summary .gold-button{width:100%;justify-content:center}
}
@media(max-width:360px){
  .home-navigation a,.home-navigation button{font-size:9px}.main-scene .card{padding-inline:20px!important}.main-scene .card h3{font-size:29px}
  .calendar-nav{grid-template-columns:36px 1fr auto 36px}.calendar-nav button{font-size:20px}.calendar-nav #calendar-year{font-size:19px}
  .calendar-days button{height:40px}:is(dialog.birth-calendar,dialog.matrix-calendar){padding-inline:12px}.union-births{gap:6px;grid-template-columns:minmax(0,1fr) 8px minmax(0,1fr)}
  .wordmark,.matrix-wordmark{font-size:13px;letter-spacing:3px}.scene-tools,.matrix-tools{gap:0}.scene-tools button,.matrix-tools button{min-width:40px}
  .scene{min-height:740px}.deck-constellation{gap:12px}.deck-sculpture{width:108px}.deck-caption strong{font-size:22px}
}
@media(max-height:500px) and (orientation:landscape){
  .hero-section{padding-top:160px!important}.logo-container{margin-bottom:0!important}
  #observatory{padding-top:100px;padding-bottom:70px}.birth-journey h1{font-size:42px}.birth-field{margin-top:16px}
  :is(dialog.birth-calendar,dialog.matrix-calendar){margin:auto;max-height:calc(100dvh - 20px);width:430px}.clock-values{max-height:120px}
  .card-vision{--card-h:68svh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:16px;padding:54px 36px 24px}
  .card-vision:not([open]){display:none}.vision-position{position:absolute;top:12px;left:20px;right:20px;margin:0;min-height:0}.vision-position>p{display:none}
  .vision-card-holder{left:auto;justify-self:center;transform:none;margin:0}.vision-copy{position:relative;inset:auto;margin:0}.vision-copy h2{font-size:30px}.vision-copy>p{font-size:17px}
  .vision-copy .ritual-link{margin-top:10px!important}.vision-loading{grid-column:2}
}
@media(hover:none) and (pointer:coarse){
  .deck-choice:hover .deck-sculpture{transform:none}.fan-card:hover{transform:translate(calc(-50% + var(--x)),var(--y)) rotate(var(--angle));filter:none}
  .card,.deck-choice,.fan-card,.rail-card{-webkit-user-select:none;user-select:none}
  .main-scene .card .card-inner{animation:none}.deck-choice:active .deck-cover{filter:brightness(1.12)}
}
@media(max-width:900px) and (prefers-reduced-motion:no-preference){
  .main-scene .mobile-near .card-icon{animation:mobile-sigil-breathe 6s ease-in-out infinite}

  body:has(.main-scene) .static-star{animation:mobile-starlight 7s ease-in-out infinite alternate;animation-duration:calc(var(--twinkle-dur,3s) + 4s);animation-delay:var(--twinkle-del,0s)}
}
@keyframes mobile-sigil-breathe{0%,100%{transform:translateY(0);filter:drop-shadow(0 0 10px #e3c68035)}50%{transform:translateY(-4px);filter:drop-shadow(0 0 22px #e3c68070)}}
@keyframes mobile-card-breathe{0%,100%{translate:0 0}50%{translate:0 -2px}}
@keyframes mobile-starlight{from{opacity:.35}to{opacity:.75}}
@media(prefers-reduced-motion:reduce){.main-scene{scroll-behavior:auto}.mobile-near .card-inner,.mobile-near .card-icon{animation:none!important}}

@media(max-width:700px){body:has(.universe){isolation:isolate}.scene-whisper{padding-inline:0}.fan-card{width:94px}.matrix-footer{position:relative;inset:auto;padding:20px 20px calc(20px + env(safe-area-inset-bottom));gap:20px;letter-spacing:1px}.matrix-result-actions{flex-wrap:wrap;gap:18px}.matrix-result-actions button{min-height:48px}.union-births .birth-world{padding-inline:0}.union-births .birth-line input{padding-right:25px;text-align:left}.union-births .birth-caption{font-size:9px;line-height:1.5}.union-launch{min-height:56px}.figure-caption{flex-direction:column;gap:8px;text-align:center;line-height:1.5;letter-spacing:1px}.pair-actions button{min-height:48px}}

.mobile-matrix-picker{display:none}.pair-node .pair-hit{fill:transparent!important;stroke:none!important}
@media(max-width:700px){.mobile-matrix-picker{display:block;max-width:100%;margin:24px 10px 0;text-align:center}.mobile-matrix-picker>span{display:block;color:#bbaaC7;font-size:10px;line-height:1.6;letter-spacing:.5px;margin-bottom:8px}.mobile-matrix-picker select{width:100%;min-height:50px;padding:12px 24px 12px 12px;font:400 16px/1.5 'Cormorant Garamond',Georgia,serif;color:#ebdcb8;border:0;border-bottom:1px solid #d9bc7050;background:#130c2370;border-radius:0;text-align:center;color-scheme:dark}.mobile-matrix-picker select option{background:#130c23;color:#ebdcb8}.matrix-figure .matrix-detail{margin:20px auto 6px;padding:16px 10px 0}.matrix-figure .matrix-detail p{font-size:12px;line-height:1.7}.matrix-intro h1 em br::after{content:' '}.sidebar .nav-item{width:auto;flex:1}.sidebar .nav-item small{display:none}}

@media(max-width:600px){.topbar .mobile-brand{white-space:nowrap;font-size:16px;letter-spacing:2px;flex-shrink:0}.workspace .topbar{padding-inline:16px;gap:12px}.topbar .top-actions{gap:4px}.topbar .balance-pill{padding:5px 9px;gap:4px}.topbar .icon-button{min-width:36px}.gold-button{min-height:48px}.text-button{min-height:44px}.referral-card h2{font-size:32px}.referral-card .copy-field{width:100%}.mobile-matrix-picker select{font-size:19px}.matrix-gate .matrix-input-wrap input{font-size:clamp(27px,8vw,38px)}}

@media(max-width:700px){.matrix-intro{min-width:0;max-width:100%}.matrix-prologue{width:100%;min-width:0}.matrix-gate{aspect-ratio:auto;min-width:0;max-width:100%;height:350px;overflow:hidden}.matrix-lead{max-width:100%}.matrix-gate .matrix-note{max-width:95%}.matrix-gate .matrix-input-wrap{width:88%}.matrix-gate .matrix-input-wrap input{padding-left:8px;padding-right:30px;font-size:clamp(27px,8vw,36px)}}

@media(max-width:700px){body.complete .reading-rail{row-gap:48px}body.complete .rail-slot::after{font-size:11px;line-height:1.4;letter-spacing:0}.skip-time{min-height:44px}}

@media(max-width:700px){.deck-scene{overflow:hidden;overflow:clip}}

@media(max-width:700px){.fan-card{transform-origin:50% 50%}.summon-circle{width:min(350px,92vw);height:min(350px,92vw)}}

@media(max-height:500px) and (orientation:landscape){.card-vision{align-content:center;grid-template-rows:1fr}.vision-card-holder{position:relative;inset:auto;grid-column:1;grid-row:1;align-self:center;justify-self:center;transform:none}.vision-copy{grid-column:2;grid-row:1;align-self:center}.vision-position{position:absolute;top:12px;left:20px;right:20px;bottom:auto}}
