/* Case Night: an office incident file. Desk green, paper, manila, carbon pink, stamp red. System fonts only (no third-party requests). */
:root{--desk:#24443a;--paper:#fffdf6;--ink:#1c2230;--mut:#5b6472;--manila:#e2b866;--manila-lt:#f6e7c1;--slip:#f9d9de;--stamp:#c8102e;
--type:"American Typewriter","Rockwell","Courier Prime","Courier New",ui-monospace,serif;--text:"Avenir Next","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}
html{background:var(--desk)}
body{margin:0;color:var(--ink);font:1.0625rem/1.55 var(--text);-webkit-text-size-adjust:100%}
main{position:relative;max-width:40rem;margin:3.25rem auto 4rem;padding:2rem 1.75rem 2.5rem;background:var(--paper);border-radius:2px;box-shadow:0 1px 0 #0003,0 18px 40px -18px #0009}
main::before{content:"";position:absolute;inset:0 0 auto 0;height:.6rem;background:repeating-linear-gradient(90deg,var(--manila) 0 1.1rem,var(--paper) 1.1rem 1.5rem)}
@media(max-width:44rem){main{margin:3.25rem .6rem 2rem;padding:1.75rem 1.1rem 2rem}}
h1,h2,h3,.type{font-family:var(--type)}
h1{font-size:clamp(2rem,7.5vw,3rem);line-height:1.05;letter-spacing:-.01em;margin:.5rem 0 .75rem;font-weight:700}
h2{font-size:1.3rem;line-height:1.25;margin:2.25rem 0 .75rem;padding-bottom:.35rem;border-bottom:2px solid var(--ink);font-weight:700}
h3{font-size:1.05rem;margin:0 0 .25rem;font-weight:700}
p{margin:.6rem 0}.mut{color:var(--mut)}.small{font-size:.875rem}
a{color:inherit}
ol,ul{padding-left:1.3rem;margin:.6rem 0}li{margin:.4rem 0}
:focus-visible{outline:3px solid var(--stamp);outline-offset:2px}

/* form rows of the incident report */
.form{margin:1.25rem 0 0;border-top:2px solid var(--ink)}
.form div{display:grid;grid-template-columns:9.5rem 1fr;gap:.75rem;padding:.55rem 0;border-bottom:1px dashed #1c223066}
.form dt{color:var(--mut);font-size:.9rem;padding-top:.15rem}
.form dd{margin:0;font-family:var(--type);font-size:1.05rem}
@media(max-width:30rem){.form div{grid-template-columns:1fr;gap:0}}
.fileno{font-family:var(--type);font-size:.9rem;color:var(--mut);margin:0}
.stamp{float:right;margin:.9rem 0 .5rem 1rem;font:700 1.05rem/1 var(--type);letter-spacing:.14em;text-transform:uppercase;color:var(--stamp);border:3px double var(--stamp);padding:.45rem .6rem .35rem;border-radius:3px;transform:rotate(-7deg);opacity:.88;mix-blend-mode:multiply;animation:thunk .35s .25s cubic-bezier(.2,1.6,.4,1) both}
@keyframes thunk{from{transform:rotate(-7deg) scale(1.9);opacity:0}}
@media(prefers-reduced-motion:reduce){.stamp{animation:none}}
@media(max-width:30rem){.stamp{float:none;display:inline-block;margin:.5rem 0 0}}

/* buttons and fields */
button,.btn{font:600 1rem/1.2 var(--text);background:var(--stamp);color:#fff;border:2px solid var(--stamp);border-radius:3px;padding:.8rem 1.2rem;cursor:pointer;text-decoration:none;display:inline-block}
button.ghost,.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.off{background:transparent;color:var(--mut);border:2px dashed var(--mut);cursor:default}
.row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.buy{margin:1.5rem 0 0;padding:1rem 1.1rem 1.15rem;background:var(--manila-lt);border:1.5px solid var(--ink);border-radius:2px}
.price{font:700 1.75rem/1.1 var(--type);margin:0}
input{font:1.15rem var(--type);width:100%;padding:.7rem .2rem;border:0;border-bottom:2px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);text-transform:uppercase;margin:.4rem 0}
input::placeholder{color:#1c223066;text-transform:none}
label{display:block;color:var(--mut);font-size:.9rem}
.err{color:var(--stamp);font-weight:600;min-height:1.5em;margin:.3rem 0}
.lang{position:absolute;top:.7rem;right:.8rem;z-index:2}
.lang button{padding:.35rem .7rem;font-size:.85rem;background:transparent;color:var(--paper);border-color:#fffdf680}

/* game sheets */
.card{border:1.5px solid var(--ink);border-radius:2px;padding:.9rem 1rem;margin:.9rem 0;background:var(--paper)}
.tag{font:.875rem var(--type);color:var(--mut);margin:0 0 .2rem}
.card.secret{background:var(--slip);border-style:dashed}
.card.secret .tag{color:var(--stamp);font-weight:700}
.card.ev{background:var(--manila-lt);padding-left:2.6rem;position:relative}
.card.ev::before{content:"";position:absolute;left:.85rem;top:1.05rem;width:.85rem;height:.85rem;border-radius:50%;background:var(--paper);border:1.5px solid var(--ink)}
.card.sealed{background:var(--manila);border-width:1.5px}
.card.sealed input{border-bottom-color:var(--ink)}
.who{font-family:var(--type);color:var(--mut);margin:0}
button.pick{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:.5rem;width:100%;text-align:left;margin:0;padding:.75rem .2rem;background:transparent;border:0;border-bottom:1px dashed #1c223066;border-radius:0;color:var(--ink);font-weight:400}
button.pick b{font-family:var(--type);font-size:1.05rem}
button.pick span{color:var(--mut);font-size:.875rem}
button.pick:hover{background:var(--manila-lt)}
footer{margin-top:2.5rem;padding-top:1rem;border-top:2px solid var(--ink)}
@media print{html{background:#fff}main{box-shadow:none;margin:0;max-width:none}main::before,.noprint,.lang{display:none}.card{break-inside:avoid}.pb{break-before:page}}