/* ODELIA · daylight porcelain / Iniden violet */
:root{--paper:#f6f8f8;--surface:#fff;--ink:#213d47;--muted:#61767c;--gold:#44817d;--line:#dce6e7;--navy:#224e57;--soft:#edf3f3;--shadow:0 10px 35px #1d485c08;--radius:18px}
body.dark{--paper:#111322;--surface:#1a1d31;--ink:#eeedf8;--muted:#a7abc4;--gold:#b5a1ef;--line:#30334c;--soft:#22253c;--navy:#51417a;--shadow:0 12px 38px #07091250;color-scheme:dark}
body{transition:background-color .75s,color .55s;overflow-x:clip}button,a{touch-action:manipulation}body>header{height:92px;max-width:1440px;padding:0 5%;gap:18px}.brand{font-size:25px;letter-spacing:5px;gap:15px}.brand small{font-size:9px;letter-spacing:3px}.brand .crest{font-size:40px;color:#8c977d;text-shadow:0 2px 1px #fff,0 4px 9px #4a77792e;transform:rotate(-8deg)}body.dark .brand .crest{color:#c6b5f3;text-shadow:0 0 22px #a38aff70}.header-note{font:9px var(--sans);letter-spacing:2.5px}.icon-button{background:var(--surface)}#theme{width:auto;min-width:98px;height:40px;border-radius:30px;display:flex;gap:9px;padding:5px 15px;font:10px var(--sans);letter-spacing:1px;border-color:var(--line);box-shadow:0 2px 5px #153d4310}#theme .theme-orbit{display:grid;place-items:center;width:24px;height:24px;font-size:18px;border-radius:50%;background:radial-gradient(circle at 32% 25%,#fff,#e2c281);color:#8c661e;box-shadow:inset -2px -2px 5px #91662433,0 3px 6px #ad945332;transition:transform .9s,background .7s}body.dark #theme .theme-orbit{background:radial-gradient(circle at 32% 25%,#ddd0ff,#7663b1);color:#fff;box-shadow:0 0 15px #9d77ff50;transform:rotate(-20deg)}.bgm-play{height:40px;border-radius:30px;border-color:var(--line);background:var(--surface);padding:8px 15px}.bgm-panel{border-radius:20px;border-color:var(--line);box-shadow:0 20px 70px #0e163232}.bgm-track{border-radius:8px}.bgm-main{background:var(--navy)}
.hero{height:650px;min-height:590px;max-height:none;background:#7b9fba!important;border:0;text-align:left;isolation:isolate;--scene-x:0px;--scene-y:0px}.hero-scenes,.scene-layer,.hero-shade,.scene-motes{position:absolute;inset:0}.hero-scenes{z-index:-3;overflow:hidden;transform:translate(var(--scene-x),var(--scene-y)) scale(1.025);transition:transform 1s ease-out}.scene-layer{background-size:cover;background-position:center 52%;transition:opacity 1.6s ease,transform 2s cubic-bezier(.2,.65,.2,1),filter 1.7s ease;will-change:opacity,transform}.scene-day{background-image:url('assets/odelia-day.webp');opacity:1;transform:scale(1);filter:blur(0)}.scene-night{background-image:url('assets/odelia-night.webp');opacity:0;transform:scale(1.045);filter:blur(5px)}body.dark .scene-day{opacity:0;transform:scale(1.045);filter:blur(5px)}body.dark .scene-night{opacity:1;transform:scale(1);filter:blur(0)}.hero .hero-shade{z-index:-1;background:linear-gradient(90deg,#0c30465c,transparent 72%),linear-gradient(0deg,#102a3bd9,transparent 82%);transition:background 1.5s}.dark .hero .hero-shade{background:linear-gradient(90deg,#10152c75,transparent 72%),linear-gradient(0deg,#11152bd9,transparent 83%)}.hero-topline,.hero-content,.hero-bottom{max-width:1280px;margin:auto;width:90%;position:relative;color:#fff}.hero-topline{padding-top:30px;display:flex;justify-content:space-between;align-items:center;font:9px var(--sans);letter-spacing:2.5px;color:#effbffcc}.hero-topline>span:first-child{display:flex;gap:11px;align-items:center}.hero-topline i{width:5px;height:5px;background:#d4ecbd;border-radius:50%;box-shadow:0 0 12px #d3f7be}.hero .hero-content{padding-top:145px;text-shadow:0 2px 18px #101f2c35}.hero .eyebrow{font:9px var(--sans);letter-spacing:3px;color:#e3f2ee;margin-bottom:15px}.hero h1{font:500 clamp(56px,5.8vw,88px)/1.25 var(--serif);letter-spacing:.08em;padding:0;margin:0 0 20px}.hero h1>span{display:block;font:12px Georgia,serif;letter-spacing:9px;margin:15px 0 0 4px;color:#e9efeab5}.hero-sub{font:400 17px/1.85 var(--sans);letter-spacing:.5px;margin-top:28px;color:#f4f5f5}.hero-actions{display:flex;align-items:center;gap:26px;margin-top:27px;font:12px var(--sans)}.hero-primary{display:flex;align-items:center;gap:32px;padding:15px 22px;background:#f3faf8;color:#24464b;border:1px solid #ffffffb0;border-radius:10px;box-shadow:0 7px 20px #071c3626;transition:transform .2s,background .3s}.hero-primary:hover{transform:translateY(-3px);background:white}.hero-secondary{display:flex;align-items:center;gap:20px;padding:12px 0;border-bottom:1px solid #ffffff60;color:#fff}.hero-primary span,.hero-secondary span{font-size:18px}.dark .hero-primary{background:#dcd2ff;color:#292445;border-color:#e2d9ff}.hero-bottom{position:absolute;bottom:27px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:end}.hero-date{margin:0;font-size:9px;letter-spacing:2px;color:#e9f1f1bd}.scene-caption{display:flex;align-items:center;gap:15px;padding:13px 20px;border:1px solid #ffffff25;border-radius:14px;background:#10283f36;backdrop-filter:blur(14px);box-shadow:0 8px 30px #061a2422}.scene-caption small{display:block;font:8px var(--sans);letter-spacing:2px;color:#e1e7f5b0}.scene-caption strong{display:block;font:400 12px var(--sans);margin-top:6px}.scene-live{font:8px var(--sans);letter-spacing:1px;color:#d9f1e7;border-left:1px solid #ffffff30;padding-left:16px;margin-left:8px}.scene-orb{display:block;width:31px;height:31px;flex-shrink:0;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff9cf 0%,#baceaf 35%,#549288 65%,#183e5b);box-shadow:inset -3px -3px 5px #17384970,0 0 22px #b4d1b02e;transition:box-shadow 1.5s,background 1.5s}.dark .scene-orb{background:radial-gradient(circle at 30% 25%,#fff5ff,#c0a1ff 30%,#8650d4 60%,#282451);box-shadow:inset -4px -4px 9px #251c53,0 0 24px #bb83ffa0}.scene-motes{pointer-events:none;opacity:0;z-index:-1;transition:opacity 2s}.dark .scene-motes{opacity:1}.scene-motes i{position:absolute;background:#ebd9ff;width:3px;height:3px;border-radius:100%;box-shadow:0 0 10px #c68bff;animation:drift 9s ease-in-out infinite alternate}.scene-motes i:nth-child(1){left:65%;top:24%}.scene-motes i:nth-child(2){left:72%;top:42%;animation-delay:-3s}.scene-motes i:nth-child(3){left:81%;top:18%;animation-delay:-6s}.scene-motes i:nth-child(4){left:59%;top:52%;animation-delay:-1s}.scene-motes i:nth-child(5){left:90%;top:36%;animation-delay:-5s}.scene-motes i:nth-child(6){left:45%;top:68%;animation-delay:-4s}@keyframes drift{to{transform:translate(9px,-18px);opacity:.2}}
nav[aria-label="주요 메뉴"]{height:76px;gap:16px;border:0;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(18px);box-shadow:0 4px 24px #172b3b04;align-items:center}nav[aria-label="주요 메뉴"] a{height:44px;min-width:132px;justify-content:center;border:0;border-radius:10px;gap:10px;padding:0 20px;font-size:13px;transition:background .25s,color .25s}nav[aria-label="주요 메뉴"] a.active{background:var(--soft);color:var(--ink)}nav[aria-label="주요 메뉴"] a:hover{background:var(--soft)}nav[aria-label="주요 메뉴"] a span{color:var(--gold);font-size:20px}
main{max-width:1280px;padding:0 5% 90px}.section-heading{margin:64px 0 48px}.section-heading h2{font-size:32px;letter-spacing:-1.3px}.section-heading>p:last-child{font-size:14px}.section-heading:after{display:none}.section-heading .eyebrow{font:9px var(--sans);letter-spacing:2.5px}.world-intro{gap:65px;margin-bottom:48px}.world-intro-copy h3{font-size:32px;line-height:1.65}.world-intro-copy p{font-size:14px}.world-portrait{border:0;padding:0;box-shadow:var(--shadow);border-radius:var(--radius);overflow:hidden;background:var(--surface)}.world-portrait:before,.world-portrait:after{display:none}.world-portrait img{height:440px;width:100%;object-fit:cover}.world-portrait figcaption{padding:17px 22px}.world-summary{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:25px}.world-summary strong{font-family:var(--sans);font-weight:500;color:var(--ink)}.world-summary span{font-size:11px;color:var(--muted)}.world-contents{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);padding:28px 30px;box-shadow:var(--shadow)}.world-toc a{border-radius:7px;padding:8px 10px;transition:background .2s}.world-toc a:hover{background:var(--soft)}.world-toc b{color:var(--gold)}.world-chapter{gap:55px;padding:58px 0}.chapter-heading>span{font:300 48px var(--sans);color:var(--gold);opacity:.55}.chapter-heading h3{font:600 23px var(--serif)}.chapter-heading p{font:9px/1.7 var(--sans);letter-spacing:1px}.chapter-body>h4{font-size:25px;line-height:1.7}.chapter-body p{font-size:14px;line-height:2.05}.house-grid{gap:24px}.house-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:0 0 18px;overflow:hidden;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}.house-card:hover{transform:translateY(-4px);box-shadow:0 15px 35px #20385312}.house-card .art-slot{border:0;margin:0;border-radius:0}.house-card h5,.house-card p,.house-card .house-tag{margin-left:20px;margin-right:20px}.house-card h5{margin-top:18px}.house-card p{font-size:12px}.house-tag{display:inline-block;background:var(--soft);padding:3px 9px;border-radius:6px}.world-details{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:0 18px;margin-top:20px}.world-details summary{padding:18px 0}.art-slot,.academy-slot{border-radius:12px;overflow:hidden}.power-definition{border-radius:16px;background:var(--navy);color:white;border:none}.power-pair article{background:var(--surface);border-radius:16px;border:1px solid var(--line)}.world-callout,.place-panel,.travel-ticket,.odello-card{border-radius:14px}.world-callout{background:var(--soft)}.griffon-art{border-radius:16px;overflow:hidden;border-color:var(--line)}.department-list article{padding:25px 0}.department-list article>span{border-radius:13px;background:var(--soft);font-size:26px}.rank-guide li{border-radius:9px}.world-float{border-radius:12px;overflow:hidden;box-shadow:var(--shadow);background:var(--surface)}.world-ending{border-top:1px solid var(--line);margin-top:25px}
.map-frame{border:1px solid var(--line);border-radius:18px;padding:8px;overflow:hidden;box-shadow:var(--shadow)}.map-frame>img{border-radius:12px}.region-panel{border-radius:18px;box-shadow:var(--shadow);padding:24px}.region-panel select{border-radius:9px}.region-art{border-radius:12px;overflow:hidden}.map-expand{border-radius:8px}.travel-note{background:var(--soft);border:0;padding:20px;border-radius:12px}.character-toolbar{border:0;gap:15px;background:var(--surface);border-radius:14px;padding:12px;border:1px solid var(--line)}.filter-tabs{gap:3px}.filter-tabs button{border-radius:9px;padding:8px 16px}.filter-tabs button.selected{background:var(--navy)}.search{border-radius:10px;background:var(--paper)}.character-grid{gap:24px}.character-card{border-radius:16px;border-color:var(--line);box-shadow:var(--shadow)}.character-card:hover{box-shadow:0 14px 30px #2b36591a}.card-copy{padding:20px}.card-copy small{font-size:10px}.card-copy h3{font-size:23px;margin:7px 0 14px}.card-copy p{font-size:11px;padding-top:13px}.rank-badge{border:1px solid #ffffff65;background:#243442c7;backdrop-filter:blur(8px);border-radius:9px;color:#fff}.history-aside{background:var(--soft);padding:24px;border-radius:18px;align-self:start}.timeline article{padding-bottom:36px}.timeline article:before{box-shadow:0 0 0 5px var(--soft)}.spoiler{border-radius:12px}.spoiler summary{color:#bd576b}dialog,#character-dialog,#character-image-dialog{border-radius:20px;border-color:var(--line);box-shadow:0 30px 100px #0b102466}dialog::backdrop{backdrop-filter:blur(7px);background:#10162480}.profile-power,.relation-card,.image-preview-card{border-radius:12px}.profile-toolbar{border-color:var(--line)}.pose-tabs button{border-radius:8px}.pose-tabs button[aria-pressed=true]{background:var(--navy);color:white}.relation-card:hover{transform:translateY(-1px)}footer{border-color:var(--line);max-width:none;padding-inline:max(5%,calc((100vw - 1150px)/2));background:var(--surface)}
@media(min-width:1600px){.hero{height:720px}.hero .hero-content{padding-top:185px}.hero-topline{padding-top:35px}.hero-bottom{bottom:35px}}
@media(max-width:1000px){.hero{height:620px}.hero .hero-content{padding-top:145px}.world-intro{gap:30px}.world-chapter{gap:30px}.header-note{font-size:8px;letter-spacing:1.5px}.scene-caption{padding:12px}.character-grid{gap:16px}.card-copy{padding:15px}.card-copy small{font-size:9px}}
@media(max-width:760px){body>header{height:76px;padding:0 5%;gap:9px}.brand{font-size:19px;letter-spacing:3px;gap:8px}.brand .crest{font-size:30px}.brand small{font-size:8px;letter-spacing:2px;margin-top:4px}.header-note{display:none}.bgm-widget{margin-left:auto}.bgm-play{padding:8px 11px;height:37px}.bgm-play>span:last-child{font-size:10px}#theme{min-width:0;width:38px;height:38px;padding:5px;border:1px solid var(--line)}#theme>span:last-child{display:none}#theme .theme-orbit{width:25px;height:25px}.hero{height:650px;min-height:0}.scene-layer{background-position:65% center}.hero-topline{padding-top:25px;font-size:7px;letter-spacing:1.8px}.hero-topline>span:last-child{display:none}.hero .hero-content{padding-top:235px;width:88%}.hero .eyebrow{font-size:7px;letter-spacing:1.7px}.hero h1{font-size:52px;letter-spacing:5px;margin-bottom:18px}.hero h1>span{font-size:10px;letter-spacing:6px;margin-top:12px}.hero-sub{font-size:14px;line-height:1.85;margin-top:19px}.hero-actions{gap:22px;margin-top:22px;font-size:11px}.hero-primary{padding:13px 17px;gap:21px}.hero-secondary{gap:12px}.hero .hero-shade{background:linear-gradient(0deg,#142c42ed 0%,#10283880 37%,transparent 80%)}.dark .hero .hero-shade{background:linear-gradient(0deg,#11152bf0 0%,#11152b80 37%,transparent 85%)}.hero-bottom{bottom:22px;left:6%;right:6%;width:88%}.hero-date{font-size:8px;letter-spacing:.8px}.hero-date i{width:13px}.scene-caption{padding:0;background:none;border:0;box-shadow:none;backdrop-filter:none;gap:8px}.scene-orb{width:20px;height:20px}.scene-caption small{display:none}.scene-caption strong{font-size:9px;margin:0;max-width:96px;line-height:1.7}.scene-live{display:none}nav[aria-label="주요 메뉴"]{height:65px;gap:3px;padding:0 10px}nav[aria-label="주요 메뉴"] a{min-width:0;flex:1;padding:0 5px;gap:6px;font-size:11px}nav[aria-label="주요 메뉴"] a span{font-size:17px}main{padding:0 6% 60px}.section-heading,.world-page .section-heading{margin:45px 0 32px}.section-heading h2,.world-page .section-heading h2{font-size:25px;line-height:1.6}.section-heading>p:last-child{font-size:12px}.world-intro-copy h3{font-size:25px}.world-intro-copy p{font-size:13px}.world-portrait img{height:310px}.world-summary{padding:20px 9px}.world-summary strong{font-size:22px}.world-summary span{font-size:8px}.world-contents{padding:22px 16px}.world-toc{gap:4px 7px}.world-toc a{padding:8px 4px}.world-chapter{padding:35px 0}.chapter-heading>span{font-size:36px}.chapter-heading h3{font-size:23px}.chapter-body>h4{font-size:21px}.chapter-body p{font-size:13px}.house-grid{gap:14px}.house-card h5,.house-card p,.house-card .house-tag{margin-left:13px;margin-right:13px}.house-card p{font-size:11px;line-height:1.9}.house-card h5{font-size:16px}.house-tag{font-size:8px}.world-details{padding:0 14px}.world-details summary{font-size:12px}.character-toolbar{flex-wrap:wrap;padding:9px}.filter-tabs{width:100%;justify-content:space-between}.filter-tabs button{padding:7px 10px;font-size:11px}.search{width:100%}.search input{width:100%}.character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 12px}.card-copy{padding:13px}.card-copy small{font-size:8px}.card-copy h3{font-size:20px}.card-copy p{font-size:9px}.result-line>span:last-child{font-size:8px}.history-aside{padding:20px}.travel-note{padding:17px;gap:12px}.bgm-panel{max-height:calc(100dvh - 92px);border-radius:16px}#character-dialog .full-bio{padding:22px}.relation-grid{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.scene-layer,.hero-scenes,body,.hero-shade,.scene-orb{transition:none!important}.scene-motes i{animation:none}.hero-scenes{transform:none}.scene-layer{filter:none!important}}
/* Preserve the floating city's crown on wide and narrow viewports. */
.scene-layer{background-position:center top}
@media(max-width:760px){.scene-layer{background-position:right top}}
.world-chapter{scroll-margin-top:90px}
@media(max-width:760px){.world-chapter{scroll-margin-top:78px}}
/* Decorative transforms must not create a focus-scrollable hero viewport. */
.hero{overflow:clip}
/* Atlas markers stay aligned with the image; Karnos has no invented region asset. */
#map-pins{position:absolute;inset:8px;pointer-events:none}
#map-pins .map-pin{pointer-events:auto}
.map-pin-danger{background:#173e35;border-color:#b9d99b;color:#e7ffbf;box-shadow:0 0 0 4px #6ba66f2e}
.map-pin-danger:hover,.map-pin-danger.selected{background:#b3d67e;color:#153524;border-color:#e7ffbf}
.region-art-karnos{height:180px;position:relative;background:#153329}
.region-art-karnos img{position:absolute;width:300%;max-width:none;height:auto;aspect-ratio:auto;left:-74%;top:-5%;object-fit:initial}