/* Shared presentation layer. TZ requests, puzzle mechanics and game controls are untouched. */
:root{--sh-gold:#e6c583;--sh-jade:#65ead5;--sh-edge:rgba(162,212,206,.18);--sh-ease:cubic-bezier(.2,.8,.2,1)}
body{background:radial-gradient(ellipse at 7% 0%,rgba(33,126,117,.15),transparent 36%),radial-gradient(ellipse at 93% 10%,rgba(166,124,51,.09),transparent 30%),linear-gradient(165deg,#081319,#04090e 65%,#050a0e)!important;-webkit-font-smoothing:antialiased}
::selection{background:rgba(101,234,213,.26);color:#fff}
.site-header,.topbar,.console-topbar{border-bottom-color:var(--sh-edge);box-shadow:0 8px 35px rgba(0,0,0,.16)}
.login-card,.tz-login-float,.panel,.member-card,.profile-card,.access-card,.price-card,.feature-card,.bento,.tz-mirror-card,.first-deposit-card,.quick-card-member,.tickets-card{
  border-color:var(--sh-edge);background:linear-gradient(145deg,rgba(20,34,42,.96),rgba(8,17,23,.98));
  box-shadow:0 20px 55px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.045);
}
.login-card{padding:24px;border-radius:22px}
.login-card .mark{background:radial-gradient(circle,rgba(230,197,131,.18),rgba(230,197,131,.025));border-color:rgba(230,197,131,.45);box-shadow:0 0 22px rgba(230,197,131,.07)}
.tz-login-float{border-radius:24px!important;border-color:rgba(230,197,131,.28)!important;box-shadow:0 35px 110px rgba(0,0,0,.62),0 0 65px rgba(48,167,150,.06)!important;max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}
.tz-modal-brand strong{letter-spacing:.5px}.tz-modal-desc{line-height:1.8!important}
.tz-native-puzzle{padding:0;border:0;border-radius:10px;background:#071219;box-shadow:0 0 0 8px #071219,0 0 0 9px rgba(101,234,213,.16);max-width:310px;width:100%;margin:21px auto}
.tz-native-puzzle canvas{border-radius:7px}.tz-native-puzzle .puzzle-track{background:#122129!important;border-color:#34484e!important}.tz-native-puzzle .puzzle-hint{color:#b5c8cd!important}
.tz-modal-status{min-height:36px;border:1px solid rgba(101,234,213,.12);background:rgba(101,234,213,.035);border-radius:12px;padding:9px 12px}
.eyebrow,.mini-title,.brand-sub{color:var(--sh-gold)}
.primary-btn,.btn-primary,.tz-modal-submit{
  background:linear-gradient(115deg,#e7ca8c,#d0a65f 64%,#ecd297)!important;color:#142020!important;
  border-color:rgba(255,232,173,.52)!important;box-shadow:0 5px 18px rgba(178,137,62,.17),inset 0 1px 0 rgba(255,255,255,.25);
}
.ghost-btn,.btn-secondary,.gold-outline{border-color:rgba(230,197,131,.28);background:rgba(230,197,131,.035)}
button:not(.puzzle-btn),.btn,.member-button,.console-nav-button,.nav-links a,.mobile-menu a{
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:background-color .18s,border-color .18s,box-shadow .2s,color .18s,filter .18s;
}
.primary-btn:active,.btn:active,.tz-modal-submit:active,.ghost-btn:active,.gold-outline:active,.view-btn:active,.member-button:active{filter:brightness(1.15);box-shadow:0 0 0 4px rgba(101,234,213,.10),0 3px 15px rgba(0,0,0,.25)}
button:focus-visible,a:focus-visible{outline:2px solid var(--sh-jade)!important;outline-offset:4px!important}
input:not([type=checkbox]):not([type=radio]):not([type=color]),select,textarea{transition:border-color .2s,box-shadow .2s,background-color .2s}
input:focus,select:focus,textarea:focus{border-color:rgba(101,234,213,.6)!important;box-shadow:0 0 0 3px rgba(101,234,213,.11)!important;background-color:#0b1921}
button:disabled{cursor:default}
.primary-btn:disabled,.tz-modal-submit:disabled{filter:saturate(.55);opacity:.7}
.status.active,.status-dot,.tzConnectionDot.on{box-shadow:0 0 14px rgba(101,234,213,.15)}
.table-wrap,.member-table-wrap,.tz-live-table-wrap{border-color:var(--sh-edge)}
thead th{color:#b7c7cd;background-color:#101d25}
tbody tr{transition:background-color .15s}tbody tr:hover{background-color:rgba(101,234,213,.035)}
.console-sidebar{background:linear-gradient(180deg,#0d1b23,#071017)!important;border-right-color:var(--sh-edge)}
.console-nav button.active,.nav-links a.active,.guide-tabs button.active,.filter-btn.active{box-shadow:inset 3px 0 0 var(--sh-jade),0 0 20px rgba(101,234,213,.045)}
.hero-kicker,.device-pills span,.module-state{border-color:rgba(101,234,213,.23);box-shadow:0 0 22px rgba(101,234,213,.035)}
.hero-product,.about-emblem{filter:drop-shadow(0 18px 32px rgba(0,0,0,.3))}
.price-card.featured,.price-card.recommended{border-color:rgba(230,197,131,.5);box-shadow:0 25px 70px rgba(0,0,0,.32),0 0 38px rgba(230,197,131,.055)}
.sh-feedback-surface{position:fixed;pointer-events:none;z-index:2147483000;overflow:hidden;contain:strict}
.sh-feedback-ripple{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,236,187,.48),rgba(101,234,213,.19) 55%,transparent 72%);transform:translate(-50%,-50%) scale(0);animation:sh-ripple .52s var(--sh-ease) forwards}
.press-wave,.scarab-atg-wave{background:rgba(101,234,213,.26)!important}
.sh-status-flash{animation:sh-status-flash .7s ease-out}
.sh-view-enter{animation:sh-view-enter .28s var(--sh-ease) both}
@keyframes sh-ripple{to{transform:translate(-50%,-50%) scale(1);opacity:0}}
@keyframes sh-status-flash{0%{box-shadow:0 0 0 0 rgba(101,234,213,.3)}60%{box-shadow:0 0 0 5px rgba(101,234,213,.06)}100%{box-shadow:0 0 0 7px transparent}}
@keyframes sh-view-enter{from{opacity:.3;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(hover:hover) and (pointer:fine){
  .feature-card,.price-card,.bento,.quick-card-member{transition:border-color .25s,box-shadow .25s,translate .25s var(--sh-ease)}
  .feature-card:hover,.price-card:hover,.bento:hover,.quick-card-member:hover{border-color:rgba(101,234,213,.35);box-shadow:0 24px 60px rgba(0,0,0,.3),0 0 22px rgba(101,234,213,.035);translate:0 -3px}
  .primary-btn:hover,.btn-primary:hover,.tz-modal-submit:hover{filter:brightness(1.07);box-shadow:0 7px 25px rgba(178,137,62,.23)}
  .ghost-btn:hover,.gold-outline:hover,.btn-secondary:hover{border-color:rgba(101,234,213,.5);background:rgba(101,234,213,.065)}
}
@media(pointer:coarse){
  .primary-btn,.ghost-btn,.gold-outline,.filter-btn,.view-btn,.tz-modal-submit,.console-nav button{min-height:44px}
  .login-card input,.tz-modal-field input{font-size:16px!important}
  .tz-modal-close{min-width:44px;min-height:44px}
}
@media(max-width:600px){.login-card{padding:21px}.tz-login-float{border-radius:20px!important}.tz-modal-desc{font-size:13px!important}}
@media(prefers-reduced-motion:reduce){
  .sh-feedback-surface{display:none}.sh-status-flash,.sh-view-enter{animation:none!important}
  .feature-card,.price-card,.bento,.quick-card-member,button,.btn,input,select,textarea{transition:none!important}
  .feature-card:hover,.price-card:hover,.bento:hover,.quick-card-member:hover{translate:none}
}

@media(hover:hover) and (pointer:fine){
 .primary-btn,.btn-primary,.tz-modal-submit{background-size:180% 100%!important;background-position:100% 0!important;transition:background-position .55s,filter .2s,box-shadow .2s}
 .primary-btn:hover,.btn-primary:hover,.tz-modal-submit:hover{background-position:0 0!important}
}
@media(prefers-reduced-motion:no-preference) and (min-width:900px){
 .hero-glow-a{animation:sh-ambient-a 12s ease-in-out infinite alternate}.hero-glow-b{animation:sh-ambient-b 15s ease-in-out infinite alternate}
}
@keyframes sh-ambient-a{to{transform:translate(18px,12px) scale(1.06)}}
@keyframes sh-ambient-b{to{transform:translate(-14px,16px) scale(.96)}}
