/* FRAGMENTS — fouille des pièces, trouvailles, feuille de fouille, Dossier du jour. */
/* ================= v1.1 : FOUILLE ================= */
.pview { display: flex; flex-direction: column; gap: 10px; }
.seg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 12px; background: rgba(0, 0, 0, .28); box-shadow: inset 0 0 0 1px var(--rule); }
.seg button { min-height: 44px; border-radius: 9px; font-weight: 800; font-size: 17px; color: var(--chalk-dim); display: flex; align-items: center; justify-content: center; gap: 8px; }
.seg button[aria-selected='true'] { background: var(--desk-3); color: var(--chalk); box-shadow: 0 2px 0 rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .06); }
.seg .count { min-width: 24px; height: 24px; padding: 0 6px; border-radius: 12px; background: var(--glow); color: #241a08; font-size: 15px; display: inline-grid; place-items: center; }

.scene-wrap { position: relative; border-radius: 14px; overflow: hidden; background: #000; box-shadow: 0 0 0 1.5px var(--rule), 0 18px 34px -16px #000; }
.scene-wrap::after { content: ''; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 50px rgba(0, 0, 0, .7); border-radius: 14px; }
.scene { display: block; width: 100%; height: auto; touch-action: manipulation; }
.zone-name { position: absolute; left: 10px; top: 8px; padding: 3px 10px; border-radius: 6px; background: rgba(0, 0, 0, .55); font-family: var(--f-stencil); font-weight: 700; font-size: 16px; letter-spacing: .04em; color: var(--chalk); pointer-events: none; z-index: 1; }
.hs { cursor: pointer; outline: none; }
.hs:focus-visible { outline: 2px solid var(--glow); outline-offset: 2px; }
.hs .hit { fill: transparent; }
.hs .ring { fill: rgba(255, 210, 140, .06); stroke: var(--glow); stroke-width: 1.4; stroke-dasharray: 3 4; opacity: .75; transform-box: fill-box; transform-origin: center; animation: hs-breathe 2.6s ease-in-out infinite; }
.hs .glint { fill: #fff6dc; filter: drop-shadow(0 0 3px var(--glow)); animation: glint 2.6s ease-in-out infinite; }
.hs:nth-of-type(2n) .ring, .hs:nth-of-type(2n) .glint { animation-delay: -1.3s; }
.hs .pad { fill: none; stroke: var(--glow); stroke-width: 1.6; stroke-linejoin: round; }
.hs .mark { fill: none; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.hs.got .ring { stroke: var(--ok); stroke-dasharray: none; fill: rgba(143, 209, 138, .14); animation: none; opacity: 1; }
.hs.got .mark { stroke: var(--ok); }
.hs.empty .ring { stroke: var(--chalk-dim); stroke-dasharray: none; fill: rgba(0, 0, 0, .35); animation: none; opacity: .6; }
.hs.empty .mark { stroke: var(--chalk-dim); }
.hs:focus-visible .ring { stroke-width: 3; opacity: 1; }
@keyframes hs-breathe { 0%, 100% { transform: scale(1); opacity: .55; } 50% { transform: scale(1.08); opacity: .95; } }
@keyframes glint { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }

.rule { margin: 0; font-size: 16px; color: var(--chalk-dim); }
.spots { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.spot { text-align: left; padding: 9px 12px; border-radius: 10px; background: var(--desk-2); box-shadow: inset 0 0 0 1.5px var(--rule); min-height: 52px; }
.spot span { display: block; font-weight: 800; font-size: 16px; line-height: 1.15; }
.spot small { display: block; font-size: 14px; color: var(--glow); font-weight: 600; }
.spot.done small { color: var(--chalk-dim); }
.spot.got { box-shadow: inset 0 0 0 1.5px rgba(143, 209, 138, .6); }
.spot.got small { color: var(--ok); }
.spot:active { transform: translateY(1px); }
.progress { margin: 0; text-align: center; font-size: 15px; color: var(--chalk-dim); }

/* trouvailles */
.inv-bar { display: grid; grid-template-columns: 52px 1fr 52px; align-items: center; gap: 8px; }
.navbtn { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--desk-3); box-shadow: inset 0 0 0 1.5px var(--rule), 0 4px 10px -6px #000; color: var(--chalk); }
.navbtn svg { width: 26px; height: 26px; stroke: currentColor; fill: none; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.navbtn.next svg { transform: scaleX(-1); }
.navbtn[disabled] { opacity: .3; }
.navbtn:not([disabled]):active { background: var(--glow); color: #241a08; }
.inv-pos { text-align: center; line-height: 1.15; }
.inv-pos b { display: block; font-family: var(--f-stencil); font-weight: 900; font-size: 22px; color: var(--glow); }
.inv-pos small { color: var(--chalk-dim); font-size: 14px; }
.inv-dots { display: flex; justify-content: center; gap: 4px; margin-top: 2px; }
.inv-dots .dot { width: 28px; height: 28px; position: relative; }
.inv-dots .dot::after { content: ''; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px; border-radius: 50%; background: var(--rule); transition: transform .2s, background .2s; }
.inv-dots .dot.on::after { background: var(--glow); transform: scale(1.35); }
.inv-doc { margin-top: 10px; padding: 4px 2px 10px; touch-action: pan-y; animation: doc-in .28s ease-out; }
@keyframes doc-in { from { opacity: 0; transform: translateY(8px) rotate(-.6deg); } }
.inv-empty { text-align: center; padding: 30px 10px; color: var(--chalk-dim); border: 1.5px dashed var(--rule); border-radius: 14px; }
.inv-empty p:first-child { font-family: var(--f-stencil); font-weight: 700; font-size: 24px; color: var(--chalk); margin: 0 0 6px; }
.inv-empty .btn { max-width: 220px; margin: 14px auto 0; }

/* feuille de fouille */
.sheet-wrap { position: fixed; inset: 0; z-index: 55; display: flex; align-items: flex-end; justify-content: center; background: rgba(4, 5, 3, .66); animation: fade .2s; }
.sheet { width: 100%; max-width: 560px; padding: 22px 20px calc(22px + var(--safe-b)); border-radius: 20px 20px 0 0; background: var(--desk-2); box-shadow: 0 -1px 0 var(--rule), 0 -20px 40px -10px #000; animation: sheet-up .28s cubic-bezier(.2, .9, .3, 1); }
@keyframes sheet-up { from { transform: translateY(60%); } }
.sheet h3 { margin: 0 0 12px; font-family: var(--f-stencil); font-weight: 900; font-size: 28px; }
.sheet p { color: var(--chalk-dim); margin: 0 0 14px; }
.sheet .row { margin-top: 14px; }
.search-anim { position: relative; height: 92px; border-radius: 12px; overflow: hidden; background: #0b0d0a; display: grid; place-items: center; color: var(--chalk-dim); font-weight: 600; }
.search-anim .beam { position: absolute; top: -40%; width: 120px; height: 180%; background: radial-gradient(closest-side, rgba(255, 220, 160, .55), transparent); animation: beam .75s ease-in-out; left: -30%; filter: blur(2px); }
.search-anim span { position: relative; }
@keyframes beam { 0% { left: -30%; } 50% { left: 70%; } 100% { left: 25%; } }
.flavor { font-family: var(--f-type); font-size: 17px; color: var(--paper) !important; padding: 12px 14px; border-left: 3px solid var(--rule); background: rgba(0, 0, 0, .25); }
.flavor.nothing { font-family: var(--f-stencil); font-weight: 700; font-size: 26px; text-align: center; border: 0; background: none; color: var(--chalk-dim) !important; }
.found-title { font-family: var(--f-stencil); font-weight: 900; font-size: 22px; color: var(--ok); margin-bottom: 8px; }
.tag { padding: 12px 14px; margin-bottom: 8px; color: var(--ink); background: var(--paper); border-radius: 2px; transform: rotate(-.6deg); box-shadow: 0 10px 18px -12px #000; }
.tag:nth-child(odd) { transform: rotate(.5deg); }
.tag b { display: block; font-family: var(--f-type); font-size: 16px; }
.tag small { font-family: var(--f-type); color: var(--ink-soft); }
.tag.note { background: #f1e9a8; } .tag.blueprint { background: var(--blue); color: var(--blue-line); } .tag.blueprint small { color: var(--blue-line); }
.tag.tarot { background: #1d1626; color: #ecd9a4; } .tag.tarot small { color: rgba(236, 217, 164, .7); } .tag.telex { background: #ece9df; } .tag.ticket { background: #e7d6a8; }
.hold { position: relative; width: 100%; height: 64px; margin-bottom: 10px; border-radius: 14px; overflow: hidden; background: #0b0d0a; box-shadow: inset 0 0 0 2px var(--glow); color: var(--glow); font-weight: 800; font-size: 19px; user-select: none; -webkit-user-select: none; touch-action: none; }
.hold .fill { position: absolute; inset: 0; width: 0; background: var(--glow); }
.hold.holding .fill { width: 100%; transition: width .9s linear; }
.hold .lbl { position: relative; mix-blend-mode: difference; color: #fff; }

/* ================= Dossier du jour ================= */
.folder.daily { background: linear-gradient(180deg, #e2c98f, #cfae6c); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 0 0 2px rgba(184, 50, 42, .35), 0 12px 24px -12px rgba(0, 0, 0, .8); overflow: visible; }
.folder.daily .stamp {
  position: absolute; right: 58px; top: -6px; transform: rotate(-9deg); padding: 1px 8px; border: 3px double var(--red); color: var(--red);
  font: normal 900 18px/1.1 var(--f-stencil); letter-spacing: .04em; opacity: .82; mix-blend-mode: multiply; pointer-events: none;
  animation: stamp-in .5s cubic-bezier(.2, 1.6, .4, 1) .3s backwards;
}
@keyframes stamp-in { from { transform: rotate(-30deg) scale(2.2); opacity: 0; } }
.flame { display: inline-flex; align-items: center; gap: 2px; margin-left: 8px; font-weight: 800; color: #8a2a1f; white-space: nowrap; }
.flame svg { width: 18px; height: 18px; fill: var(--red); stroke: #6d1d15; stroke-width: 1.2; }
.folder .flame svg { grid-row: auto; grid-column: auto; width: 18px; height: 18px; fill: var(--red); stroke: #6d1d15; stroke-width: 1.2; }
.daily-tag { color: var(--glow); margin: 6px 0 0; letter-spacing: .12em; }
.streak { display: grid; justify-items: center; gap: 2px; margin: 0 0 14px; padding: 10px 12px; border: 1px dashed var(--rule); border-radius: 10px; }
.streak span { font-weight: 800; font-size: 18px; color: var(--chalk); }
.streak .flame { margin: 0; font-size: 26px; color: var(--glow); }
.streak .flame svg { width: 28px; height: 28px; fill: var(--glow); stroke: var(--glow-dim); }
.streak small { color: var(--chalk-dim); font-size: 15px; }
.share-ta { width: 100%; margin-bottom: 14px; padding: 10px; border-radius: 8px; border: 1px solid var(--rule); background: rgba(0, 0, 0, .35); color: var(--paper); font: 15px/1.4 var(--f-type); resize: none; }
.share-ta:focus { outline: 3px solid var(--glow); outline-offset: 2px; }
.share-text { white-space: pre-line; overflow-wrap: anywhere; }