/* Four small pages in Mira's pocket book. Settings never share a page with clues. */
#atlas-dialog{--book-ink:#414b3c;--book-muted:#6c735c;--book-gold:#ab8450;width:min(426px,calc(100vw - 24px));height:min(790px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);padding:0;border:1px solid #f8edd0;border-radius:15px 25px 25px 9px;color:var(--book-ink);background:#f6edd8 url('./assets/story-paper.svg');box-shadow:-5px 0 0 #65715a,5px 2px 0 #d4c7a7,9px 4px 0 #b1aa8b,0 24px 80px #132c3650;overflow:hidden}
#atlas-dialog[open]{display:flex;flex-direction:column}
#atlas-dialog::before{content:"";position:absolute;inset:0 auto 0 0;width:13px;background:linear-gradient(90deg,#7d73521c,#eadcbd00);border-right:1px solid #9a805918;pointer-events:none;z-index:1}
#atlas-dialog::after{top:11px;right:40px;width:65px;height:66px;opacity:.3}
.journal-cover{display:flex;align-items:center;gap:11px;min-height:102px;padding:20px 49px 17px 23px;flex-shrink:0;position:relative}
.journal-portrait{width:51px;height:57px;object-fit:cover;border-radius:48% 48% 42% 42%;border:2px solid #fcf3de;outline:1px solid #b19560;transform:rotate(-7deg);box-shadow:2px 3px 0 #bda27a32}
#atlas-dialog .journal-cover .eyebrow{font-size:7px;letter-spacing:1.55px;margin:0 0 7px;line-height:1.5;color:#84714d}
#atlas-dialog #journal-title{font:italic 27px/1.08 Georgia,serif;margin:0;color:#4a5743;letter-spacing:-.7px}
#atlas-dialog .close{right:6px;top:8px;color:#727b60;z-index:2}
.journal-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:0 18px 0 23px;flex-shrink:0;border-bottom:1px solid #b8a67b66;position:relative;z-index:2}
.journal-tabs button{--tab-color:#63735b;display:flex;flex-direction:column;align-items:center;gap:5px;min-height:57px;padding:8px 3px 9px;border:1px solid #a2947233;border-bottom:3px solid var(--tab-color);background:#dedbc745;border-radius:9px 9px 0 0;color:#626c56;font:11px/1 Arial,sans-serif;transition:background .18s,transform .18s}
.journal-tabs button:nth-child(2){--tab-color:#af844b}.journal-tabs button:nth-child(3){--tab-color:#6b8c8b}.journal-tabs button:nth-child(4){--tab-color:#af7660}
.journal-tabs button[aria-selected=true]{background:var(--tab-color);color:#fff7e4;border-color:var(--tab-color);box-shadow:inset 0 0 0 3px #fff2c811;transform:translateY(-3px);border-radius:9px 9px 3px 3px}
.journal-tabs svg{width:20px;height:20px;stroke-width:1.5}
.journal-tabs button:focus-visible{outline:2px solid #8b5e31;outline-offset:2px}
.journal-pages{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b9ac89 transparent;padding:23px 23px 24px 27px;position:relative}
.journal-pages>section:focus-visible{outline:2px solid #9b835c;outline-offset:5px}
#atlas-dialog .journal-page-heading{margin-bottom:19px}.journal-kicker{font:600 8px/1.4 Arial,sans-serif;letter-spacing:1.65px;color:#8c7957}
#atlas-dialog h3{font:italic 25px/1.15 Georgia,serif;color:#4c5a46;margin:7px 0 9px;letter-spacing:-.6px}
#atlas-dialog .journal-page-heading p{font:12px/1.5 Georgia,serif;color:#777b62;margin:7px 0 0}
.journal-count{font:10px/1.4 Arial,sans-serif;color:#79816b}
#atlas-dialog #atlas-regions{gap:5px;margin:0 0 15px}#atlas-dialog #atlas-regions button{min-height:40px;border-color:#b4ae914d;border-radius:16px;font-size:11px;padding:8px 12px}
.journal-thread{display:flex;gap:12px;align-items:flex-start;border:1px solid #bda27650;background:#fffaec88;padding:14px 13px;border-radius:3px 11px 11px 3px;box-shadow:2px 3px 0 #bda27610;transform:rotate(-.45deg);margin-bottom:19px}
.journal-thread>svg{flex-shrink:0;width:24px;height:26px;color:#8a956b}.journal-thread span{font:600 8px/1 Arial,sans-serif;text-transform:uppercase;letter-spacing:1.2px;color:#8e7854}
#atlas-dialog .journal-thread p{font:13px/1.5 Georgia,serif;margin:6px 0 0;color:#525d48}
.journal-map-paper{position:relative;background:radial-gradient(ellipse at center,#e7ead51f,#d9ddbf20 70%,transparent);border:1px dashed #b6ae8b40;border-radius:45% 38% 8px 8px;padding:9px 0 17px}
#atlas-dialog #map,#atlas-dialog #night-map{display:block;width:100%;margin:0;overflow:hidden}
.map-inscription{display:block;text-align:center;font:italic 11px/1.5 Georgia,serif;color:#858567;padding:6px 12px 0}
.journal-hint{display:flex;align-items:center;gap:11px;width:100%;min-height:65px;padding:12px;border:1px solid #b89d6455;border-radius:5px 13px 13px 5px;background:linear-gradient(110deg,#e6d6ae88,#f8eacb90);color:#5f654a;text-align:left;box-shadow:2px 3px 0 #9e8c5f0d;margin-bottom:24px}
.journal-hint>svg{width:27px;height:27px;flex-shrink:0;color:#a48342}.journal-hint>span:nth-child(2){flex:1}.journal-hint strong{display:block;font:italic 18px/1.2 Georgia,serif}.journal-hint small{display:block;font:10px/1.5 Arial,sans-serif;color:#7c7c60;margin-top:4px}
#atlas-dialog .journal-note-heading{display:flex;align-items:center;justify-content:space-between;gap:9px;font:italic 18px/1.3 Georgia,serif;margin:0;padding:0 0 10px;color:#637054}
.journal-note-count{display:inline-flex;justify-content:center;align-items:center;min-width:24px;height:24px;border:1px solid #a5966d55;border-radius:50%;font:10px Arial,sans-serif;color:#8d815e}
.journal-note-group{margin-bottom:22px}.journal-note-items{padding:0;margin:0;list-style:none;display:grid;gap:8px}.journal-note{display:flex;gap:10px;align-items:flex-start;padding:12px 11px;border:1px solid #b39a6a2b;border-radius:2px 8px 8px 2px;background:#fff9e859;box-shadow:1px 2px 0 #9e8c5f08}.journal-note:nth-child(even){margin-left:5px;background:#e8e9d44d}.note-mark{font:18px Georgia,serif;color:#a68c54;flex-shrink:0;width:15px;text-align:center}.victory .note-mark{font-size:14px;color:#819572}
#atlas-dialog .journal-note p{font:13px/1.5 Georgia,serif;margin:0;color:#535e48}
#atlas-dialog details.journal-note-group summary{min-height:44px;cursor:pointer;border-top:1px solid #b6a37b44;padding-top:12px}
#atlas-dialog details.journal-note-group summary::before{content:'›';font:22px Georgia,serif;transition:transform .15s}#atlas-dialog details.journal-note-group[open] summary::before{transform:rotate(90deg)}
.journal-empty{text-align:center;padding:9px 15px 25px}.journal-empty-mark{font:52px Georgia,serif;color:#baa372}.journal-empty h4{font:italic 19px Georgia,serif;margin:14px 0 10px}.journal-empty p{font:13px/1.6 Georgia,serif;color:#7c8267}
.journal-guide-list{padding:0;margin:0 0 23px;list-style:none;display:grid;gap:23px}.journal-guide-list>li{display:flex;gap:12px}.journal-guide-list>li>svg{width:29px;height:29px;flex-shrink:0;color:#9d8c5b;transform:rotate(-7deg)}
#atlas-dialog h4{font:16px/1.25 Georgia,serif;color:#5c684e;margin:0 0 6px}#atlas-dialog .journal-guide-list p,#atlas-dialog .journal-help p{font:12px/1.6 Georgia,serif;margin:0 0 8px;color:#6e775e}
#atlas-dialog .journal-help{border-top:1px solid #bca98040}.journal-help summary{display:flex;align-items:center;gap:10px;min-height:48px;font:13px Georgia,serif;list-style:none}.journal-help summary::-webkit-details-marker{display:none}.journal-help summary svg{width:20px;height:20px;color:#8a956d}.journal-chevron{margin-left:auto;font:18px Georgia,serif;transition:transform .2s}.journal-help[open] .journal-chevron{transform:rotate(180deg)}.journal-help>div{padding:3px 5px 12px 30px}.journal-help h4{padding-top:8px}
.journal-scribble{font:italic 16px/1.5 Georgia,serif;color:#8b8568;padding:19px 12px 0;transform:rotate(-2deg)}.journal-scribble span{display:block;text-align:right;font-size:12px;margin-top:4px}
.journal-master{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;min-height:58px;border-bottom:1px solid #bba47b55}.journal-master>span{display:flex;gap:11px;align-items:center}.journal-master svg{width:25px;height:25px;color:#7c8c66}.journal-master strong{font:16px Georgia,serif}.journal-master small{display:block;font:10px/1.5 Arial,sans-serif;color:#85866b;margin-top:3px}
#atlas-dialog .journal-muted{font:italic 12px/1.5 Georgia,serif;color:#8d7c5f;margin:10px 0 18px}
#atlas-dialog .journal-switch{appearance:none;position:relative;display:inline-block;flex-shrink:0;width:37px;height:22px;border:1px solid #9fa58e;border-radius:14px;background:#b5b8a375;cursor:pointer;transition:background .2s;margin:0}
#atlas-dialog .journal-switch::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff9e8;box-shadow:0 1px 3px #47543c44;transition:transform .2s}
#atlas-dialog .journal-switch:checked{background:#738764;border-color:#738764}#atlas-dialog .journal-switch:checked::after{transform:translateX(15px)}#atlas-dialog .journal-switch:focus-visible{outline:2px solid #a27535;outline-offset:4px}
#atlas-dialog .journal-setting-card{min-width:0;border:1px solid #b4a47d55;border-radius:5px 13px 13px 5px;background:#fffaed4d;margin:21px 0 0;padding:4px 13px 12px}
.journal-setting-card legend{padding:0 7px;font:italic 18px Georgia,serif;color:#647251}.journal-setting-card legend svg{width:19px;height:19px;vertical-align:-4px;margin-right:5px;color:#9a8b5c}
#atlas-dialog .music-setting{justify-content:space-between;margin:0;min-height:43px;font:12px Arial,sans-serif}.journal-setting-card .music-volume{font:11px Arial,sans-serif;color:#798068;margin-top:8px}.journal-setting-card output{font:11px Arial,sans-serif;color:#627759}
#atlas-dialog input[type=range]{width:100%;height:44px;margin:0;accent-color:#738663;cursor:pointer}#atlas-dialog input[type=range]:focus-visible{outline:2px solid #9b835c;outline-offset:1px}
#atlas-dialog .journal-setting-card p{font:11px/1.6 Georgia,serif;color:#7d8269;margin:2px 0 3px}
.journal-extras{margin:28px 0 22px}#atlas-dialog .journal-extras h4{font:italic 18px Georgia,serif;margin-bottom:9px}
#atlas-dialog #replay-opening,#atlas-dialog #replay-studio{display:flex;align-items:center;justify-content:flex-start;gap:9px;width:100%;min-height:46px;border:0;border-bottom:1px solid #bca98040;border-radius:0;padding:11px 0;margin:0;box-shadow:none;background:transparent;color:#69735a;font:12px Georgia,serif;text-decoration:none}
#replay-opening svg,#replay-studio svg{width:19px;height:19px;color:#a2915f}.journal-extras button>span:last-child{margin-left:auto}
.journal-back-pages{border-top:1px solid #bca98055;padding-top:18px}.journal-back-pages>a{display:block;font:13px/1.5 Georgia,serif;padding:12px 0;color:#646e56;text-decoration:none}.journal-back-pages>a span{display:block;font:10px Arial,sans-serif;margin-top:5px;color:#948264}.journal-back-pages .journal-help>div{padding-left:0}.journal-back-pages .journal-help a{display:block;color:#72775f;font:12px Georgia,serif;min-height:44px;padding:14px 0}
#atlas-dialog #restart{display:flex;justify-content:space-between;align-items:center;width:100%;padding:14px 0;min-height:48px;border:0;border-top:1px solid #bc9a7544;background:transparent;color:#967053;font:12px Georgia,serif;text-align:left}
.journal-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid #b8a67b55;margin:0 20px 0 25px;min-height:53px;flex-shrink:0}.journal-bottom>span{font:8px/1.4 Arial,sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#8e866a}.journal-bottom button{min-height:46px;padding:8px 0 8px 8px;border:0;background:none;color:#647353;font:italic 12px Georgia,serif}.journal-bottom button span{margin-left:4px;color:#a59164}
@media(max-width:350px),(max-height:650px){#atlas-dialog{height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);width:min(426px,calc(100vw - 22px))}.journal-cover{min-height:85px;padding:15px 43px 13px 19px;gap:9px}.journal-portrait{width:42px;height:47px}#atlas-dialog #journal-title{font-size:23px}#atlas-dialog .journal-cover .eyebrow{font-size:6px;letter-spacing:1px}.journal-tabs{padding:0 13px 0 18px;gap:4px}.journal-tabs button{min-height:53px;font-size:10px}.journal-pages{padding:19px 18px 20px 22px}#atlas-dialog h3{font-size:23px}.journal-bottom{margin:0 16px 0 20px;min-height:46px}.journal-bottom button{font-size:11px}.journal-bottom>span{font-size:7px}.journal-tabs svg{width:18px;height:18px}}
@media(prefers-reduced-motion:no-preference){.journal-pages>section{animation:journal-turn .22s ease-out}@keyframes journal-turn{from{opacity:.4;transform:translateX(5px)}to{opacity:1;transform:none}}}
