:root { --rpg-navy:#071b22; --rpg-deep:#041117; --rpg-jade:#8cae91; --rpg-gold:#e2bd72; --rpg-bronze:#9b713f; --rpg-paper:#eee1be; --rpg-ink:#26332e; }
.campaign-ui { font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; color:var(--rpg-paper); }
.campaign-ui * { box-sizing:border-box; }
.campaign-ui button,.campaign-ui select,.campaign-ui input,.campaign-ui textarea { font:inherit; }
.campaign-ui button { cursor:pointer; }
.campaign-ui button:focus-visible { outline:3px solid #f4d18e; outline-offset:4px; }
.campaign-ui button:disabled { cursor:default; opacity:.5; }
#campaignView { position:fixed; inset:0; z-index:35; background:var(--rpg-deep); overflow:auto; }
#campaignChrome { position:fixed; top:0; left:0; right:0; height:78px; z-index:46; padding:0 32px; display:flex; align-items:center; justify-content:space-between; gap:20px; background:linear-gradient(#071b22fa,#071b22eb); border-bottom:1px solid #b18b5055; }
.rpg-brand { display:flex; align-items:center; gap:12px; border:0; background:none; color:var(--rpg-paper); font-size:19px!important; letter-spacing:.15em; }
.rpg-brand b { font-size:30px; color:var(--rpg-gold); font-weight:normal; }
.rpg-micro { font:11px/1.5 'Courier New',monospace; letter-spacing:.15em; text-transform:uppercase; color:var(--rpg-jade); }
.rpg-nav { display:flex; gap:8px; align-items:center; }
.rpg-nav button { border:1px solid #a78a5255; background:#0b272a; color:var(--rpg-paper); padding:10px 13px; min-height:40px; font-size:14px; }
.rpg-wallet { font:13px 'Courier New',monospace; color:var(--rpg-gold); margin-right:12px; white-space:nowrap; }
.rpg-title { min-height:100vh; display:grid; place-items:center; text-align:center; padding:125px 24px 65px; position:relative; isolation:isolate; }
.rpg-title::before { content:''; position:absolute; inset:0; z-index:-2; background:url('../assets/rpg/worlds.png') center/cover; image-rendering:pixelated; }
.rpg-title::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(#04151d66,#04151d66 40%,#04151df0),radial-gradient(ellipse at 50% 40%,#10282b33,#03131b99); }
.rpg-title .title-ornament { width:108px; height:108px; margin:0 auto 22px; border:1px solid #d9ad66; outline:1px solid #d9ad6644; outline-offset:8px; transform:rotate(45deg); display:grid; place-items:center; background:#092328c9; box-shadow:0 0 70px #d6ae5744; }
.title-ornament span { transform:rotate(-45deg); color:var(--rpg-gold); font-size:58px; }
.rpg-title h1 { font-weight:normal; font-size:clamp(48px,7.3vw,106px); line-height:.95; letter-spacing:.11em; margin:24px 0; text-shadow:0 5px 0 #041318,0 0 45px #eac77b44; }
.rpg-title h1 small { font-size:.34em; display:block; letter-spacing:.55em; margin:16px 0 12px; color:var(--rpg-gold); }
.rpg-title .tagline { font-size:clamp(17px,2vw,24px); color:#e5dec8; line-height:1.5; max-width:610px; margin:22px auto 30px; }
.rpg-button { border:1px solid var(--rpg-bronze); background:#0d3033; color:var(--rpg-paper); padding:13px 21px; min-height:46px; font-size:16px; box-shadow:inset 0 0 0 3px #03191a55; transition:background .15s,transform .15s; }
.rpg-button:hover { background:#19413c; transform:translateY(-1px); }
.rpg-button.gold { background:#d6b375; color:#142c2a; border-color:#f5d394; font-weight:bold; box-shadow:inset 0 0 0 3px #91704440,0 5px 20px #0004; }
.rpg-button.quiet { background:transparent; box-shadow:none; border-color:#a78a5244; }
.rpg-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:center; }
.rpg-title-footer { position:absolute; bottom:25px; left:20px; right:20px; display:flex; justify-content:space-between; color:#aebdb4; font:10px 'Courier New',monospace; letter-spacing:.13em; text-transform:uppercase; }
.campaign-content { max-width:1400px; margin:auto; padding:112px 45px 55px; }
.campaign-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:30px; gap:25px; }
.campaign-heading h1 { font-size:48px; font-weight:normal; margin:8px 0 0; }
.campaign-heading p { color:#a8bdb1; font-size:17px; max-width:350px; line-height:1.5; }
.world-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.world-card { position:relative; isolation:isolate; display:flex; flex-direction:column; text-align:left; min-height:490px; overflow:hidden; border:1px solid #a98a5466; color:var(--rpg-paper); background:#0c292c; padding:28px; transition:transform .2s,border-color .2s; }
.world-card:hover { transform:translateY(-6px); border-color:var(--rpg-gold); }
.world-art { position:absolute; inset:0; z-index:-2; background-image:url('../assets/rpg/worlds.png'); background-size:300% 100%; image-rendering:pixelated; transition:transform .7s; }
.world-card:hover .world-art { transform:scale(1.04); }
.world-card::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(#03151b11 5%,#03151b00 35%,#03151bee 76%,#03151b); }
.world-card .seal { font-size:34px; color:var(--rpg-gold); border:1px solid #d6b37588; width:54px; height:54px; text-align:center; line-height:50px; background:#092126b0; }
.world-card .world-info { margin-top:auto; }
.world-card h2 { font-size:46px; font-weight:normal; margin:10px 0 4px; }
.world-card p { font-size:15px; color:#d2ddcb; line-height:1.5; margin:10px 0 18px; }
.world-card .enter { border-top:1px solid #b99c6044; padding-top:14px; display:flex; justify-content:space-between; font:12px 'Courier New',monospace; color:var(--rpg-gold); }
.world-footer { margin-top:25px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid #b29a4f33; padding-top:22px; color:#a3b8ac; font-size:15px; }
.world-detail { min-height:100vh; display:grid; grid-template-columns:40% 60%; }
.world-detail-art { background-image:linear-gradient(90deg,#03151b00,#03151b55),url('../assets/rpg/worlds.png'); background-size:cover,300% 100%; image-rendering:pixelated; min-height:600px; }
.world-detail-copy { padding:130px 6vw 55px 5vw; }
.world-detail h1 { font-size:70px; font-weight:normal; margin:12px 0; }
.world-detail p { line-height:1.65; color:#bacabd; font-size:18px; }
.timeline { margin:28px 0; border-top:1px solid #c5a46d55; display:grid; grid-template-columns:repeat(4,1fr); gap:20px 10px; padding-top:16px; }
.timeline div { position:relative; font:11px/1.5 'Courier New',monospace; color:#869d95; padding-top:8px; }
.timeline div::before { content:'◆'; position:absolute; top:-25px; color:#596f61; }
.timeline div:first-child { color:var(--rpg-gold); }.timeline div:first-child::before { color:var(--rpg-gold); }
.chapter-card { padding:24px; background:#103031; border:1px solid #b4935866; box-shadow:inset 0 0 0 5px #051c2244; }
.chapter-card h2 { font-size:30px; margin:10px 0; font-weight:normal; }
.chapter-card p { font-size:15px; }
#rpgScene { position:fixed; inset:78px 0 0; z-index:2; display:none; background:#071b22; overflow:hidden; }
#rpgCanvas { width:100%; height:100%; border-radius:0; image-rendering:pixelated; touch-action:none; outline:none; box-shadow:none; }
#rpgMarkers { position:absolute; inset:0; pointer-events:none; }
.rpg-marker { position:absolute; pointer-events:auto; transform:translate(-50%,-100%); min-width:30px; height:30px; border:1px solid #e1c27e; color:#ffe1a0; background:#082327eb; box-shadow:0 3px 0 #07161788,0 0 14px #e3bc6b44; font:16px 'Courier New',monospace; padding:3px 8px; border-radius:3px; }
.rpg-marker.discovery { background:#67542fe6; }.rpg-marker.done { opacity:.6; border-color:#9dbba1; color:#bdd6b5; }
.location-card { position:absolute; top:22px; left:26px; padding:16px 20px; background:#092329e8; border-left:3px solid var(--rpg-gold); box-shadow:0 6px 25px #0004; pointer-events:none; }
.location-card h2 { font-size:24px; font-weight:normal; margin:5px 0; }.location-card .rpg-micro { font-size:10px; }
.quest-tracker { position:absolute; top:126px; left:26px; background:#082127e6; border:1px solid #a2854855; width:255px; padding:15px 18px; pointer-events:auto; }
.quest-tracker h3 { font-size:17px; font-weight:normal; margin:7px 0 9px; }.quest-tracker p { font:11px/1.5 'Courier New',monospace; color:#bacbbe; margin:5px 0; }
.quest-tracker button { background:transparent; border:0; border-top:1px solid #8e794244; padding:10px 0 0; color:var(--rpg-gold); font:11px 'Courier New',monospace; width:100%; text-align:left; }
.rpg-map { position:absolute; bottom:48px; right:24px; width:184px; height:138px; border:2px solid #a88a53; background:url('../assets/rpg/shang-settlement.png') center/cover; image-rendering:pixelated; box-shadow:0 5px 20px #0008; }
.rpg-map .map-pin { position:absolute; width:7px; height:7px; background:#ffebaf; border:1px solid #082526; box-shadow:0 0 5px #ffeac3; }
.map-label { position:absolute; bottom:0; left:0; right:0; background:#071b22df; text-align:center; padding:4px; font:9px 'Courier New',monospace; color:var(--rpg-paper); letter-spacing:.1em; }
.rpg-controls { position:absolute; bottom:20px; left:26px; right:26px; display:flex; align-items:center; gap:14px; color:#f5e3bc; font:11px 'Courier New',monospace; text-shadow:0 1px 4px #000; }
.rpg-controls button { padding:10px 15px; background:#09262beb; color:var(--rpg-paper); border:1px solid #c0a36388; font:12px 'Courier New',monospace; }
#rpgPanel { display:none; position:fixed; inset:0; z-index:48; background:#031319c4; align-items:center; justify-content:center; padding:95px 24px 35px; backdrop-filter:blur(4px); }
.rpg-window { width:min(980px,100%); max-height:100%; overflow:auto; background:#0b262b; border:1px solid #bc965b; box-shadow:0 0 0 5px #04171ddd,0 25px 70px #0009; }
.rpg-window-head { padding:18px 25px; border-bottom:1px solid #ad8a4b55; display:flex; justify-content:space-between; align-items:center; gap:15px; background:#102e30; }
.rpg-window-head h2 { font-size:27px; font-weight:normal; margin:0; }
.rpg-close { width:36px; height:36px; background:none; border:1px solid #b08b4c66; color:var(--rpg-gold); font-size:24px!important; }
.rpg-window-body { padding:26px; }
.dialogue-layout { display:grid; grid-template-columns:200px 1fr; }
.dialogue-guide { border-right:1px solid #b18e5055; padding:25px 18px; background:#071f25; text-align:center; }
.portrait { width:150px; height:150px; margin:auto auto 10px; background-image:url('../assets/rpg/characters.png'); background-size:400% 400%; image-rendering:pixelated; }
.dialogue-guide h3 { font-size:21px; margin:10px 0 5px; font-weight:normal; }
.dialogue-text { font-size:18px; line-height:1.65; color:#e7dfc7; margin:0 0 18px; }
.source-layout { display:grid; grid-template-columns:170px 1fr; gap:22px; padding:18px; margin:0 0 22px; border:1px solid #a78c5266; background:#ede1c4; color:#24352d; }
.source-layout img { max-width:100%; max-height:200px; align-self:center; justify-self:center; image-rendering:auto; border:1px solid #9d8d69; }
.source-layout h3 { font-size:21px; margin:6px 0; font-weight:normal; }.source-layout .rpg-micro { font-size:9px; color:#70643e; }
.source-layout p { font-size:14px; line-height:1.55; margin:8px 0; }.source-layout details { font-size:11px; line-height:1.5; color:#6c654e; }
.rpg-question { font-size:21px; line-height:1.4; margin:10px 0 16px; }
.rpg-choices { display:flex; flex-direction:column; gap:9px; }.rpg-choice { background:#153638; color:#f0e5cb; border:1px solid #82927066; text-align:left; padding:12px 15px; font-size:16px; line-height:1.45; min-height:46px; }
.rpg-choice:hover { background:#214e46; }.rpg-choice.wrong { border-color:#ad6e58; background:#4a302c; }.rpg-choice.correct { border-color:#b2cd8a; background:#325346; }
#rpgFeedback { font-size:15px; line-height:1.55; padding:14px 0; color:#cfdbb0; }
.reward-strip { color:var(--rpg-gold); border-top:1px solid #a88a4b55; padding:16px 0 0; font:13px 'Courier New',monospace; }
.journal-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.quest-card { padding:20px; border:1px solid #a58b5355; background:#102f31; }.quest-card h3 { font-size:24px; margin:8px 0 12px; font-weight:normal; }.quest-card p { font-size:15px; line-height:1.5; margin:7px 0; color:#c2d0bb; }.quest-card .check { color:#a8c994; }.quest-card .rpg-button { margin-top:12px; font-size:13px; }.quest-card.notes { grid-column:1/-1; }
#rpgNotes { width:100%; background:#e9dfc3; color:#20342b; border:1px solid #ac935f; padding:12px; font-size:15px; line-height:1.5; min-height:90px; user-select:text; }
.inventory-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }.inventory-slot { text-align:center; background:#102f32; border:1px solid #a4894f77; padding:22px 12px; min-height:210px; }.inventory-slot.empty { opacity:.38; }.inventory-slot h3 { font-size:19px; font-weight:normal; margin:18px 0 10px; }.item-icon { width:70px; height:70px; margin:auto; color:var(--rpg-gold); }.item-icon svg { width:100%; height:100%; image-rendering:pixelated; }.item-icon img { max-width:100%; height:70px; object-fit:contain; }
.inventory-footer { display:flex; gap:14px; justify-content:space-between; margin-top:25px; padding-top:20px; border-top:1px solid #b28c4b55; flex-wrap:wrap; }
.rift-layout { display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:center; }.celestial-clock { width:310px; height:310px; position:relative; margin:10px auto; border:2px solid #af8953; border-radius:50%; background:radial-gradient(circle,#1b4849,#061d29 60%); box-shadow:0 0 0 8px #0b272c,0 0 0 9px #a0804c66,0 0 70px #77c0ac33; }
.clock-ring { position:absolute; inset:15px; border:1px dashed #b4a36999; border-radius:50%; animation:orbit 45s linear infinite; }.clock-ring.inner { inset:52px; border:2px solid #829d8877; animation-direction:reverse; animation-duration:30s; }.clock-ring.inner::after { content:'◆'; color:#f3d299; position:absolute; left:50%; top:-10px; }
.clock-core { position:absolute; inset:91px; border:1px solid #d9b87a; transform:rotate(45deg); display:grid; place-items:center; background:#103438; box-shadow:0 0 28px #d9b66a55; }.clock-core span { transform:rotate(-45deg); font-size:43px; color:#eac884; }
.clock-hand { position:absolute; width:2px; height:115px; left:50%; top:40px; background:linear-gradient(transparent,#e4bc72); transform-origin:bottom center; animation:orbit 14s linear infinite; }.clock-star { position:absolute; color:#ebcd87; font-size:15px; animation:twinkle 3s ease-in-out infinite alternate; }
.rift-copy h3 { font-size:30px; font-weight:normal; margin:10px 0; }.rift-copy p { font-size:17px; line-height:1.6; color:#c7d1be; }.rift-copy .rpg-button { width:100%; margin-top:20px; }
#rpgToast { display:none; position:fixed; z-index:55; bottom:48px; left:50%; transform:translateX(-50%); padding:15px 23px; background:#e2c58d; color:#17332c; border:2px solid #846638; box-shadow:0 6px 30px #0008; font:14px 'Courier New',monospace; max-width:90vw; }
.rpg-profile-form label { display:block; margin:14px 0 7px; color:#c2d1b6; }.rpg-profile-form input,.rpg-profile-form select { width:100%; min-height:46px; border:1px solid #ad9059; padding:10px; color:#26382e; background:#eee1c0; user-select:text; }.rpg-profile-form .rpg-actions { margin-top:20px; justify-content:flex-start; }
.rpg-ending { text-align:center; padding:12px 25px 20px; }.rpg-ending h3 { font-size:36px; font-weight:normal; margin:12px 0; }.rpg-ending p { font-size:18px; line-height:1.65; color:#cbd6c1; }.rpg-ending .item-icon { width:95px; height:95px; }
body.rpg-exploring #hud { display:none!important; } body.rpg-exploring #arcTitle { top:90px; } body.rpg-exploring #saveStatus { z-index:47; color:#9ebda8; background:#071b22ed; font-size:11px; }
body.rpg-exploring #saveStatus[data-saved="false"] { color:#fff; background:#9b2c24; }
#campaignReturn { margin-bottom:14px; } #campaignView .rpg-load { padding:22px; color:var(--rpg-gold); }
@keyframes orbit { to { transform:rotate(360deg); } } @keyframes twinkle { to { opacity:.35; } }
@media (max-width:900px) { #campaignChrome { padding:0 15px; height:66px; }.rpg-brand { font-size:14px!important; gap:6px; }.rpg-brand b { font-size:25px; }.rpg-nav { gap:5px; }.rpg-nav button { padding:8px; font-size:12px; }.rpg-wallet { font-size:11px; margin:0; }.campaign-content { padding:95px 22px 40px; }.campaign-heading h1 { font-size:38px; }.world-card { min-height:410px; padding:20px; }.world-card h2 { font-size:36px; }.world-detail { grid-template-columns:32% 68%; }.world-detail-copy { padding:100px 28px 35px; }.world-detail h1 { font-size:54px; }.rift-layout { gap:18px; }.celestial-clock { width:250px; height:250px; }.clock-core { inset:75px; }.clock-hand { top:25px; height:100px; }#rpgScene { top:66px; }.location-card { top:16px;left:16px; }.quest-tracker { left:16px;top:115px;width:220px; }.inventory-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { #campaignChrome { height:62px; padding:0 9px; gap:5px; }.rpg-brand { font-size:11px!important; letter-spacing:.04em; }.rpg-brand b { font-size:22px; }.rpg-wallet { display:none; }.rpg-nav button { font-size:11px; padding:7px; min-height:36px; }.rpg-nav .on-world { display:none; }.campaign-heading { display:block; }.campaign-heading p { max-width:100%; }.world-grid { grid-template-columns:1fr; gap:15px; }.world-card { min-height:330px; }.world-art { background-size:300% 150%; }.world-footer { align-items:start; flex-direction:column; }.rpg-title h1 { font-size:54px; }.rpg-title-footer { font-size:8px; }.rpg-title-footer span:last-child { display:none; }.world-detail { display:block; }.world-detail-art { height:260px; min-height:0; background-size:cover,300% auto; }.world-detail-copy { padding:28px 23px 45px; }.world-detail h1 { font-size:48px; }.timeline { gap:16px 10px; }.rpg-title .title-ornament { width:80px;height:80px; }.title-ornament span { font-size:40px; }#rpgScene { top:62px; }.location-card { padding:10px 12px; }.location-card h2 { font-size:20px; }.quest-tracker { top:auto;bottom:66px;left:12px;width:195px;padding:10px 13px; }.quest-tracker p { display:none; }.quest-tracker h3 { font-size:15px; }.rpg-map { width:100px;height:75px;right:12px;bottom:70px; }.rpg-controls { left:12px;bottom:25px;gap:7px; }.rpg-controls span { display:none; }#rpgPanel { padding:77px 12px 27px; }.rpg-window-head { padding:13px 16px; }.rpg-window-head h2 { font-size:23px; }.rpg-window-body { padding:18px; }.dialogue-layout { display:block; }.dialogue-guide { display:flex;align-items:center;justify-content:start;gap:13px;padding:5px 15px;border-right:0;border-bottom:1px solid #a7894d44; }.portrait { width:65px;height:65px;margin:0; }.dialogue-guide h3 { font-size:19px;margin:0; }.dialogue-guide .rpg-micro { font-size:8px; }.dialogue-text { font-size:16px; }.source-layout { grid-template-columns:90px 1fr;gap:12px;padding:12px; }.source-layout h3 { font-size:18px; }.source-layout p { font-size:12px; }.source-layout img { max-height:140px; }.rpg-question { font-size:18px; }.rpg-choice { font-size:14px; }.journal-grid { grid-template-columns:1fr; }.quest-card.notes { grid-column:auto; }.inventory-grid { gap:10px; }.inventory-slot { padding:15px 8px;min-height:180px; }.inventory-slot h3 { font-size:16px; }.rift-layout { display:block; }.celestial-clock { width:225px;height:225px; }.clock-core { inset:66px; }.clock-hand { height:91px;top:21px; }.rift-copy h3 { font-size:25px; }.rift-copy p { font-size:15px; }.rpg-ending { padding:0; } }
@media (prefers-reduced-motion:reduce) { .clock-ring,.clock-hand,.clock-star { animation:none; }.world-card,.world-art,.rpg-button { transition:none; } }
body.rpg-exploring #pauseScreen .card { background:#0b262b; border:1px solid #bc965b; color:#e9dfc1; border-radius:0; box-shadow:0 0 0 5px #04171ddd,0 25px 70px #0009; font-family:'Palatino Linotype',Palatino,serif; }
body.rpg-exploring #pauseScreen h1 { color:#e2bd72; font-weight:normal; }
body.rpg-exploring #pauseScreen .btn { border:1px solid #9b804c; background:#15383a; color:#e8ddbd; border-radius:0; font-size:16px; }
body.rpg-exploring #pauseScreen .btn.copper { background:#d6b375; color:#17352c; }
body.rpg-exploring #pauseScreen p { font-size:17px; line-height:1.6; }
body.rpg-exploring #arcReward { background:#0b262b; color:#e8dfc4; border:1px solid #c6a164; border-radius:0; box-shadow:0 0 0 5px #04171ddd,0 25px 70px #0009; }
body.rpg-exploring #arcReward .rwT,body.rpg-exploring #arcReward .rwTot { color:#e2bd72; font-family:'Palatino Linotype',Palatino,serif; }
body.rpg-exploring #arcReward .rwB { color:#b8cbb7; }
body.rpg-exploring #arcReward .rwL { border-color:#a1844d66; }
body.rpg-exploring #arcReward .arcbtn.go { background:#d6b375; color:#17372e; border:1px solid #efd092; border-radius:0; }
/* 0.3.2 direct navigation and Rift combat scenes */
.build-tag { font:10px 'Courier New',monospace; letter-spacing:0; color:var(--rpg-jade); }
#campaignChrome { padding-left:20px;padding-right:20px;gap:10px; }.rpg-nav { gap:5px; }.rpg-nav button { padding:9px; }.rpg-wallet { margin-right:4px; }
.rift-options { display:flex;flex-direction:column;gap:8px; }.rift-copy .rift-options .rpg-button { margin:0;font-size:14px;text-align:left; }
#rpgArena { position:fixed;left:0;right:0;bottom:25px;z-index:44;background:radial-gradient(ellipse at center,#173944,#06121e);display:flex;flex-direction:column;align-items:center;overflow:auto;padding:12px 18px; }
.trial-head { display:flex;align-items:center;justify-content:space-between;width:min(100%,1000px);gap:12px; }.trial-head h2 { font-weight:normal;font-size:25px;margin:4px 0; }.trial-head .rpg-button { font-size:13px;padding:8px;min-height:38px; }
#trialStatus { font:14px 'Courier New',monospace;color:#efd298;padding:8px;text-align:center;min-height:33px; }
.trial-field { width:min(100%,960px);position:relative;min-height:220px;flex:1;max-height:640px;display:flex;align-items:center;justify-content:center; }
#trialCanvas { display:block;max-width:100%;max-height:100%;width:auto;height:auto;aspect-ratio:3/2;image-rendering:pixelated;touch-action:none; }
#trialQuiz,#trialResult { position:absolute;inset:0;overflow:auto;background:#0a252bf5;border:2px solid #c5a365;padding:22px;z-index:3;box-shadow:0 12px 50px #0008; }
#trialQuiz[hidden],#trialResult[hidden] { display:none; }#trialQuiz h3,#trialResult h3 { color:#e2bd72;font-size:23px;margin:9px 0;font-weight:normal; }#trialQuiz p,#trialResult p { line-height:1.5;font-size:17px;margin:10px 0; }
.spice-choices { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }.spice-choices button { padding:12px;text-align:left;background:#163d3c;color:#eee1be;border:1px solid #9d8857;min-height:76px; }.spice-choices b { display:block;font:17px Georgia,serif;color:#efd298; }.spice-choices small { display:block;font:13px/1.4 Georgia,serif;margin-top:7px; }
.trial-controls { width:min(100%,960px);display:flex;align-items:center;justify-content:center;gap:12px;padding:10px 0 0; }.trial-controls span { font:10px/1.5 'Courier New',monospace;color:#b2c9b9; }.trial-controls button { touch-action:none;user-select:none; }.trial-pad { display:grid;grid-template-columns:repeat(4,42px);gap:5px; }.trial-pad button { min-width:40px;min-height:44px;color:#eee1be;background:#204240;border:1px solid #a58a53;font-size:23px; }
@media(max-width:1100px){.rpg-brand { font-size:12px!important;letter-spacing:.04em;gap:6px; }.rpg-wallet { font-size:10px; }.rpg-nav button { font-size:12px;padding:7px; }}
@media(max-width:700px){#campaignChrome { height:106px;display:block;padding:5px 8px; }.rpg-brand { height:33px;justify-content:center; }.rpg-nav { overflow-x:auto;justify-content:flex-start;max-width:100%;padding-bottom:4px; }.rpg-nav button { flex-shrink:0;font-size:12px;min-height:43px; }.rpg-wallet { display:none; }#rpgScene { top:106px; }#rpgPanel { padding-top:118px; }.campaign-content { padding-top:125px; }.world-detail-copy { padding-top:125px; }.trial-head h2 { font-size:18px; }.trial-head .rpg-micro { font-size:8px; }#rpgArena { padding:8px; }.trial-controls { flex-wrap:wrap;gap:7px; }.trial-controls span { display:none; }.trial-controls .rpg-button { min-height:44px;padding:8px 13px; }.trial-pad { grid-template-columns:repeat(4,36px);gap:4px; }.trial-pad button { min-width:36px;font-size:19px; }.spice-choices { grid-template-columns:1fr 1fr;gap:7px; }.spice-choices button { min-height:67px;padding:8px; }.spice-choices b { font-size:14px; }.spice-choices small { font-size:11px; }#trialQuiz,#trialResult { padding:12px; }#trialQuiz p,#trialResult p { font-size:14px; }#trialQuiz h3,#trialResult h3 { font-size:18px; }.trial-field { min-height:280px; }#trialStatus { font-size:11px; }}
@media(max-width:700px){.rpg-nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px;overflow:visible;}.rpg-nav button{font-size:11px;padding:5px 2px;min-width:0;white-space:normal;}.rpg-nav #rpgPlayerButton{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.rpg-nav .on-world{display:block;}}
@media(max-width:360px){#campaignChrome{height:142px;}.rpg-nav{grid-template-columns:repeat(3,minmax(0,1fr));}.rpg-nav button{min-height:43px;}#rpgScene{top:142px;}#rpgPanel{padding-top:152px;}.campaign-content{padding-top:160px;}}
@media(max-width:700px){body.rpg-exploring #campaignChrome{display:grid!important;grid-template-rows:33px 1fr;gap:0;}body.rpg-exploring .rpg-brand{width:100%;}body.rpg-exploring .rpg-nav{width:100%;}}

body.rpg-exploring #arcAction{position:absolute;bottom:29px;left:50%;transform:translateX(-50%);background:#d6b375;color:#17352e;border:1px solid #efd092;border-radius:0;min-height:48px;max-width:calc(100% - 190px);font-size:16px;z-index:2;}
/* Shared game-house lobbies: lightweight pixel-style room illustrations. */
.game-house{--house:#568277;--lamp:#e4bd71;--wood:#583d30;--shade:#10272a;background:#102126}
.house-saffron{--house:#b17e46;--lamp:#f1ca7f;--wood:#694632;--shade:#332724}
.house-crimson{--house:#a25557;--lamp:#f2bd82;--wood:#503132;--shade:#241f2c}
.house-scene{height:185px;position:relative;overflow:hidden;background:var(--shade);border-bottom:4px solid var(--wood);image-rendering:pixelated;isolation:isolate}
.house-scene::before,.house-scene::after{content:"";position:absolute;top:35px;width:105px;height:90px;background:repeating-linear-gradient(90deg,transparent 0 25px,var(--wood) 25px 31px),repeating-linear-gradient(0deg,var(--house) 0 25px,var(--wood) 25px 31px);border:8px solid var(--wood);box-shadow:0 0 0 4px #07181c;opacity:.7}
.house-scene::before{left:8%}.house-scene::after{right:8%}
.house-beams{position:absolute;inset:8px 4% 0;border:12px solid var(--wood);border-bottom:0;z-index:3;pointer-events:none}
.house-beams::before{content:"";position:absolute;inset:5px -30px auto;height:12px;background:#ba8c57;box-shadow:0 12px 0 #30241f}
.house-lamp{position:absolute;top:46px;width:24px;height:35px;background:var(--lamp);box-shadow:0 -7px 0 var(--wood),0 7px 0 var(--wood),-5px 0 0 var(--house),5px 0 0 var(--house);z-index:4;animation:houseGlow 3s ease-in-out infinite alternate}
.house-lamp.left{left:26%}.house-lamp.right{right:26%;animation-delay:-1.5s}
.house-sign{position:absolute;left:calc(50% - 42px);top:29px;width:84px;padding:6px 0;text-align:center;background:#142e30;border:5px solid #b58c55;box-shadow:5px 5px #07181c;color:#e6cd94;font-size:35px;z-index:4;line-height:1}
.house-sign small{font-size:10px;display:block;margin-top:6px;letter-spacing:2px;text-transform:uppercase}
.house-floor{position:absolute;inset:auto 0 0;height:43px;background:repeating-linear-gradient(90deg,#67472e 0 56px,#392d25 56px 60px);border-top:5px solid #b18b59;opacity:.65;z-index:1}
.house-table{position:absolute;left:calc(50% - 100px);bottom:24px;width:200px;height:19px;background:#ac7c44;border:5px solid #503629;box-shadow:0 5px #151d20;z-index:2}
.house-table::before,.house-table::after{content:"";position:absolute;top:14px;width:12px;height:32px;background:#503629}.house-table::before{left:16px}.house-table::after{right:16px}
.house-table i{position:absolute;top:-14px;width:13px;height:9px;background:var(--lamp);box-shadow:3px 4px #132c2d}.house-table i:nth-child(1){left:20px}.house-table i:nth-child(2){left:65px}.house-table i:nth-child(3){left:110px}.house-table i:nth-child(4){left:155px}
.game-house .rpg-window-body>h3{font-size:27px;color:var(--lamp);margin:12px 0}
.house-games{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:22px 0}
.house-games article{background:#183035;border:1px solid #74684b;padding:18px;display:flex;flex-direction:column;align-items:flex-start}
.house-games article h3{color:#e3c58b;font-size:23px;margin:12px 0 6px}.house-games article p{font-size:16px;line-height:1.5;flex:1}.house-games .rpg-button{font-size:14px;min-height:44px}
@keyframes houseGlow{from{filter:brightness(.85)}to{filter:brightness(1.15)}}
@media(max-width:600px){.house-games{grid-template-columns:1fr}.house-scene{height:150px}.house-scene::before{left:3%}.house-scene::after{right:3%}.house-lamp.left{left:19%}.house-lamp.right{right:19%}}
@media(prefers-reduced-motion:reduce){.house-lamp{animation:none}}
#dayLight{position:absolute;inset:0;pointer-events:none;z-index:1;transition:opacity 3s;background:#19294c;mix-blend-mode:multiply}#dayLight[data-phase="Sunrise"]{background:#e6ad74;mix-blend-mode:soft-light}#dayLight[data-phase="Sunset"]{background:#da854b;mix-blend-mode:soft-light}
#rpgDayButton{font-variant-numeric:tabular-nums;color:#ead59e;font-size:12px}
.pixel-bed{height:125px;position:relative;max-width:320px;margin:20px auto 30px;background:linear-gradient(#122a38 0 78%,#654730 78%);border:4px solid #73583c;image-rendering:pixelated}
.pixel-bed::before{content:"";position:absolute;width:170px;height:42px;left:70px;bottom:20px;background:#447a78;border:7px solid #cda66b;box-shadow:-8px 8px #392d29,8px 8px #392d29}
.pixel-bed::after{content:"";position:absolute;width:34px;height:28px;left:75px;bottom:31px;background:#e1d9b9;box-shadow:8px 0 #aaa587}
.pixel-bed span{position:absolute;top:10px;right:20px;font-size:30px;color:#ead59e}.rest-room>h3{font-size:28px;color:#e2c68e}.rest-room>p{line-height:1.6}

#campaignChrome .rpg-nav{min-width:0}.rpg-brand{flex-shrink:0}
@media(min-width:701px) and (max-width:1250px){#campaignChrome{height:106px;display:block;padding:5px 12px}.rpg-brand{height:33px;justify-content:center}.rpg-nav{overflow-x:auto;justify-content:flex-start;max-width:100%;padding-bottom:4px}.rpg-nav button{flex-shrink:0;min-height:43px}#rpgScene{top:106px}#rpgPanel{padding-top:118px}.campaign-content,.world-detail-copy{padding-top:125px}}
.rpg-marker{min-width:44px;min-height:44px}.rpg-marker.venue-door{font:12px Georgia,serif;min-width:86px;min-height:44px;border:1px solid #d9b875;background:#183c3be8;border-radius:3px;box-shadow:0 3px #061b20;transform:translate(-50%,5px)}
#rpgTouchPad{display:none;position:absolute;right:max(14px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));grid-template-columns:repeat(3,48px);grid-template-rows:repeat(2,48px);gap:5px;z-index:5;touch-action:none}#rpgTouchPad button{border:1px solid #cfac6e;background:#102f38e8;color:#efd69d;font-size:24px;min-width:48px;min-height:48px;touch-action:none}#rpgTouchPad button:nth-child(1){grid-column:2}#rpgTouchPad button:nth-child(2){grid-column:1;grid-row:2}#rpgTouchPad button:nth-child(3){grid-column:2;grid-row:2}#rpgTouchPad button:nth-child(4){grid-column:3;grid-row:2}
#rpgMenuButton{position:sticky;right:0;z-index:2;box-shadow:-8px 0 10px #071b22}#campaignChrome{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.campaign-ui button,.rpg-button{min-height:44px}.rpg-controls{bottom:max(24px,env(safe-area-inset-bottom))}
@media(any-pointer:coarse),(max-width:1100px){#rpgTouchPad{display:grid}.rpg-map{bottom:145px}.rpg-controls span{display:none}.rpg-controls{max-width:calc(100% - 185px)}.rpg-controls button{min-height:48px}.quest-tracker{max-width:calc(100% - 30px)}}
@media(max-height:500px){.location-card{padding:7px 12px}.location-card h2{font-size:18px}.quest-tracker{top:90px;padding:8px 12px;max-width:210px}.quest-tracker h3{font-size:14px}.quest-tracker p{display:none}.rpg-map{display:none}#rpgTouchPad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,44px);bottom:12px}.rpg-controls{bottom:12px}}

@media(max-width:700px){.rpg-nav{display:flex!important;grid-template-columns:none;overflow-x:auto!important;justify-content:flex-start;gap:5px;padding-bottom:4px}.rpg-nav button{flex:0 0 auto;white-space:nowrap;min-width:44px;min-height:44px;padding:8px}.rpg-nav #rpgPlayerButton{max-width:120px}.quest-tracker{max-width:190px}.quest-tracker h3{font-size:15px}}
#campaignChrome{top:env(safe-area-inset-top,0px)}
@media(max-width:900px){input,select,textarea{font-size:16px!important}}

/* Tap-select source cards support touch, mouse and keyboard equally. */
.evidence-step{border:1px solid #71613e;border-radius:8px;padding:16px;margin:24px 0}.evidence-step legend{color:#d9be78;padding:0 8px}.evidence-card{display:block;width:100%;min-height:48px;text-align:left;margin:10px 0;white-space:normal}.evidence-card.selected{border-color:#afca94;background:#28493f;box-shadow:inset 4px 0 #b8d29c}.evidence-feedback{color:#e3c995;line-height:1.6}.evidence-notebook textarea{box-sizing:border-box;width:100%;min-height:125px;padding:14px;background:#101d2a;color:#f4e4c3;border:1px solid #8b7850;font:inherit}.evidence-summaries{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.evidence-summary{border:1px solid #71613e;padding:16px}.evidence-summary blockquote{margin:15px 0;padding:12px;border-left:3px solid #bfa361;white-space:pre-wrap;overflow-wrap:anywhere}.evidence-notebook button:focus-visible{outline:3px solid #f5df9e;outline-offset:3px}@media(max-width:650px){.evidence-summaries{grid-template-columns:1fr}.evidence-step{padding:10px}}

/* Entry adventures and writing handoff */
.source-layout.text-source{display:block}.source-layout a{color:inherit;text-decoration:underline}.portfolio-records{display:grid;gap:16px;margin:24px 0}.portfolio-records .rpg-micro{overflow-wrap:anywhere}.rpg-window-body textarea[readonly]{width:100%;min-height:260px;box-sizing:border-box;margin:20px 0;font:16px/1.6 monospace;white-space:pre-wrap}.portfolio-records blockquote{white-space:pre-wrap;overflow-wrap:anywhere}#writingClass{display:block;width:min(100%,360px);min-height:48px;margin:12px 0 20px;background:#122b31;color:#f5e6c7;border:1px solid #9b8959;padding:10px;font-size:16px}#campaignChrome .rpg-nav{padding-right:0}#rpgMenuButton{position:relative;right:auto;box-shadow:none}@media(max-width:1250px){#rpgMenuButton{position:fixed;right:max(12px,env(safe-area-inset-right));top:max(8px,env(safe-area-inset-top));background:#14343a;border:1px solid #a78e58}#campaignChrome .rpg-brand{padding-right:70px}}

.rift-tabs{margin-bottom:20px}.rift-tabs .rpg-button{min-height:48px;flex:1}.rift-destinations{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.rift-destinations .rpg-button{min-height:48px;flex:1}.rift-copy .quest-card{margin-top:16px}

.chapter-arc{padding:24px 0;border-top:1px solid #b59b6655}.chapter-arc h2{font-size:27px}.chapter-card h3{font-size:24px}.chapter-card .rpg-button{white-space:normal;text-align:left}.study-reading p{font-size:18px;line-height:1.65}.study-reading textarea{width:100%;min-height:180px;font-size:18px;line-height:1.5;box-sizing:border-box}.study-self-check{margin:20px 0}.study-self-check label{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px;cursor:pointer}.study-self-check input{width:24px;height:24px;flex-shrink:0}#riftChapter{display:block;width:100%;max-width:100%;min-height:48px;background:#122b31;color:#f5e5bd;padding:10px;border:1px solid #a78c52;font:inherit;box-sizing:border-box}@media(max-width:600px){.study-reading p{font-size:16px}.chapter-arc h2{font-size:23px}.chapter-card h3{font-size:21px}}
.location-card{max-width:min(500px,calc(100% - 32px));overflow-wrap:anywhere;box-sizing:border-box}.location-card h2{font-size:clamp(18px,2.2vw,28px)}.location-card .rpg-micro{line-height:1.5}.map-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.rift-copy h3{overflow-wrap:anywhere}.chapter-card p{overflow-wrap:anywhere}
#formPartControls[hidden]{display:none}

/* Time Rift travel cutscene (0.7.0) */
.cutscene { position:fixed; inset:0; z-index:300; overflow:hidden; color:var(--rpg-paper); background:radial-gradient(circle at 50% 45%,#12343d 0%,#061419 55%,#020a0d 100%); font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; animation:cutIn .35s ease-out both; }
.cutscene.cut-leaving { animation:cutOut .35s ease-in both; }
.cut-stars { position:absolute; inset:-20%; background-image:radial-gradient(#f4d18e 1px,transparent 1.5px),radial-gradient(#8cae91 1px,transparent 1.5px); background-size:90px 90px,140px 140px; background-position:0 0,40px 70px; opacity:.35; animation:cutDrift 9s linear infinite; }
.cut-beat { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; opacity:0; visibility:hidden; transition:opacity .7s ease, visibility 0s linear .7s; padding:24px; text-align:center; }
.cutscene[data-beat="open"] .cut-open, .cutscene[data-beat="time"] .cut-time, .cutscene[data-beat="arrive"] .cut-arrive { opacity:1; visibility:visible; transition:opacity .7s ease; }
.cut-open p, .cut-jump { font-size:clamp(20px,3.2vw,32px); letter-spacing:.08em; color:var(--rpg-gold); margin:0; text-shadow:0 0 18px #e2bd7266; }
.cut-portal { position:relative; width:min(46vw,280px); aspect-ratio:1; }
.cut-portal i { position:absolute; inset:0; border-radius:50%; border:3px dashed var(--rpg-gold); animation:cutSpin 1.6s linear infinite; box-shadow:0 0 30px #e2bd7255 inset; }
.cut-portal i:nth-child(2) { inset:14%; border-color:var(--rpg-jade); animation-duration:1.1s; animation-direction:reverse; }
.cut-portal i:nth-child(3) { inset:30%; border-style:solid; border-width:2px; background:radial-gradient(circle,#fff6d8 0%,#e2bd72 35%,transparent 70%); animation:cutPulse 2.4s ease-in both; }
.cutscene[data-beat="open"] .cut-portal { animation:cutGrow 2.4s ease-in both; }
.cut-ribbon { position:relative; width:min(86vw,900px); height:150px; }
.cut-track { position:absolute; left:0; right:0; top:74px; height:4px; background:linear-gradient(90deg,transparent,var(--rpg-bronze) 8%,var(--rpg-gold) 50%,var(--rpg-bronze) 92%,transparent); }
.cut-mark { position:absolute; top:0; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:4px; width:max-content; max-width:40vw; font-size:14px; }
.cut-mark span { font:11px/1.4 'Courier New',monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--rpg-jade); }
.cut-mark b { font-size:clamp(17px,2.4vw,24px); color:var(--rpg-paper); font-weight:normal; }
.cut-mark::after { content:''; width:2px; height:26px; background:var(--rpg-gold); margin-top:2px; }
.cut-mark.to b { color:var(--rpg-gold); }
.cut-traveller { position:absolute; top:62px; left:var(--from); transform:translateX(-50%); font-size:26px; color:#fff6d8; text-shadow:0 0 14px #f4d18e,0 0 30px #e2bd72; }
.cutscene[data-beat="time"] .cut-traveller { animation:cutTravel 3.2s cubic-bezier(.5,0,.3,1) .5s both; }
.cut-arrive { justify-content:flex-end; padding-bottom:max(48px,8vh); }
.cut-art { position:absolute; inset:0; z-index:-1; background-image:linear-gradient(180deg,#020a0d10 0%,#020a0d55 45%,#020a0dee 100%),url('../assets/rpg/worlds.png'); background-size:cover,300% 100%; background-position:center,var(--world-pos) center; image-rendering:pixelated; }
.cutscene[data-beat="arrive"] .cut-art { animation:cutZoom 6s ease-out both; }
.cut-card { width:min(600px,92vw); padding:26px 30px; background:#041117e6; border:1px solid #e2bd7288; box-shadow:0 10px 40px #000a; display:flex; flex-direction:column; align-items:center; gap:8px; }
.cut-card h2 { margin:0; font-size:clamp(30px,5vw,46px); font-weight:normal; letter-spacing:.05em; color:var(--rpg-gold); }
.cut-date { margin:0; font:13px/1.5 'Courier New',monospace; letter-spacing:.1em; color:var(--rpg-paper); }
.cut-question { margin:6px 0 10px; font-size:clamp(17px,2.2vw,20px); line-height:1.45; font-style:italic; }
.cut-card .cut-jump { font-size:16px; letter-spacing:.06em; }
.cut-skip { position:absolute; top:max(16px,env(safe-area-inset-top)); right:18px; z-index:2; min-height:44px; padding:8px 18px; background:#041117cc; color:var(--rpg-paper); border:1px solid #eee1be66; border-radius:4px; font:14px 'Courier New',monospace; letter-spacing:.1em; cursor:pointer; }
.cut-skip:focus-visible, .cut-begin:focus-visible { outline:3px solid #f4d18e; outline-offset:4px; }
.cut-live { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.cutscene.cut-still, .cutscene.cut-still *, .cutscene.cut-still .cut-beat { animation:none!important; transition:none!important; }
@keyframes cutIn { from { opacity:0 } to { opacity:1 } }
@keyframes cutOut { from { opacity:1 } to { opacity:0 } }
@keyframes cutDrift { to { transform:translate(-90px,-140px) rotate(8deg) } }
@keyframes cutSpin { to { transform:rotate(360deg) } }
@keyframes cutGrow { 0% { transform:scale(.6) rotate(-40deg); opacity:.55 } 100% { transform:scale(1.15) rotate(0); opacity:1 } }
@keyframes cutPulse { 0%,60% { opacity:.6; transform:scale(.8) } 100% { opacity:1; transform:scale(2.6) } }
@keyframes cutTravel { from { left:var(--from) } to { left:var(--to) } }
@keyframes cutZoom { from { transform:scale(1.12) } to { transform:scale(1) } }
@media (max-width:640px) { .cut-ribbon { height:170px } .cut-mark { font-size:12px } .cut-card { padding:20px 18px } }