/* SPOT THE TRAP — noir case-file desk. Typewriter, red pen, desk lamp. */
.noir{--wood:#1B1A18;--paper:#F1E9D2;--paper2:#E6DBBF;--ink:#26231D;--pen:#D5281B;--tape:#E9C46A;--green:#2F7D4F;
  background:#0E0D0C;color:#EDE6D3;font-family:'Courier Prime',ui-monospace,monospace;font-weight:700}
.noir #app{background:radial-gradient(70% 45% at 50% 18%,rgba(255,214,140,.22),transparent 70%),repeating-linear-gradient(95deg,#262320 0 3px,#201D1A 3px 9px),#1B1A18}
.noir .screen{animation:fade .25s both}
.noir h1,.noir h2,.noir h3{font-family:'Special Elite','Courier Prime',monospace;font-weight:400;margin:0}
.noir .iconbtn{width:40px;height:40px;border-radius:6px;display:grid;place-items:center;background:#3A342C;color:#EDE6D3;box-shadow:0 3px 0 #0E0D0C;font-size:18px}
.noir .topbar{display:flex;align-items:center;gap:10px;padding-bottom:10px}.noir .grow{flex:1;min-width:0}
.noir .chip{background:var(--paper);color:var(--ink);padding:6px 10px;border-radius:4px;font-size:14px;box-shadow:0 3px 0 #0E0D0C}
.note{background:var(--tape);color:#3B2F00;font-family:'Permanent Marker',cursive;font-weight:400;font-size:16px;padding:6px 10px;transform:rotate(2.5deg);box-shadow:0 4px 8px rgba(0,0,0,.4)}
.note.low{background:#FF8C7A;color:#5A0A00;animation:wig .4s infinite alternate}@keyframes wig{to{transform:rotate(-2deg) scale(1.06)}}
.noir .scroll{flex:1;overflow:auto;min-height:0;padding:4px 2px 8px}
.noir .btn{display:inline-flex;align-items:center;justify-content:center;font-family:'Special Elite',monospace;font-size:20px;padding:14px 20px;border-radius:6px;background:var(--pen);color:#fff;box-shadow:0 5px 0 #7A130B;letter-spacing:.04em;transition:transform .08s}
.noir .btn:active{transform:translateY(4px);box-shadow:0 1px 0 #7A130B}
.noir .btn.big{width:100%;font-size:24px;padding:16px}
.noir .btn.ghost{background:#3A342C;color:#EDE6D3;box-shadow:0 5px 0 #0E0D0C}
/* file list */
.noir .sub{margin:0 0 14px;font-size:14px;line-height:1.45;color:#BDB49E}
.dlist{display:flex;flex-direction:column;gap:16px;padding:6px 2px}
.dc{position:relative;display:flex;gap:12px;align-items:center;text-align:left;width:100%;background:#D9B76B;color:#2A2110;border-radius:4px 14px 4px 4px;padding:16px 14px 14px;box-shadow:0 5px 0 #8E7332,0 12px 20px -8px rgba(0,0,0,.6);transform:rotate(var(--r,-.6deg));transition:transform .15s}
.dc:nth-child(even){--r:.8deg}.dc:nth-child(3n){--r:-1.2deg}
.dc:before{content:"";position:absolute;left:0;top:-10px;width:44%;height:12px;background:#D9B76B;border-radius:6px 6px 0 0}
.dc:active{transform:translateY(3px) rotate(0)}
.dc .ic{flex:0 0 46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:24px;background:#F3E3B4;border:2px dashed #8E7332}
.dc h3{font-size:20px}.dc p{margin:2px 0 0;font-size:12.5px;opacity:.75}
.dc .st{margin-left:auto;font-size:17px;color:var(--pen)!important;letter-spacing:1px;white-space:nowrap}
/* paper */
.paper{background-color:var(--paper);color:var(--ink);padding:22px 16px 14px;position:relative;box-shadow:0 14px 30px -10px rgba(0,0,0,.7);transform:rotate(-.3deg);margin-bottom:12px;background-image:repeating-linear-gradient(transparent 0 27px,rgba(70,60,40,.1) 27px 28px)}
.paper:before{content:"";position:absolute;right:16px;top:-14px;width:78px;height:24px;background:rgba(233,196,106,.85);transform:rotate(4deg)}
.paper:after{content:"";position:absolute;right:18px;bottom:24px;width:70px;height:70px;border-radius:50%;border:5px solid rgba(110,70,30,.12);pointer-events:none}
.paper h2{font-size:24px;text-align:center;border-bottom:2px solid var(--ink);padding-bottom:6px}
.paper .from{text-align:center;font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.6;margin:6px 0}
.paper .intro{font-size:13.5px;text-align:center;margin:0 0 12px;font-style:italic;opacity:.8}
.cl{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;padding:10px 10px 10px 6px;font-family:'Courier Prime',monospace;font-weight:700;font-size:15.5px;line-height:1.4;margin-bottom:6px;color:var(--ink);position:relative;border-radius:2px;transition:background .15s}
.cl .n{flex:0 0 24px;font-size:12px;opacity:.55;padding-top:3px}
.cl:active{background:rgba(0,0,0,.05)}
.cl.on{background:linear-gradient(transparent 52%,rgba(255,226,60,.6) 52% 92%,transparent 92%)}
.cl.on:before{content:"";position:absolute;inset:-3px -3px;border:3px solid var(--pen);border-radius:255px 15px 225px 15px/15px 225px 15px 255px;transform:rotate(-.6deg);animation:circle .3s ease-out both;pointer-events:none}
@keyframes circle{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.cl .why{display:block;font-weight:400;font-size:13px;color:#4A4333;margin-top:6px;line-height:1.35;background:rgba(255,255,255,.55);padding:6px 8px;border-left:3px solid var(--ink)}
.cl .why b{display:block;font-family:'Permanent Marker',cursive;font-weight:400;font-size:13px;color:var(--pen);margin-bottom:2px}
.cl.r-found:before,.cl.r-miss:before,.cl.r-false:before{content:"";position:absolute;inset:-3px;border:3px solid var(--green);border-radius:255px 15px 225px 15px/15px 225px 15px 255px;pointer-events:none}
.cl.r-miss:before{border-color:var(--pen);border-style:dashed}.cl.r-false:before{border-color:#7A7360;border-style:dotted}
.pstamp{position:absolute;right:4px;top:-12px;font-family:'Special Elite',monospace;font-size:15px;letter-spacing:.1em;padding:1px 8px;border:3px double currentColor;transform:rotate(-7deg);background:rgba(241,233,210,.95);animation:slam .35s cubic-bezier(.2,1.5,.4,1) both;z-index:2}
.r-found .pstamp{color:var(--green)}.r-miss .pstamp{color:var(--pen)}.r-false .pstamp{color:#7A7360}
@keyframes slam{from{opacity:0;transform:rotate(10deg) scale(2.6)}to{opacity:1;transform:rotate(-7deg) scale(1)}}
.tdock{padding:10px 0 2px}
.score-card{display:flex;align-items:center;gap:12px;background:var(--paper);color:var(--ink);padding:10px 14px;margin-bottom:10px;box-shadow:0 4px 0 #0E0D0C;transform:rotate(-.4deg)}
.score-card .stars{font-size:26px;letter-spacing:2px;color:var(--pen)!important}.score-card p{margin:0;font-size:13.5px;line-height:1.3}
.bigstamp{position:absolute;left:50%;top:40%;z-index:50;font-family:'Special Elite',monospace;font-size:56px;color:var(--pen);border:8px double var(--pen);padding:4px 18px;background:rgba(241,233,210,.9);pointer-events:none;animation:big .9s ease-out both}
@keyframes big{0%{opacity:0;transform:translate(-50%,-50%) rotate(-14deg) scale(4)}25%{opacity:1;transform:translate(-50%,-50%) rotate(-14deg) scale(1)}85%{opacity:1;transform:translate(-50%,-50%) rotate(-14deg) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) rotate(-14deg) scale(1)}}
.noir.shake #app{animation:shk .35s}@keyframes shk{20%{transform:translate(-5px,3px)}40%{transform:translate(5px,-3px)}60%{transform:translate(-3px,2px)}}