/* ISHOD 3201 — V8 visual polish layer
   Adds consistency without changing page architecture. */
:root{
  --ui-radius:10px;
  --ui-radius-lg:18px;
  --ui-radius-xl:26px;
  --ui-ease:cubic-bezier(.22,.72,.18,1);
  --ui-shadow:0 24px 70px rgba(0,0,0,.32);
  --ui-shadow-hover:0 34px 92px rgba(0,0,0,.44);
  --ui-focus:0 0 0 3px rgba(89,232,239,.18);
}

html{scrollbar-gutter:stable}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,a,input,select{outline:none}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{
  outline:1px solid rgba(89,232,239,.8);
  outline-offset:3px;
  box-shadow:var(--ui-focus);
}

/* Unified header */
.site-header{
  max-width:1880px;
  margin-inline:auto;
  border-radius:12px;
  box-shadow:0 14px 42px rgba(0,0,0,.22);
}
.site-header.scrolled{box-shadow:0 18px 50px rgba(0,0,0,.32)}
.brand-sigil,.brand-sigil:before{transition:border-color .28s var(--ui-ease),box-shadow .28s var(--ui-ease),transform .28s var(--ui-ease)}
.brand:hover .brand-sigil{border-color:rgba(89,232,239,.9);box-shadow:0 0 0 5px rgba(89,232,239,.045)}
.brand:hover .brand-sigil:before{transform:scale(.88)}
.nav a{transition:color .22s ease}
.header-cta,.menu-btn{border-radius:9px;transition:background .22s ease,border-color .22s ease,transform .22s var(--ui-ease)}
.header-cta:hover{border-color:rgba(255,255,255,.26);background:rgba(255,255,255,.045);transform:translateY(-1px)}
.menu-btn:hover{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.23)}

