.detw { --dw-gold:#d8ad59; --dw-violet:#8874eb; width:100%; height:100%; overflow:hidden; color:#f5f3ec; background:#0e1525; font-family:Inter,system-ui,sans-serif; }
.detw-empty { display:flex; width:100%; height:100%; flex-direction:column; align-items:center; justify-content:center; color:var(--text-3,#8c94a4); background:linear-gradient(145deg,#111a2c,#17162a); }
.detw-empty>span { display:grid; place-items:center; width:42px; height:42px; margin-bottom:9px; border:1px solid #d8ad59; border-radius:50%; color:#e8c77f; font-family:Georgia,serif; font-weight:900; }
.detw-empty>b { color:#f3f1e9; font-family:Georgia,serif; }
.detw-empty>small { margin-top:3px; font-size:clamp(.46rem,1.6cqi,.65rem); }
.detw-case { padding:clamp(14px,4cqi,28px); background:radial-gradient(circle at 87% 3%,rgba(136,116,235,.3),transparent 38%),linear-gradient(145deg,#172238,#0b1120); }
.detw-case>header { display:flex; align-items:center; }
.detw-case>header>span { display:grid; place-items:center; width:clamp(30px,8cqi,46px); aspect-ratio:1; border:1px solid var(--dw-gold); border-radius:50%; color:#eac985; font-family:Georgia,serif; font-size:clamp(.55rem,2cqi,.82rem); font-weight:900; }
.detw-case>header>small { margin-left:auto; color:#77dcb9; font-size:clamp(.42rem,1.5cqi,.62rem); font-weight:900; letter-spacing:.12em; }
.detw-case main { margin-top:clamp(12px,3cqi,22px); }
.detw-case main>em { color:var(--dw-gold); font-size:clamp(.44rem,1.5cqi,.65rem); font-style:normal; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.detw-case h2 { margin:.25em 0 .1em; font-family:Georgia,serif; font-size:clamp(1.35rem,5.2cqi,3.2rem); line-height:.98; letter-spacing:-.035em; }
.detw-case main>p { margin:0; color:#aeb6c7; font-size:clamp(.55rem,1.8cqi,.82rem); }
.detw-bar { height:clamp(4px,1cqi,7px); margin-top:clamp(12px,3cqi,22px); overflow:hidden; border-radius:9px; background:rgba(255,255,255,.1); }
.detw-bar i { display:block; height:100%; background:linear-gradient(90deg,#bc8b34,#efd293); }
.detw-case footer { display:flex; gap:clamp(9px,3cqi,25px); margin-top:8px; color:#818b9e; font-size:clamp(.42rem,1.4cqi,.62rem); text-transform:uppercase; }
.detw-case footer b { color:#fff; }
.detw-evidence,.detw-feed { padding:clamp(12px,3.2cqi,24px); background:linear-gradient(145deg,#121a2a,#0c1220); }
.detw-evidence>header { display:flex; align-items:center; }
.detw-evidence>header>span,.detw-feed>header { display:flex; flex-direction:column; }
.detw-evidence header small,.detw-feed header small { color:var(--dw-gold); font-size:clamp(.4rem,1.4cqi,.6rem); font-weight:900; letter-spacing:.15em; }
.detw-evidence header b,.detw-feed header b { margin-top:3px; font-family:Georgia,serif; font-size:clamp(.9rem,3cqi,1.6rem); }
.detw-evidence header em { margin-left:auto; color:#e5c47e; font-family:Georgia,serif; font-size:clamp(.8rem,3cqi,1.5rem); font-style:normal; }
.detw-evidence main { display:grid; height:calc(100% - 42px); margin-top:9px; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.detw-evidence article { display:flex; min-width:0; padding:clamp(7px,2cqi,13px); gap:8px; overflow:hidden; border:1px solid rgba(255,255,255,.09); border-radius:9px; background:rgba(255,255,255,.035); }
.detw-evidence article>span { display:grid; place-items:center; width:clamp(24px,6cqi,38px); height:clamp(24px,6cqi,38px); flex:none; border:1px solid rgba(216,173,89,.45); border-radius:7px; color:#dfbd77; font-size:clamp(.4rem,1.4cqi,.6rem); }
.detw-evidence article>div { min-width:0; }
.detw-evidence article small { color:#818a9b; font-size:clamp(.35rem,1.2cqi,.52rem); text-transform:uppercase; }
.detw-evidence article b { display:block; overflow:hidden; margin:2px 0; font-family:Georgia,serif; font-size:clamp(.55rem,1.8cqi,.85rem); white-space:nowrap; text-overflow:ellipsis; }
.detw-evidence article p { display:-webkit-box; overflow:hidden; margin:0; color:#8f98a8; font-size:clamp(.38rem,1.25cqi,.56rem); line-height:1.35; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.detw-feed main { margin-top:8px; }
.detw-feed article { display:flex; gap:8px; align-items:flex-start; padding:clamp(5px,1.7cqi,10px) 0; border-top:1px solid rgba(255,255,255,.07); }
.detw-feed article>i { width:6px; height:6px; margin-top:5px; flex:none; border-radius:50%; background:var(--dw-violet); box-shadow:0 0 8px var(--dw-violet); }
.detw-feed article b { display:block; font-size:clamp(.45rem,1.5cqi,.68rem); }
.detw-feed article p { overflow:hidden; margin:2px 0 0; color:#858fa0; font-size:clamp(.38rem,1.3cqi,.57rem); white-space:nowrap; text-overflow:ellipsis; }
.detw-placeholder { display:flex; width:100%; height:100%; flex-direction:column; align-items:center; justify-content:center; color:#8992a2; }
.detw-placeholder>span { display:grid; place-items:center; width:37px; height:37px; margin-bottom:7px; border:1px solid rgba(255,255,255,.14); border-radius:50%; font-family:Georgia,serif; }
.detw-reveal { position:relative; display:flex; padding:clamp(15px,4cqi,30px); flex-direction:column; align-items:center; justify-content:center; text-align:center; background:radial-gradient(circle at 50% 0,rgba(216,173,89,.28),transparent 34%),linear-gradient(145deg,#151d31,#111226); }
.detw-reveal>span { display:grid; place-items:center; width:clamp(34px,9cqi,55px); aspect-ratio:1; border:1px solid var(--dw-gold); border-radius:50%; color:#e8c77f; font-family:Georgia,serif; font-size:clamp(.55rem,2cqi,.8rem); font-weight:900; }
.detw-reveal>small { margin-top:10px; color:var(--dw-gold); font-size:clamp(.4rem,1.5cqi,.62rem); font-weight:900; letter-spacing:.16em; }
.detw-reveal h2 { max-width:90%; margin:.25em 0; font-family:Georgia,serif; font-size:clamp(1.2rem,5cqi,2.8rem); line-height:1; }
.detw-reveal p { display:-webkit-box; max-width:92%; overflow:hidden; margin:0; color:#aab2c1; font-family:Georgia,serif; font-size:clamp(.55rem,1.8cqi,.9rem); line-height:1.4; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.detw-reveal footer { margin-top:12px; color:#818a9a; font-size:clamp(.42rem,1.4cqi,.62rem); }
.detw-reveal footer b { color:#edcd8d; }
.detw-reveal.is-locked { filter:saturate(.55); }
.detw.is-compact { padding:clamp(8px,2cqi,15px); }
.detw-case.is-compact main { margin-top:clamp(7px,1.8cqi,12px); }
.detw-case.is-compact .detw-bar { margin-top:clamp(7px,1.8cqi,12px); }
.detw-evidence.is-compact article { padding:clamp(5px,1.3cqi,8px); }
.detw-feed.is-compact article { padding:clamp(3px,1cqi,6px) 0; }
.detw-reveal.is-locked.is-minimal > span { opacity:.72; transform:scale(.82); }
.detw-reveal.is-locked.is-minimal h2 { font-size:clamp(.9rem,3.6cqi,1.8rem); }

.detw { --dw-gold:#c5964d; --dw-violet:#a33731; position:relative; color:#f6ecd9; background:#211e18; }
.detw:after { content:""; position:absolute; inset:0; pointer-events:none; box-shadow:inset 0 0 0 1px rgba(214,179,111,.18),inset 0 0 28px rgba(0,0,0,.16); }
.detw-empty { background:repeating-linear-gradient(4deg,#28241d 0 5px,#24211b 5px 10px); }
.detw-empty>span { border:2px double #c5964d; border-radius:2px; }
.detw-case { overflow:visible; padding:clamp(18px,4cqi,30px); color:#2c241b; background:linear-gradient(145deg,#f0deb6,#d5b77e); box-shadow:inset 0 0 0 1px #b99a63; }
.detw-case:before { content:""; position:absolute; left:8%; top:-1px; width:36%; height:10%; background:#c4a269; clip-path:polygon(0 100%,6% 0,94% 0,100% 100%); }
.detw-case__tab { position:absolute; left:11%; top:2.3%; color:#5b4630; font:900 clamp(.36rem,1.25cqi,.55rem)/1 sans-serif; font-style:normal; letter-spacing:.12em; }
.detw-case>header>span { color:#8f322c; border:2px double #9d3c34; border-radius:2px; transform:rotate(-3deg); }
.detw-case>header>small { color:#3f715a; font-family:inherit; }
.detw-case main>em { color:#8f322c; font-family:inherit; }
.detw-case h2 { color:#2c241b; }
.detw-case main>p,.detw-case footer { color:#72634e; }
.detw-case footer b { color:#30271e; }
.detw-bar { border-radius:1px; background:rgba(77,55,30,.16); }
.detw-bar i { background:repeating-linear-gradient(135deg,#9d342e 0 8px,#c36455 8px 16px); }
.detw-stamp { position:absolute; right:5%; bottom:7%; padding:4px 7px; color:rgba(143,50,44,.54); border:2px solid currentColor; font:900 clamp(.35rem,1.2cqi,.52rem)/1 sans-serif; letter-spacing:.1em; transform:rotate(-5deg); }
.detw-evidence { border:clamp(5px,1.5cqi,10px) solid #3b2b1f; padding:clamp(10px,2.5cqi,20px); background:radial-gradient(circle at 12% 22%,rgba(57,34,15,.32) 0 1px,transparent 2px),repeating-linear-gradient(27deg,transparent 0 6px,rgba(75,43,18,.035) 7px 8px),linear-gradient(135deg,#aa7747,#8f5b36); background-size:17px 19px,auto,auto; box-shadow:inset 0 0 0 2px #715033; }
.detw-evidence>header { position:relative; z-index:3; color:#f4e6ca; }
.detw-evidence header small { color:#e5c47f; font-family:inherit; }
.detw-evidence header em { color:#f0d29a; }
.detw-evidence main { position:relative; z-index:1; }
.detw-evidence article { position:relative; z-index:2; overflow:visible; color:#2c241b; border:0; border-radius:1px; background:linear-gradient(145deg,#fff5d6,#e9d4a6); box-shadow:3px 4px 0 rgba(61,36,17,.22); transform:rotate(-.6deg); }
.detw-evidence article:nth-of-type(even) { transform:rotate(.7deg); }
.detw-evidence article>span { color:#f4e9d1; border-color:#2d2922; border-radius:50%; background:#2d2922; }
.detw-evidence article small { color:#923a33; font-family:inherit; }
.detw-evidence article b { color:#2c241b; }
.detw-evidence article p { color:#766854; }
.detw-pin { position:absolute; left:50%; top:-5px; width:10px; height:10px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#ff9b86 0 16%,#aa352f 32% 65%,#651a17 66%); box-shadow:0 3px 3px rgba(47,24,12,.32); transform:translateX(-50%); }
.detw-thread { position:absolute; z-index:1; width:56%; height:2px; background:#9f2f29; box-shadow:0 1px 1px rgba(50,20,11,.35); transform-origin:left center; }
.detw-thread.one { left:20%; top:29%; transform:rotate(21deg); }
.detw-thread.two { left:21%; top:72%; transform:rotate(-19deg); }
.detw-feed { padding:clamp(14px,3.2cqi,25px); color:#2d261e; background:repeating-linear-gradient(#fffaf0 0 24px,#ddd4c3 25px,#fffaf0 26px); }
.detw-feed:before { content:"JOURNAL"; position:absolute; right:6%; top:5%; color:rgba(145,54,47,.58); border:2px solid currentColor; padding:4px 6px; font:900 clamp(.32rem,1.1cqi,.48rem)/1 sans-serif; transform:rotate(3deg); }
.detw-feed header small { color:#933c35; font-family:inherit; }
.detw-feed header b,.detw-feed article b { color:#2d261e; }
.detw-feed article { border-color:rgba(91,67,39,.17); }
.detw-feed article>i { background:#a33731; box-shadow:none; }
.detw-feed article p { color:#776a58; }
.detw-reveal { background:radial-gradient(circle at 50% 0,rgba(196,147,72,.24),transparent 34%),repeating-linear-gradient(4deg,#28241d 0 5px,#24211b 5px 10px); }
.detw-reveal>span { border:2px double var(--dw-gold); border-radius:2px; transform:rotate(-3deg); }
