/* Le bloc de gauche suit la hauteur réelle des instruments, sans chevauchement. */
.hud-left{position:absolute;top:111px;left:27px;display:flex;flex-direction:column;align-items:flex-start;gap:18px;max-height:calc(100dvh - 250px)}
.hud-left .vitals,.hud-left .quest{position:relative;inset:auto;margin:0}
.hud-left .vitals{flex:none}
.hud-left .quest{width:264px;min-height:182px;padding:17px 18px 14px;transform:rotate(-.35deg);background-image:url('./assets/ui/paper-fibres.svg'),linear-gradient(148deg,#f0e0bc,#c6ac7d);background-size:180px 180px,auto;border-color:#8c653a;box-shadow:inset 0 0 0 3px #f5e4bf,inset 0 0 0 4px #96724561,0 5px 0 #604628,0 13px 25px #08180da8}
.hud-left .quest::after{content:'';position:absolute;inset:11px;pointer-events:none;border:1px solid #9e79484d}
.quest-heading{display:flex;align-items:center;gap:7px;border-bottom:1px solid #9d7b4c72;padding-bottom:8px;margin-bottom:9px}
.quest-heading .quest-icon{position:static;width:21px;height:21px;object-fit:contain;filter:sepia(.3)}
.hud-left .quest .eyebrow{color:#76512f;font:700 10px var(--material-sans,system-ui);letter-spacing:.11em}
.hud-left .quest h2{margin:0 0 8px;color:#392916;font:600 22px/1.13 var(--material-serif,Georgia,serif)}
.hud-left .quest p{max-width:none;min-height:35px;margin:0;color:#51402d;font:550 12px/1.45 var(--material-sans,system-ui);opacity:1}
.quest-progress{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;margin-top:14px}
.quest-progress-track,.journal-detail-rail,.journal-list-rail{display:block;overflow:hidden;background:#8a6e47a6;border:1px solid #6c4b2c;box-shadow:inset 0 1px 3px #3b28188a,0 1px #fff2cf78}
.quest-progress-track{height:7px}
.quest-progress-track i,.journal-detail-rail i,.journal-list-rail b{display:block;height:100%;background:linear-gradient(180deg,#eac985,#a76d37);box-shadow:inset 0 1px #fff2bf;transition:width .25s ease-out}
.quest-progress>span:last-child{color:#795831;font:700 10px var(--material-sans,system-ui);white-space:nowrap}
.quest-open{position:relative;display:flex;align-items:center;gap:7px;width:100%;margin-top:11px;padding:7px 0 0;border-top:1px solid #96744b7a;background:none;color:#604427;font:700 11px var(--material-sans,system-ui);pointer-events:auto;text-align:left}
.quest-open:hover{color:#9a592d}
.quest-open img{width:18px;height:18px;object-fit:contain}
.quest-open kbd{margin-left:auto;padding:2px 5px;background:#755332;color:#f9e7be;border-color:#a78150;font-size:9px}

/* Le carnet reprend la reliure sombre et le papier fibreux du reste de l'interface. */
#notebook .notebook-panel{width:min(1040px,calc(100vw - 70px));max-width:none;height:min(760px,88dvh);max-height:88dvh;padding:0;display:flex;flex-direction:column;overflow:hidden;text-align:left;scrollbar-color:#9d7846 #e4d0a9}
#notebook .notebook-panel>.close-panel{z-index:3;right:21px;top:18px;color:#f4dfb4}
.journal-heading{position:relative;display:flex;align-items:center;gap:19px;flex:none;min-height:121px;padding:22px 42px 18px;background-image:url('./assets/ui/leather-grain.svg'),linear-gradient(112deg,#3c4c39,#1d3026 70%,#15271f);background-size:144px 144px,auto;border-bottom:3px solid #a98753;box-shadow:inset 0 0 0 5px #192b21,inset 0 -1px #e5c78e7a}
.journal-heading::after{content:'';position:absolute;left:34px;right:34px;bottom:6px;border-bottom:1px solid #c4a06b4d}
.journal-heading>img{flex:none;width:61px;height:61px;object-fit:contain;filter:drop-shadow(0 3px 5px #07140e)}
#notebook .journal-heading .eyebrow{color:#d8bb81;font-size:10px;letter-spacing:.17em}
#notebook .journal-heading h2{margin:3px 0 3px;color:#f5e5bf;font:600 31px/1.1 var(--material-serif,Georgia,serif);text-shadow:0 2px #101d16}
#notebook .journal-heading p{margin:0;color:#d3c4a2;font-size:12px;line-height:1.4}
.journal-tabs{display:flex;flex:none;gap:0;padding:0 30px;background:#d2bc93;border-bottom:2px solid #947044}
.journal-tabs button{min-width:155px;padding:11px 18px 10px;background:none;color:#62482d;border-right:1px solid #9a75474d;font:700 12px var(--material-sans,system-ui);text-align:left}
.journal-tabs button[aria-selected=true]{background-image:url('./assets/ui/paper-fibres.svg'),linear-gradient(#f0dfb9,#e5cda0);background-size:180px 180px,auto;color:#382b1b;box-shadow:inset 0 3px #8f6032,inset 0 -3px #ead4a8}
.journal-tabs button:hover{color:#9b5e30}
.journal-tabs span{float:right;margin-left:9px;padding:1px 6px;border-radius:10px;background:#8f70493b;font-size:10px}
.journal-page{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:0;flex:1;background-image:url('./assets/ui/paper-fibres.svg'),linear-gradient(135deg,#ead6ad,#d7bd8e);background-size:180px 180px,auto}
.journal-quest-list{min-height:0;padding:16px 12px 20px;overflow:auto;border-right:3px double #8b6b43;background:linear-gradient(90deg,#d4bc91,#e5d0a7)}
.journal-quest-item{position:relative;display:block;width:100%;margin:0 0 8px;padding:12px 13px 13px;background:#ebd8b1;border:1px solid #ac895b;box-shadow:inset 0 0 0 2px #f5e4c3,0 2px 0 #a1845b;color:#4a3523;text-align:left;transition:background .16s,transform .16s}
.journal-quest-item:hover{background:#f5e5c3;transform:translateX(2px)}
.journal-quest-item.selected{background:#f5e5c3;border-color:#855a31;box-shadow:inset 0 0 0 2px #fff2d6,0 0 0 2px #976b3b7d,0 3px 9px #5e452b3a}
.journal-quest-item.tracked::before{content:'';position:absolute;top:9px;right:9px;width:8px;height:8px;transform:rotate(45deg);background:#bf8745;border:1px solid #714720}
.journal-quest-item small{display:block;margin-bottom:5px;color:#8c673b;font:700 9px var(--material-sans,system-ui);letter-spacing:.1em}
.journal-quest-item strong{display:block;padding-right:10px;color:#45311f;font:600 17px/1.1 var(--material-serif,Georgia,serif)}
.journal-quest-item>span{display:block;margin-top:6px;color:#745b3b;font:600 10px var(--material-sans,system-ui)}
.journal-quest-item.ready>span{color:#9b532e}.journal-quest-item.completed{opacity:.77}
.journal-list-rail{height:5px;margin-top:10px;border:0;background:#9b815b8a}
.journal-detail{position:relative;min-width:0;min-height:0;padding:27px 36px 34px;overflow:auto;scrollbar-color:#987349 #dfc8a0;color:#493523}
.journal-detail::before{content:'';position:absolute;inset:15px;pointer-events:none;border:1px solid #a17c4b68}
.journal-detail-eyebrow{color:#876138;font:700 10px var(--material-sans,system-ui);letter-spacing:.13em}
#notebook .journal-detail h3{margin:7px 90px 7px 0;color:#392819;font:600 30px/1.1 var(--material-serif,Georgia,serif)}
.journal-status{position:absolute;right:37px;top:32px;padding:5px 9px;border:1px solid #98704a;background:#dcc393;color:#674424;font:700 10px var(--material-sans,system-ui);text-transform:uppercase;letter-spacing:.07em}
.journal-detail.ready .journal-status{color:#7e3f21;border-color:#aa6841;background:#f1d0a2}
.journal-detail.completed .journal-status{color:#35624e;border-color:#608671;background:#c4d8be}
#notebook .journal-summary{margin:0 0 19px;max-width:580px;color:#65513a;font-size:13px;line-height:1.52}
.journal-current{position:relative;padding:13px 18px 14px;border:2px solid #aa8755;background-image:url('./assets/ui/leather-grain.svg'),linear-gradient(120deg,#344b39,#20382d);background-size:144px 144px,auto;box-shadow:inset 0 0 0 3px #1a3025,0 4px 0 #8c6942}
.journal-current::before{content:'';position:absolute;left:-5px;top:50%;height:15px;width:15px;transform:translateY(-50%) rotate(45deg);background:#bd9254;border:2px solid #6d4b2c}
.journal-current small{display:block;color:#c8aa70;font:700 9px var(--material-sans,system-ui);letter-spacing:.14em}
#notebook .journal-current p{margin:5px 0 0;color:#fff0ca;font:550 15px/1.35 var(--material-sans,system-ui)}
.journal-detail-progress{display:flex;align-items:center;gap:12px;margin:17px 0 19px;color:#7c5a35;font:700 11px var(--material-sans,system-ui)}
.journal-detail-rail{flex:1;height:9px}
.journal-step-list{margin:0;padding:0;list-style:none;counter-reset:none}
.journal-step-list li{position:relative;display:flex;align-items:center;gap:11px;min-height:36px;padding:5px 0;color:#705b42;font:600 13px/1.3 var(--material-sans,system-ui)}
.journal-step-list li:not(:last-child)::after{content:'';position:absolute;left:12px;top:30px;bottom:-9px;border-left:1px dashed #9c774c}
.journal-step-mark{display:flex;align-items:center;justify-content:center;flex:none;width:25px;height:25px;border:1px solid #a78a5c;background:#ddc79d;color:#795f3e;font:700 11px var(--material-sans,system-ui)}
.journal-step-list li.current{color:#55381e}.journal-step-list li.current .journal-step-mark{background:#aa753d;border-color:#6a4527;color:#fff0cb}
.journal-step-list li.done{color:#48644e}.journal-step-list li.done .journal-step-mark{background:#618568;border-color:#365a43;color:#f7f1d9}
.journal-step-list li small{margin-left:auto;color:#826440;font-size:10px;white-space:nowrap}
.journal-rewards{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:22px;padding-top:14px;border-top:1px solid #a483566b}
.journal-rewards small{width:100%;color:#846039;font:700 10px var(--material-sans,system-ui);letter-spacing:.12em}
.journal-rewards span{padding:5px 8px;border:1px solid #ae8c58;background:#f3e3be;color:#584028;font:650 11px var(--material-sans,system-ui)}
.journal-track{margin-top:21px;min-width:190px;padding:10px 14px;background-image:url('./assets/ui/leather-grain.svg'),linear-gradient(#405742,#263b2d);background-size:144px 144px,auto;border:2px solid #b18a52;box-shadow:inset 0 0 0 2px #1d3124,0 3px 0 #6a5130;color:#f6e2af;font:700 11px var(--material-sans,system-ui);letter-spacing:.04em}
.journal-track:hover:not(:disabled){filter:brightness(1.15)}.journal-track:disabled{opacity:.75;cursor:default}
.journal-trace-page{flex:1;min-height:0;padding:25px 32px;overflow:auto;background-image:url('./assets/ui/paper-fibres.svg'),linear-gradient(#e9d5ab,#d5bc90);background-size:180px 180px,auto}
#notebook .journal-trace-page>p{margin:0 0 20px;max-width:760px;color:#65513a;font-size:13px}
#notebookEntries{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.journal-trace-page .notebook-entry{min-height:175px}
.journal-footer{display:flex;align-items:center;gap:8px;flex:none;min-height:42px;padding:7px 28px;background:#283a2c;border-top:2px solid #a88753;color:#d5c39d;font:11px var(--material-sans,system-ui)}
.journal-footer img{width:21px;height:21px;object-fit:contain}.journal-footer kbd{margin-left:auto;background:#182a20;border-color:#b89761;color:#f4dda9}
@media(max-height:740px) and (min-width:960px){.hud-left{top:94px;gap:12px}.hud-left .quest{padding-top:13px;padding-bottom:11px}.journal-heading{min-height:100px;padding-top:15px;padding-bottom:12px}.journal-detail{padding-top:22px}}
@media(max-width:950px){.journal-page{grid-template-columns:230px minmax(0,1fr)}.journal-detail{padding:24px}.journal-status{right:25px}.hud-left{left:24px;top:95px}}
@media(prefers-reduced-motion:reduce){.quest-progress-track i,.journal-detail-rail i,.journal-list-rail b,.journal-quest-item{transition:none}}

/* Même langage visuel que l'arbre de compétences : cuir, cuivre et étapes reliées. */
#notebook .journal-tabs{background:#24382d;border-bottom-color:#aa8350}
#notebook .journal-tabs button{color:#dbc8a0;border-right-color:#b8955c35}
#notebook .journal-tabs button[aria-selected=true]{background-image:url('./assets/ui/leather-grain.svg'),linear-gradient(#526746,#2e4937);background-size:144px 144px,auto;color:#fff0c5;box-shadow:inset 0 3px #e0bd75,inset 0 -3px #9c7744}
#notebook .journal-page{background-image:url('./assets/ui/leather-grain.svg'),radial-gradient(circle at 75% 25%,#314b39,#172d25 75%);background-size:144px 144px,auto}
#notebook .journal-quest-list{background:linear-gradient(90deg,#172a22,#294033);border-right:2px solid #9c7b4c}
#notebook .journal-quest-item{background:#263d30;border:1px solid #6e805d;box-shadow:inset 0 0 0 2px #1c3025,0 3px 0 #101f19;color:#e4d6b2}
#notebook .journal-quest-item:hover,#notebook .journal-quest-item.selected{background:#3b563e;border-color:#c2a169;box-shadow:inset 0 0 0 2px #223a2b,0 0 0 2px #d7b77b75,0 4px 12px #0c1a14}
#notebook .journal-quest-item small{color:#bea677}#notebook .journal-quest-item strong{color:#f3e5c0}#notebook .journal-quest-item>span{color:#d0bb91}
#notebook .journal-detail{color:#e9d7b0;scrollbar-color:#ad8d58 #1e3429}
#notebook .journal-detail::before{border-color:#b99a6459}
#notebook .journal-detail-eyebrow{color:#c5a66e}#notebook .journal-detail h3{color:#f4e3bd}#notebook .journal-summary{color:#d6c8aa}
#notebook .journal-status{color:#f3d8a2;background:#51492f;border-color:#bd995c}#notebook .journal-detail.ready .journal-status{color:#fff0c2;background:#726039;border-color:#e0b668}#notebook .journal-detail.completed .journal-status{color:#d3ecd0;background:#345b44;border-color:#85b68b}
#notebook .journal-current{border-color:#b7955d;background-image:url('./assets/ui/leather-grain.svg'),linear-gradient(120deg,#3d5a42,#254031)}
#notebook .journal-detail-progress{color:#cdb589}
.journal-route{margin:14px 0 0;padding:15px 17px 17px;border:1px solid #9a7b4b;background:linear-gradient(135deg,#22392d,#192e25);box-shadow:inset 0 0 0 2px #12271f,0 3px 0 #101f19}
.journal-route-label,.journal-step-preview small{display:block;color:#d1b276;font:700 10px var(--material-sans,system-ui);letter-spacing:.13em}
.journal-step-list{display:flex;align-items:stretch;gap:0;margin:16px 0 14px;padding:0;overflow-x:auto}
.journal-step{position:relative;display:flex;flex:1 0 125px;flex-direction:column;align-items:center;gap:7px;min-height:112px;padding:4px 10px 10px;background:transparent;border:0;color:#aaaf9e;text-align:center;cursor:pointer}
.journal-step:not(:last-child)::after{content:'';position:absolute;z-index:0;left:calc(50% + 22px);right:calc(-50% + 22px);top:24px;border-top:3px solid #6c7259}
.journal-step.done:not(:last-child)::after{border-color:#c5a364}
.journal-step-mark{position:relative;z-index:1;display:grid;place-items:center;width:43px;height:43px;flex:none;border:3px double #929072;border-radius:50%;background:radial-gradient(circle at 35% 27%,#586849,#283b30);box-shadow:0 0 0 4px #172d24,0 5px 9px #0b1a14;color:#e9dcba;font:700 16px var(--material-serif,Georgia,serif);transition:transform .18s,box-shadow .18s}
.journal-step:hover .journal-step-mark,.journal-step.selected .journal-step-mark{transform:scale(1.08);box-shadow:0 0 0 4px #172d24,0 0 18px #d8b7758c}
.journal-step.current .journal-step-mark{border-color:#f0cb7b;background:radial-gradient(circle at 35% 30%,#ad894b,#5d5834)}
.journal-step.done .journal-step-mark{border-color:#a8c49b;background:radial-gradient(circle at 35% 30%,#73996c,#345e49)}
.journal-step-name{color:#e4d7b8;font:600 11px/1.25 var(--material-sans,system-ui)}.journal-step small{margin:0;color:#c6ad7a;font-size:10px}
.journal-step.selected .journal-step-name{color:#ffedbd}
.journal-step-preview{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:11px 14px;border:1px solid #9f8556;background:#354d37;color:#efe0b7}
.journal-step-preview small{grid-column:1/-1}.journal-step-preview strong{font:600 15px var(--material-serif,Georgia,serif)}.journal-step-preview span{color:#f2cf8e;font:700 11px var(--material-sans,system-ui)}
#notebook .journal-rewards{border-top-color:#b99a6469}#notebook .journal-rewards small{color:#c7ad7a}#notebook .journal-rewards span{background:#344a36;color:#f1dfb4;border-color:#a98a55}
.dialogue-quest[hidden]{display:none}.dialogue-quest{position:relative;margin:0 0 18px;padding:14px 17px 16px;border:2px solid #b79056;background-image:url('./assets/ui/leather-grain.svg'),linear-gradient(120deg,#344c39,#1d3529);background-size:144px 144px,auto;box-shadow:inset 0 0 0 3px #172c22,0 4px 0 #8f7046}
.dialogue-quest::before{content:'◆';position:absolute;right:13px;top:10px;color:#e3bd77;font-size:16px}.dialogue-quest.ready::before{content:'✓';color:#a9e1a5}.dialogue-quest.active::before{content:'•••';color:#b0d3de}.dialogue-quest.completed::before{content:'✓';color:#8da987}
.dialogue-quest small{display:block;color:#d9bb79;font:700 10px var(--material-sans,system-ui);letter-spacing:.13em}.dialogue-quest strong{display:block;margin:5px 25px 0 0;color:#fff0c6;font:600 20px var(--material-serif,Georgia,serif)}
#dialogue .dialogue-quest p{margin:7px 0 0;color:#eadfbd;font:12px/1.5 var(--material-sans,system-ui)}
.dialogue-quest-action{margin-top:12px;padding:9px 15px;border:1px solid #e5c27e;background:linear-gradient(#b38d4e,#715735);color:#fff4d7;font:700 11px var(--material-sans,system-ui);letter-spacing:.04em;cursor:pointer}.dialogue-quest-action:hover{filter:brightness(1.15)}
@media(prefers-reduced-motion:reduce){.journal-step-mark{transition:none}}

/* Repères peints du carnet, issus de la même collection que la sacoche et les talents. */
#notebook .journal-tabs button{display:inline-flex;align-items:center;gap:9px;min-height:48px;transition:background .18s,color .18s}
#notebook .journal-tabs button::before{content:'';display:inline-block;width:25px;height:25px;flex:none;background-size:contain;background-position:center;background-repeat:no-repeat;filter:drop-shadow(0 2px 2px #0008)}
#notebook #journalQuestsTab::before{background-image:url('./assets/ui/icons/quest.png')}
#notebook #journalTracesTab::before{background-image:url('./assets/ui/icons/eye.png')}
#notebook .journal-tabs span{margin-left:auto}
#notebook .journal-quest-item{min-height:93px;padding-left:55px;background-image:url('./assets/ui/leather-grain.svg'),linear-gradient(140deg,#314b37,#223a2c);background-size:144px 144px,auto;transition:transform .17s,border-color .17s,box-shadow .17s}
#notebook .journal-quest-item.selected{transform:translateX(4px)}
.journal-list-icon{position:absolute;left:13px;top:16px;width:32px;height:32px;object-fit:contain;filter:drop-shadow(0 3px 3px #0009)}
#notebook .journal-quest-item.ready .journal-list-icon{filter:drop-shadow(0 0 7px #abdf9a)}
#notebook .journal-status{display:inline-flex;align-items:center;gap:6px}
.journal-status img{width:20px;height:20px;object-fit:contain}
.journal-current{padding-left:66px}
.journal-current-icon{position:absolute;left:20px;top:50%;width:32px;height:32px;object-fit:contain;transform:translateY(-50%);filter:drop-shadow(0 2px 4px #0009)}
.journal-step-icon{width:25px;height:25px;object-fit:contain;filter:drop-shadow(0 1px 2px #0009)}
#notebook .journal-rewards span{display:inline-flex;align-items:center;gap:6px;padding:5px 10px}
.journal-rewards img{width:25px;height:25px;object-fit:contain}
.journal-rewards b{font-weight:700}
#notebook .journal-trace-page{background-image:url('./assets/ui/leather-grain.svg'),linear-gradient(140deg,#243b2d,#1a3026);background-size:144px 144px,auto}
#notebook .journal-trace-page>p{color:#dbc9a5}
#notebook .journal-trace-page .notebook-entry{position:relative;min-height:210px;padding:18px 19px;border:2px solid #ad8c59;background-image:url('./assets/ui/paper-fibres.svg'),linear-gradient(140deg,#ead7b1,#cbb187);background-size:180px 180px,auto;box-shadow:inset 0 0 0 3px #f2e1bf,0 5px 0 #102219}
#notebook .journal-trace-page .notebook-entry.undiscovered{filter:saturate(.65);opacity:.76}
.journal-trace-icon{float:right;width:38px;height:38px;margin:-4px -3px 5px 8px;object-fit:contain;filter:drop-shadow(0 2px 3px #3b2a1988)}
.journal-trace-label{display:block;margin:0 0 8px;color:#87643a;font:700 9px var(--material-sans,system-ui);letter-spacing:.15em}
#notebook .journal-trace-page .notebook-entry h3{color:#42301e}
#notebook .journal-trace-page .notebook-entry p{color:#62503a}
#notebook .journal-track:focus-visible,#notebook .journal-step:focus-visible,#notebook .journal-quest-item:focus-visible,#notebook .journal-tabs button:focus-visible{outline:2px solid #f6d58d;outline-offset:2px}
@media(prefers-reduced-motion:reduce){#notebook .journal-tabs button,#notebook .journal-quest-item{transition:none}}
.journal-step.skipped{opacity:.55}.journal-step.skipped .journal-step-name{text-decoration:line-through}