/* Common controls */
.btn{
  min-height:54px;
  border-radius:10px;
  transition:transform .24s var(--ui-ease),background .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{box-shadow:0 10px 28px rgba(89,232,239,.09)}
.btn-primary:hover{box-shadow:0 16px 38px rgba(89,232,239,.16)}
.text-link{transition:color .22s ease,transform .22s var(--ui-ease)}
.text-link:hover{color:#fff;transform:translateX(3px)}

/* Improve reading rhythm across the site */
p{max-width:72ch}
.eyebrow{font-size:10px;line-height:1.3}
.hero-sub,.mode-copy>p,.manifesto-copy,.world-copy>p:not(.eyebrow),.chronicle-copy>p:not(.eyebrow),.product-copy>p:not(.eyebrow),.launch-copy>p:not(.eyebrow){line-height:1.62}

/* Physical cards: movement and depth */
.deck-card,.m-card,.featured-card,.rail-card,.catalog-card,.related-card,.choice-card,.detail-card,.dialog-card,.book-object{
  will-change:transform;
}
.deck-card img,.m-card img,.featured-card img,.rail-card img,.catalog-card-media img,.related-card img,.choice-card img,.detail-card img,.dialog-card img{
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}

@media(hover:hover) and (pointer:fine){
  .catalog-card{
    transition:transform .32s var(--ui-ease),border-color .26s ease,box-shadow .32s var(--ui-ease),background .26s ease;
  }
  .catalog-card:hover{
    transform:translateY(-6px);
    box-shadow:var(--ui-shadow-hover);
  }
  .catalog-card-media img{transition:transform .5s var(--ui-ease),filter .4s ease}
  .catalog-card:hover .catalog-card-media img{transform:scale(1.018);filter:saturate(1.05) contrast(1.02)}
  .related-card{transition:transform .3s var(--ui-ease),border-color .25s ease}
  .related-card:hover{transform:translateY(-5px)}
  .rail-card{transition:transform .28s var(--ui-ease),opacity .25s ease,filter .25s ease}
  .rail-card:hover{transform:translateY(-7px) scale(1.02)}
  .featured-volume .book-object,.book-stage .book-object{transition:transform .55s var(--ui-ease),filter .45s ease}
  .featured-volume:hover .book-object{transform:translateY(-7px) rotateY(-2deg);filter:drop-shadow(0 34px 46px rgba(0,0,0,.5))}
}

/* Catalog consistency */
.catalog-card,.related-card,.advanced-popover,.card-dialog{border-radius:var(--ui-radius-lg)}
.catalog-card-media{overflow:hidden}
.catalog-search input,.catalog-sort select,.mobile-filter-toggle,.filter-tabs button,.faction-tabs button,.star-tabs button,.stat-filter-grid button{
  border-radius:9px;
}
.catalog-card-info{padding-bottom:max(18px,1.2vw)}
.catalog-card-meta,.catalog-card-stats{font-size:max(10px,.7vw)}

/* World page — less HUD, more editorial depth */
.world-page .btn,.chronicles-page .btn,.cards-page .btn{border-radius:10px}
.world-page [class*="card"],.world-page [class*="tile"]{transition:border-color .25s ease,background .25s ease,transform .28s var(--ui-ease)}
@media(hover:hover) and (pointer:fine){
  .world-page [class*="protocol"]:hover,.world-page [class*="archive-link"]:hover{transform:translateY(-2px)}
}

/* Chronicles: preserve literary character but align UI */
.chron-hero-actions .btn,.volume-actions .btn,.book-back,.reader-back,.reader-end-actions a{border-radius:10px}
.featured-volume,.chron-archive,.library-intro{isolation:isolate}
.chron-text-link,.volume-continue{transition:color .22s ease,transform .22s var(--ui-ease)}
.chron-text-link:hover,.volume-continue:hover{transform:translateX(3px)}

/* Rules V7/V8 — make the helper feel like the same product */
.rules-v5-page .site-header{border-radius:12px}
.rv5-mode-card{border-radius:24px!important;transition:transform .3s var(--ui-ease),border-color .25s ease,box-shadow .3s var(--ui-ease),background .25s ease!important}
.rv5-mode-copy h2{text-wrap:balance}
.rv5-mode-copy p{font-size:14px!important;line-height:1.58!important}
.rv5-mode-copy>span{font-size:12px!important}
.rv5-step-title{text-wrap:balance}
.rv5-step-subtitle{max-width:46ch}
.rv5-rule-list li{font-size:14px!important;line-height:1.52!important}
.rv5-step-visual{box-shadow:0 26px 76px rgba(0,0,0,.26)}
.rv5-controls button{border-radius:11px!important}
.rv5-step-dots button{transition:transform .22s var(--ui-ease),background .22s ease,border-color .22s ease,color .22s ease}
.rv5-step-dots button:hover{transform:translateY(-2px)}
.rv5-battle figure img{transition:transform .32s var(--ui-ease),box-shadow .32s ease}
@media(hover:hover) and (pointer:fine){
  .rv5-battle figure:hover img{transform:translateY(-5px) rotate(var(--card-tilt,0deg));box-shadow:0 34px 52px rgba(0,0,0,.52)}
  .rv5-battle figure:first-child{--card-tilt:-1.2deg}
  .rv5-battle figure:last-child{--card-tilt:1.2deg}
}

/* Footer */
.footer,.cards-footer,.world-footer,.rv5-footer{border-top-color:rgba(255,255,255,.075)}
.footer nav a,.rv5-footer a{transition:color .2s ease}
.footer nav a:hover,.rv5-footer a:hover{color:#fff}

/* Medium screens */
@media(max-width:1180px){
  .nav{gap:24px}
  .site-header{left:14px;right:14px}
}

/* Mobile refinement */
@media(max-width:760px){
  html{scroll-padding-top:78px}
  .site-header{left:10px;right:10px;top:8px;border-radius:11px}
  .nav{border-radius:12px;box-shadow:0 22px 55px rgba(0,0,0,.5)}
  .eyebrow{font-size:9px}
  .btn{min-height:52px;font-size:10px}
  .header-cta{display:none}
  .catalog-card-meta,.catalog-card-stats{font-size:10px}
  .catalog-card{border-radius:15px}
  .rv5-choice-head>p:last-child{font-size:15px!important}
  .rv5-mode-card{border-radius:18px!important}
  .rv5-mode-copy{padding:25px 20px 22px!important}
  .rv5-mode-copy h2{font-size:clamp(28px,8.5vw,38px)!important;line-height:.96!important}
  .rv5-mode-copy p{font-size:13px!important}
  .rv5-choice-foot{font-size:11px!important;line-height:1.45!important}
  .rv5-guide-bar{position:sticky;top:74px;z-index:25;background:rgba(8,10,11,.9);backdrop-filter:blur(16px);border-radius:10px;padding:10px 8px!important;margin-bottom:8px!important}
  .rv5-step-title{font-size:clamp(34px,10vw,48px)!important}
  .rv5-rule-list li{font-size:13px!important;padding-top:13px!important;padding-bottom:13px!important}
  .rv5-controls{position:sticky;bottom:8px;z-index:30;padding:8px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:14px;background:rgba(11,14,15,.92);backdrop-filter:blur(18px);box-shadow:0 16px 45px rgba(0,0,0,.48)}
  .rv5-controls button{min-height:48px!important}
  .rv5-guide-shell{padding-bottom:8px}
}

@media(max-width:430px){
  .site-header{height:58px!important}
  .brand-word b{letter-spacing:.13em}
  .rv5-choice{padding-top:82px!important}
  .rv5-choice-head{margin-bottom:20px!important}
  .rv5-choice-head h1{font-size:clamp(38px,11.5vw,50px)!important}
  .rv5-mode-grid{gap:12px!important}
  .rv5-mode-art{min-height:166px!important}
  .rv5-mode-copy{padding:21px 18px 18px!important}
  .rv5-mode-copy small{font-size:9px!important}
  .rv5-mode-copy h2{margin:10px 0 9px!important}
  .rv5-mode-copy>span{padding-top:14px!important}
  .rv5-choice-foot{margin-top:12px!important;padding:11px 12px!important}
  .rv5-guide{padding-top:76px!important}
  .rv5-step-dots{gap:7px!important}
  .rv5-step-dots button{width:31px!important;height:31px!important}
  .rv5-step-visual{padding:12px!important;border-radius:18px!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}