/* Preview114. Scoped presentation only, no service or mastery asset changes. */
:root { --kr114-forest: url('world.png'); --kr114-city: url('allies-orgrimmar115.jpg'); --kr114-ease: cubic-bezier(.22,.61,.36,1); }
html { scroll-behavior:smooth; scroll-padding-top:110px; }
body[data-kr-cinema] { background:linear-gradient(180deg,#06121aca,#07131be6 55%,#061018f0),var(--kr114-forest) center top/cover fixed!important; }
body[data-kr-cinema]>.page-bg { background:linear-gradient(#06121aca,#07131be6),var(--kr114-forest) center top/cover!important; }
body[data-kr-cinema] :is(main,section,article,header,footer,.container,.row,.kc-grid,.kc-card,.kcui-container,.main-container,.profile26-layout) { min-width:0; }
body[data-kr-cinema] :is(h1,h2,h3,p,a,button,label,td,th) { overflow-wrap:break-word; }
body[data-kr-cinema] :is(button,a,input,select,textarea) { scroll-margin-block:115px; }
body[data-kr-cinema] :is(button,a,.kc-card,.browser-card) { transition-timing-function:var(--kr114-ease); }
body[data-kr-cinema] :is(button,a) { transition-duration:260ms; }
body[data-kr-cinema] table { max-width:100%; }
body[data-kr-cinema] .table-responsive { max-width:100%; overflow:auto; overscroll-behavior-inline:contain; }
/* The shared header occupies normal flow; no second compensating 134px gap. */
body[data-kr-cinema]:not(.cinema103-home) main#kr-cinema-main { padding-top:40px!important; padding-bottom:72px!important; }
body[data-kr-cinema]>.navbar .header-shell { width:min(1280px,calc(100% - 48px)); }
body[data-kr-cinema]>.navbar .header-nav-row { flex-wrap:wrap!important; gap:4px 24px; }
body[data-kr-cinema]>.navbar .kr109-nav-link { display:inline-flex; align-items:center; min-height:44px; padding:8px 0; }
body[data-kr-cinema]>.navbar .header-brand-logo { width:158px; height:auto; }
body[data-kr-cinema] .kc-card :is(p,li) { line-height:1.75; }
/* Atmospheric sections fade into one canvas instead of opaque rectangles. */
body.cinema103-home :is(.masteries,.progression,.adventure) { background:transparent; backdrop-filter:none; isolation:isolate; position:relative; }
body.cinema103-home :is(.masteries,.adventure)::before { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at center,#07131bec 15%,#07131bd6 62%,#07131b00 100%); }
body.cinema103-home .section-shell { max-width:1280px; }
body.cinema103-home .section-heading { align-items:start; gap:32px; }
body.cinema103-home .section-heading>p { font-size:14px; line-height:1.8; max-width:330px; padding-top:28px; }
body.cinema103-home .hero-landscape { background-image:linear-gradient(90deg,#07141dec,#10252abb 45%,#07212d33),var(--kr114-forest); }
body.cinema103-home .hero::after { content:''; position:absolute; bottom:0; left:0; right:0; height:70px; pointer-events:none; background:linear-gradient(transparent,#07131b); }
body.cinema103-home .hero-bottom { z-index:1; }
/* Three equal flexible stages. Neither long caption nor connector sets grid width. */
body.cinema103-home .progression { grid-template-columns:minmax(0,1fr) minmax(0,1.12fr); gap:clamp(32px,5vw,72px); padding:76px 0 84px; }
body.cinema103-home .progression-copy h2 { font-size:clamp(32px,3.3vw,44px); line-height:1.2; }
body.cinema103-home .progression-copy>p:not(.eyebrow) { max-width:430px; font-size:14px; line-height:1.85; }
body.cinema103-home .progression-path { min-width:0; padding:30px 28px 26px; border:1px solid #d8ca9f2e; border-radius:5px; background:linear-gradient(135deg,#0c2029dd,#07131be6); box-shadow:0 16px 48px #0002; }
body.cinema103-home .progression-path>small { display:block; font-size:10px; letter-spacing:.12em; line-height:1.6; }
body.cinema103-home .level-track { display:grid; grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr) 24px minmax(0,1fr); gap:10px; margin:24px 0; align-items:start; }
body.cinema103-home .level-track>div { min-width:0; }
body.cinema103-home .level-track b { font-size:clamp(42px,4.2vw,60px); line-height:1.1; letter-spacing:-.04em; }
body.cinema103-home .level-track span { white-space:normal; font-size:11px; line-height:1.5; color:#bfd0d7; margin-top:10px; }
body.cinema103-home .level-track i { width:100%; margin:28px 0 0; }
body.cinema103-home .progression-path>p { font-size:11px; line-height:1.8; color:#a8bec8; max-width:none; }
body.cinema103-home .craft-note { padding:36px; gap:24px; display:grid; grid-template-columns:auto minmax(0,1fr) minmax(0,.9fr) auto; background:linear-gradient(90deg,#06131bf7,#081922ed 55%,#08192299),var(--kr114-city) center 48%/cover; }
body.cinema103-home .craft-note>p { font-size:13px; line-height:1.8; margin:0; max-width:none; }
body.cinema103-home .craft-note>a { margin:0; }
body.cinema103-home .browser-card { min-width:0; padding:34px; background-image:linear-gradient(125deg,#07131be8,#07131bd9),var(--kr114-city); }
body.cinema103-home .browser-card.last-stand { background-image:linear-gradient(125deg,#07131be8,#07131bd9),var(--kr114-forest); }
body.cinema103-home .browser-card h3 { font-size:clamp(28px,3vw,38px); line-height:1.18; }
body.cinema103-home .browser-card>p:not(.eyebrow) { font-size:14px; line-height:1.85; }
body.cinema103-home .browser-card .button { margin-top:auto; }
body.cinema103-home .kr-cinema-news { padding-block:48px; }
body.cinema103-home .class-stage { min-width:0; }
body.cinema103-home .class-art { /* Source untouched: all mastery illustrations retained. */ transition:opacity 480ms var(--kr114-ease); }
body.cinema103-home :is(#race-art,.hero-portrait img,.dungeon-stage>img) { transition:opacity 480ms var(--kr114-ease); }
.kr114-enter { animation:kr114-arrive 500ms var(--kr114-ease) both; }
@keyframes kr114-arrive { from { opacity:.25; transform:translateY(5px); } to { opacity:1; transform:none; } }
@media (max-width:1260px) {
 body.cinema103-home .header nav { display:none; position:absolute; top:100%; left:0; right:0; padding:20px 24px; background:#0a1922fa; border-bottom:1px solid #d8ca9f3d; }
 body.cinema103-home .header nav.open { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 20px; }
 body.cinema103-home .header nav :is(a,button) { padding:12px 8px; min-height:44px; text-align:left; }
 body.cinema103-home .menu-toggle { display:flex; flex-direction:column; justify-content:center; gap:5px; width:42px; height:44px; background:none; padding:8px; }
 body.cinema103-home .menu-toggle>span { display:block; height:1px; background:#d0c5a3; width:24px; }
 body.cinema103-home .header-actions { margin-left:auto; gap:18px; }
 body.cinema103-home .header-inner { gap:20px; }
 body.cinema103-home .craft-note { grid-template-columns:auto minmax(0,1fr) minmax(0,1fr); }
 body.cinema103-home .craft-note>a { grid-column:2/-1; }
}
@media (max-width:940px) {
 body.cinema103-home .progression { grid-template-columns:minmax(0,1fr); gap:30px; }
 body.cinema103-home .progression-copy>p:not(.eyebrow) { max-width:620px; }
 body.cinema103-home .level-track b { font-size:52px; }
 body.cinema103-home .craft-note { grid-template-columns:auto minmax(0,1fr); }
 body.cinema103-home .craft-note>p,body.cinema103-home .craft-note>a { grid-column:2; }
 body.cinema103-home .browser-card { padding:26px; }
}
@media (max-width:700px) {
 html { scroll-padding-top:88px; }
 body[data-kr-cinema],body[data-kr-cinema]>.page-bg { background-attachment:scroll!important; }
 body.cinema103-home .header-inner { width:calc(100% - 32px); gap:12px; }
 body.cinema103-home .header-actions { gap:9px; }
 body.cinema103-home .brand>span { display:none; }
 body.cinema103-home .brand img { width:120px; }
 body.cinema103-home .header-actions .button-small { padding:9px 12px; font-size:10px; }
 body.cinema103-home .header-actions .button-small>span { display:none; }
 body.cinema103-home .motion-label { display:none; }
 body.cinema103-home .hero-copy { width:100%; }
 body.cinema103-home .section-heading { display:block; }
 body.cinema103-home .section-heading>p { font-size:13px; max-width:none; padding-top:18px; }
 body.cinema103-home .progression { padding:45px 0; }
 body.cinema103-home .progression-path { padding:25px 18px; }
 body.cinema103-home .level-track { gap:7px; grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr); }
 body.cinema103-home .level-track b { font-size:44px; }
 body.cinema103-home .level-track span { font-size:10px; }
 body.cinema103-home .craft-note { padding:25px 20px; gap:18px; }
 body.cinema103-home .craft-note>p { font-size:12px; }
 body.cinema103-home .browser-cards { grid-template-columns:minmax(0,1fr); }
 body.cinema103-home .browser-card { padding:27px 23px; }
 body[data-kr-cinema]:not(.cinema103-home) main#kr-cinema-main { padding-top:25px!important; }
 body[data-kr-cinema]>.navbar .header-shell { width:calc(100% - 32px); }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto!important; } body[data-kr-cinema] *,body[data-kr-cinema] *::before,body[data-kr-cinema] *::after { animation:none!important; transition:none!important; } }
body[data-motion=off] .kr114-enter { animation:none!important; }
body[data-kr-cinema]:not(.cinema103-home)>.navbar{position:sticky!important;top:0!important;left:auto!important;right:auto!important;width:100%;z-index:50}
.kr114-menu-toggle{display:none;align-items:center;gap:8px;border:1px solid #cfb47155;background:#102630;color:#efdaa8;padding:10px 14px;border-radius:4px;font:600 12px Manrope,Arial,sans-serif;min-height:44px}
@media(max-width:1179px){body[data-kr-cinema]>.navbar .kr114-menu-toggle{display:inline-flex}body[data-kr-cinema]>.navbar.kr114-nav-open .header-primary-nav{display:block!important}body[data-kr-cinema]>.navbar.kr114-nav-open .header-nav-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));padding:12px 0}}
body[data-kr-cinema] .header-dropdown-layer {max-height:calc(100dvh - 90px);overflow-y:auto;overscroll-behavior:contain;background:#0b1a24f7;backdrop-filter:blur(18px)}
body[data-kr-cinema] .header-dropdown-panel a {font-family:Manrope,'Segoe UI',sans-serif!important;font-size:13px!important;letter-spacing:0!important;line-height:1.6;white-space:normal}
body[data-kr-cinema] :is(.kc-actions,.kcui-actions,.vp-actions){flex-wrap:wrap;gap:12px}
body[data-kr-cinema] :is(input[type=text],input[type=email],input[type=password],input[type=search],select,textarea){max-width:100%;min-width:0}
body[data-kr-cinema].cinema103-home{background:linear-gradient(180deg,#06121ac9,#07131be2 60%,#061018ed),var(--kr114-forest) center top/cover fixed!important}
body[data-kr-cinema].cinema103-home .header .brand img{width:156px!important;height:auto!important;max-width:156px}
body[data-kr-cinema].cinema103-home .header .brand{flex:none;min-width:0;width:auto!important}
body[data-kr-cinema].cinema103-home .header nav{gap:20px;min-width:0}
@media(max-width:1440px){body[data-kr-cinema].cinema103-home .header .brand>span{display:none}}
@media(max-width:700px){body[data-kr-cinema].cinema103-home{background-attachment:scroll!important}body[data-kr-cinema].cinema103-home .header .brand img{width:116px!important;max-width:116px}}
body[data-kr-cinema] .seo-check-list{grid-template-columns:minmax(0,1fr)}
body[data-kr-cinema] .seo-check-list>li{min-width:0;overflow-wrap:anywhere}
@media(max-width:420px){body[data-kr-cinema]>.navbar .header-brand-logo{width:clamp(108px,32vw,148px)!important;max-width:148px}}