#story-layer[hidden]{display:none}#story-layer{position:fixed;inset:0;z-index:1500;isolation:isolate;cursor:pointer;color:#ffefd2;touch-action:manipulation}.story-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,5,17,.9),rgba(8,5,17,.36) 55%,transparent);z-index:-1}.story-composition{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:max(24px,env(safe-area-inset-left));width:min(640px,78vw);text-align:left}.story-npc .story-composition{left:auto;right:max(24px,env(safe-area-inset-right))}.story-dialogue{position:relative;padding:26px 25px 16px;border:1px solid #cfaf73;border-radius:9px;background:linear-gradient(125deg,#322035f7,#171322f5);box-shadow:0 0 0 3px #211728,0 0 0 4px #8b6c49,0 12px 45px #0008;min-height:118px}.story-dialogue:before,.story-dialogue:after{content:'◆';position:absolute;top:5px;font-size:10px;color:#e4c488}.story-dialogue:before{left:6px}.story-dialogue:after{right:6px}.story-name{position:absolute;top:-14px;left:22px;max-width:calc(100% - 44px);padding:5px 22px;border:1px solid #d6b77e;border-radius:4px;background:linear-gradient(#4c3348,#271c31);font:700 14px/1.2 Georgia;overflow-wrap:anywhere}.story-npc .story-name{left:auto;right:22px}.story-text{font:17px/1.5 Georgia,serif;white-space:pre-wrap;margin:0;min-height:3em}.story-hint{display:block;text-align:right;color:#c8b299;font:10px/1.3 sans-serif;margin-top:10px}.story-portrait{height:min(37vh,240px);width:min(50vw,430px);position:relative;margin-left:-10px;margin-bottom:-2px;pointer-events:none}.story-npc .story-portrait{margin-left:auto;margin-right:-10px}.story-portrait img{width:100%;height:100%;object-fit:contain;object-position:bottom}.story-portrait-art{display:block;width:100%;height:100%;background-image:url(assets/story-portraits.webp);background-size:400% 600%;background-position:var(--portrait-x) var(--portrait-y);background-repeat:no-repeat}.story-npc .story-portrait-art{transform:scaleX(-1)}.story-narration .story-composition{left:10%;right:10%;bottom:22%;width:80%;text-align:center}.story-narration .story-dialogue{background:none;border:0;box-shadow:none;padding:10px}.story-narration .story-dialogue:before,.story-narration .story-dialogue:after{display:none}.story-narration .story-text{font:clamp(22px,3.5vw,36px)/1.5 Georgia;text-shadow:0 2px 10px #000}.story-narration .story-hint{text-align:center}.story-wait{pointer-events:none;cursor:default}.story-wait .story-shade{display:none}.story-wait .story-composition{bottom:auto;top:max(8px,env(safe-area-inset-top));left:20%;right:20%;width:60%}.story-wait .story-dialogue{padding:18px 16px 8px;min-height:0}.story-wait .story-text{font-size:13px;min-height:0}.story-wait .story-name{font-size:11px}.story-wait .story-hint{margin-top:3px}.story-wait:has(.story-hint) .story-dialogue{pointer-events:none}
/* Journal owns its pointer input; the room behind it deliberately does not. */
.character-home.journal-home .character-sidebar{left:0;right:0;top:max(18px,env(safe-area-inset-top));bottom:calc(var(--bar-height) + 22px + env(safe-area-inset-bottom));width:min(700px,calc(100% - 64px - env(safe-area-inset-left) - env(safe-area-inset-right)));max-height:460px;margin:auto;display:flex;min-height:0;overflow:hidden;pointer-events:auto}
.journal-window{position:relative;isolation:isolate;display:flex;flex:1;flex-direction:column;min-width:0;min-height:0;overflow:hidden;text-align:left;border:1px solid #ad8e606e;border-radius:10px;background:radial-gradient(ellipse at top left,#49303d55,transparent 60%),linear-gradient(115deg,#2d2230f5,#191420f7);padding:16px 22px 12px;color:#e4d4bd;box-shadow:0 12px 40px #09050e77,inset 0 1px #fce1a814;pointer-events:auto}
.journal-window>header{flex-shrink:0;border-bottom:1px solid #bb986034;padding-bottom:9px;margin-bottom:9px}
.journal-window header small{font:8px sans-serif;letter-spacing:2.2px;color:#bca17c}
.character-home .journal-window h2{font:20px/1.2 Georgia,serif!important;color:#f3dab0;margin:5px 0 0}
.journal-window h2 span{font:11px Georgia,serif!important;color:#b6a18c;margin-left:5px}
.journal-tabs{display:flex;flex-shrink:0;gap:5px;flex-wrap:wrap;margin:0 0 8px}
#app .journal-tabs button{width:auto;min-height:30px;margin:0;padding:5px 10px;font-size:10px;letter-spacing:.2px;border-color:#96754b66;background:#271d2b;box-shadow:none}
#app .journal-tabs button.selected{color:#ffe0a6;border-color:#c3a16d;background:linear-gradient(#58403288,#39283488)}
.journal-pages{overflow-y:auto;overflow-x:hidden;flex:1 1 0;min-height:0;min-width:0;padding:0 12px 12px 0;scrollbar-width:thin;scrollbar-color:#ad8a58 #1c1524;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;pointer-events:auto;overflow-wrap:anywhere}
.journal-pages:focus-visible{outline:1px solid #d8ba80;outline-offset:-2px}
.journal-pages::-webkit-scrollbar{width:5px}.journal-pages::-webkit-scrollbar-thumb{background:#ad8a58;border-radius:8px}
.journal-entry{padding:11px 0 12px;border-bottom:1px solid #ac89552b;max-width:590px}
.journal-entry:last-child{border-bottom:0}
.journal-entry small{font:8px sans-serif;letter-spacing:1.2px;color:#ae916f}
.character-home .journal-entry h3{font:16px/1.25 Georgia,serif!important;margin:5px 0;color:#ecd0a5}
.character-home .journal-entry p,.character-home .story-item-detail p{font:13px/1.65 Georgia,serif!important;white-space:pre-wrap;margin:6px 0;color:#d8c9b8}
.journal-note{border-left:2px solid #b88c5677;margin:7px 0 9px;padding:7px 12px;background:linear-gradient(90deg,#b88c560b,transparent);border-radius:0 5px 5px 0}
.note-done{opacity:.6}.note-done h3{text-decoration:line-through}
.journal-empty{text-align:center;margin:24px auto;max-width:300px;color:#bca68e;font:14px Georgia}.character-home .journal-empty p{font:13px/1.65 Georgia,serif!important}
#app .story-item-card{display:inline-flex;align-items:center;gap:10px;width:min(260px,100%);height:auto;min-height:66px;text-align:left;margin:4px 6px 4px 0;padding:8px;border-color:#b7596266;background:#301a2988;box-shadow:none;touch-action:pan-y}
.story-item-card strong,.story-item-card small{display:block;color:#ef9a9e}.story-item-card strong{font-size:11px}.story-item-card small{font-size:8px;margin-bottom:4px;letter-spacing:.8px}
.story-item-icon{position:relative;isolation:isolate;display:inline-flex;width:48px;height:48px;align-items:center;justify-content:center;border:1px solid #e35465;border-radius:6px;background:#320e20;overflow:hidden;flex-shrink:0}
.story-item-icon:before{content:'';position:absolute;inset:-50%;z-index:-1;background:conic-gradient(transparent,#ed2c49aa,transparent,#ffb0a366,transparent);animation:story-relic 5s linear infinite}
.story-item-icon:after{content:'';position:absolute;inset:3px;border:1px solid #fe899344;border-radius:4px;box-shadow:inset 0 0 16px #ed254d66;z-index:-1}.story-item-icon img{max-width:85%;max-height:85%;object-fit:contain;filter:drop-shadow(0 0 8px #ff384b)}@keyframes story-relic{to{transform:rotate(360deg)}}
.story-item-backdrop{position:fixed;inset:0;z-index:1300;background:#0c0819bb;display:grid;place-items:center;padding:20px;pointer-events:auto}
.story-item-detail{position:relative;width:min(380px,90vw);max-height:75dvh;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;background:linear-gradient(120deg,#30202d,#211722);border:1px solid #ae616b;border-radius:9px;padding:20px;color:#f1d8cc;box-shadow:0 12px 40px #08040c88}
.story-item-detail>.tool-back{position:absolute!important;right:8px;top:8px}.story-item-detail>small{display:block;margin-top:12px;color:#da959c;font-size:9px}.character-home .story-item-detail h2{font:19px Georgia,serif!important;color:#f1afb5;margin:10px 0}
.story-editor textarea{display:block;width:100%;min-height:95px;background:#171321;color:#f5dfc1;border:1px solid #715a47;border-radius:4px;padding:8px;resize:vertical;font:12px/1.5 monospace}.story-editor label{display:block;margin:8px 0}.story-editor .story-step{border:1px solid #715a47;border-radius:6px;padding:10px;margin:10px 0}.story-editor .story-editor-preview{max-width:250px;height:150px;aspect-ratio:2.25}.story-editor .balance-layout>main{min-width:0}.story-editor .story-guide{font-size:11px;color:#bda88e}.story-editor .story-json{min-height:260px}
@media(max-width:700px){.story-composition{width:calc(100% - 32px);left:16px;bottom:18px}.story-npc .story-composition{right:16px}.story-dialogue{padding:20px 16px 12px}.story-text{font-size:15px}.story-portrait{height:min(34vh,180px);width:min(65vw,330px)}.journal-window{padding:12px 16px}.bottom-tabs>button{padding-inline:5px!important;gap:3px!important}.bottom-tabs>button>span{font-size:8px!important}.bottom-tabs>button>i{font-size:15px!important}.story-wait .story-composition{left:12%;right:12%;width:76%}}
@media(max-height:430px){.story-portrait{height:130px;width:292px}.story-dialogue{min-height:88px}.story-text{font-size:14px}.story-composition{bottom:14px}.story-name{font-size:12px}.character-home.journal-home .character-sidebar{top:max(10px,env(safe-area-inset-top));bottom:calc(var(--bar-height) + 12px + env(safe-area-inset-bottom))}.journal-window{padding:11px 16px}.character-home .journal-window h2{font-size:18px!important}.journal-window>header{padding-bottom:6px;margin-bottom:6px}.journal-entry{padding:8px 0 9px}}
@media(prefers-reduced-motion:reduce){.story-item-icon:before{animation:none}}
.item-kind-story .inventory-icon>.story-item-icon{width:100%;height:100%;border:0}.item-popup-icon>.story-item-icon{width:100%;height:100%}.story-editor input[type=checkbox]{width:auto!important}.story-editor .balance-fields label{min-width:0}.story-editor textarea:invalid{border-color:#ff6e7e}.story-item-detail .tool-back{width:30px!important;min-height:28px!important;padding:3px!important}.story-wait .story-hint{color:#ffe0a4}
.story-portrait{width:min(37vh,240px);height:min(37vh,240px);margin-left:4px}.story-portrait-art{aspect-ratio:1}.story-npc .story-portrait{margin-right:4px}@media(max-width:700px){.story-portrait{width:min(34vh,180px);height:min(34vh,180px)}}@media(max-height:430px){.story-portrait{width:130px;height:130px}}
.story-text{max-height:30vh;overflow:auto;scrollbar-width:thin}.story-wait .story-text{max-height:14vh}.story-narration .story-text{max-height:55vh}.story-editor .story-step select{max-width:100%}
.tutorial-target{outline:2px solid #ffe2a0!important;outline-offset:4px;animation:tutorial-beacon 1.4s ease-in-out infinite;position:relative}.atlas-marker.tutorial-target{position:absolute;border-radius:25%}.story-wait .story-composition{max-width:480px}.story-wait .story-dialogue{background:#24192bf5}.story-item-icon img[src$="story-merchant-crate.webp"]{object-fit:contain}@keyframes tutorial-beacon{50%{outline-color:#fff4ce;filter:drop-shadow(0 0 7px #edb65a)}}@media(prefers-reduced-motion:reduce){.tutorial-target{animation:none}}

/* Compact story presentation: 78.75% of the original dimensions (5% above the compact version). */
.story-composition{width:min(504px,61.425vw)}
.story-dialogue{padding:20.475px 19.6875px 12.6px;min-height:92.925px;border-radius:7px}
.story-name{font-size:11.03px;padding:3.75px 16.5px;top:-10.5px}
.story-text{font-size:13.39px}.story-hint{font-size:8.4px;margin-top:7.5px}
.story-portrait{width:min(28vh,180px);height:min(28vh,180px);overflow:hidden}
.story-npc .story-portrait img{object-fit:cover;object-position:center top;transform:scale(1.15);transform-origin:center top}
.story-actor-smith .story-portrait img{transform:scale(-1.15,1.15)}
.story-wait .story-composition{width:min(378px,47.25vw);max-width:378px}
.story-wait .story-dialogue{padding:14.175px 12.6px 6.3px;min-height:0}
.story-wait .story-text{font-size:10.5px}.story-wait .story-name{font-size:8.662px}.story-wait .story-hint{font-size:8.4px;margin-top:2px}
.shop-empty-stock{display:grid;align-content:center;text-align:center;min-height:180px;padding:20px;color:#e5d1b3}.shop-empty-stock h3{color:#f4d69f}.shop-empty-stock p{margin:6px 0}
@media(max-width:700px){.story-composition{width:calc((100% - 32px)*.7875)}.story-dialogue{padding:15.75px 12.6px 9.45px}.story-text{font-size:11.81px}.story-portrait{width:min(25.5vh,135px);height:min(25.5vh,135px)}.story-wait .story-composition{width:59.85vw}}
@media(max-height:430px){.story-dialogue{min-height:69.3px}.story-text{font-size:11.03px}.story-name{font-size:9.45px}.story-portrait{width:98px;height:98px}.story-wait .story-dialogue{min-height:0}.story-wait .story-text{font-size:10.5px}}
