/* Fonts are full Latin + Latin Extended subsets (Turkish, Spanish, Portuguese, German), one file per style. */
@font-face{font-family:Serif;src:url(fonts/serif-400.woff2) format('woff2');font-display:swap}
@font-face{font-family:Serif;font-weight:600;src:url(fonts/serif-600.woff2) format('woff2');font-display:swap}
@font-face{font-family:Serif;font-style:italic;src:url(fonts/serif-400i.woff2) format('woff2');font-display:swap}
@font-face{font-family:Corm;src:url(fonts/corm-400.woff2) format('woff2');font-display:swap}
@font-face{font-family:Corm;font-weight:600;src:url(fonts/corm-600.woff2) format('woff2');font-display:swap}
@font-face{font-family:Corm;font-style:italic;src:url(fonts/corm-400i.woff2) format('woff2');font-display:swap}
@font-face{font-family:Fell;src:url(fonts/corm-600.woff2) format('woff2');font-display:swap}
@font-face{font-family:FellSC;src:url(fonts/corm-600.woff2) format('woff2');font-display:swap}
@font-face{font-family:Type;src:url(fonts/type.woff2) format('woff2');font-display:swap}
@font-face{font-family:Hand;src:url(fonts/hand.woff2) format('woff2');font-display:swap}
@font-face{font-family:Pencil;src:url(fonts/pencil.woff2) format('woff2');font-display:swap}
/* VOICE: a detective's desk at night: leather blotter, lamp light, real paper you can pick up.
   IDEA: every surface is an object: manila folder, register, index cards, telegram, ID card, sealed envelope.
   COLOUR/TYPE: dark green desk; paper, manila and one stamp red; Cormorant for printed titles, Source Serif for reading, Special Elite for typed labels, Homemade Apple for signatures. */
:root{color-scheme:dark;--desk:#1d2420;--desk2:#252e29;--chalk:#e8e2d3;--chalk2:#a9a796;--paper:#f2ebda;--paper2:#e8dfc9;--manila:#d4bd8a;--manila2:#c2a771;--ink:#221d17;--mute:#6a6152;--line:#c4b89d;--red:#9b2318;--red2:#b8392a;--blue:#1f2f5c;--shadow:0 1px 1px rgba(0,0,0,.25),0 8px 18px -6px rgba(0,0,0,.55),0 30px 50px -30px rgba(0,0,0,.6)}
*{box-sizing:border-box;min-width:0}
html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--chalk);font:17px/1.6 Serif,Georgia,serif;overflow-x:clip;background:radial-gradient(1200px 700px at 28% -8%,rgba(255,214,150,.13),transparent 65%),radial-gradient(900px 600px at 100% 100%,rgba(0,0,0,.35),transparent 70%),url(desk.png) var(--desk);background-attachment:fixed,fixed,scroll;min-height:100vh}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
h1,h2,h3{font-family:Corm,Georgia,serif;font-weight:600;line-height:1.06;text-wrap:balance;margin:0 0 14px}
h1{font-size:clamp(40px,6.4vw,72px);letter-spacing:-.01em}
h2{font-size:clamp(30px,4vw,44px)}
h3{font-size:24px}
p{margin:0 0 14px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:max(5vw,18px)}
.narrow{max-width:760px;padding-block:clamp(28px,5vw,64px)}
.center{text-align:center}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:var(--paper);color:var(--ink);padding:8px 12px;z-index:99}
.note{font-size:15px;color:var(--chalk2)}
.kicker{font:14px/1.4 Type,monospace;color:var(--chalk2);letter-spacing:.04em;margin-bottom:10px}
:focus-visible{outline:3px solid #e2b04a;outline-offset:2px}

/* paper surfaces */
.paper,.sheet,.icard,.card-index,.licence,.idcard,.letter,.hall{background:url(paper.png) var(--paper);background-blend-mode:multiply;color:var(--ink);box-shadow:var(--shadow)}
.paper{padding:clamp(18px,3.5vw,36px);margin-bottom:22px;border-radius:1px}
.paper .note,.sheet .note,.icard p,.hall .note,.licence .note,.idcard .note{color:var(--mute)}
.paper .kicker{color:var(--mute)}

/* header */
.top{border-bottom:1px solid rgba(232,226,211,.12);background:rgba(10,14,12,.35);backdrop-filter:blur(2px)}
.bar{display:flex;flex-wrap:wrap;gap:8px 28px;align-items:center;justify-content:space-between;padding-block:12px}
.mark{text-decoration:none;display:flex;flex-direction:column}
.mark b{font:600 26px/1 Corm,serif;letter-spacing:.14em;text-transform:uppercase}
.mark small{font:12px/1.3 Type,monospace;color:var(--chalk2);margin-top:5px;letter-spacing:.03em}
nav{display:flex;flex-wrap:wrap;gap:2px 20px;align-items:center}
nav a{text-decoration:none;font-size:15px;padding:10px 0;min-height:44px;display:inline-flex;align-items:center;color:var(--chalk)}
nav a:hover{text-decoration:underline}
.lang select{font:15px Serif,serif;background:rgba(0,0,0,.25);border:1px solid rgba(232,226,211,.25);border-radius:3px;padding:8px 6px;min-height:40px;color:var(--chalk)}
.bell{color:#f1b9a8!important;font-weight:600}
.bell b{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--red2);color:#fff;font:600 13px Serif,serif;margin-left:6px;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 6px rgba(184,57,42,.0),0 0 0 3px rgba(184,57,42,.35)}}

/* buttons as paper tags */
.tag{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px 0 30px;border:0;border-radius:3px 10px 10px 3px;background:var(--manila);color:var(--ink);font:15px Type,monospace;letter-spacing:.04em;text-decoration:none;cursor:pointer;box-shadow:0 2px 0 rgba(0,0,0,.25),0 8px 16px -8px rgba(0,0,0,.6);transition:transform .15s}
.tag::before{content:"";position:absolute;left:11px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--desk);box-shadow:inset 0 1px 2px rgba(0,0,0,.6)}
.tag:hover{transform:translateY(-1px) rotate(-.6deg)}
.tag.red{background:var(--red);color:#fbeee6}
.tag.big{min-height:54px;font-size:17px;padding-inline:34px 26px}
.paper .tag::before,.licence .tag::before{background:var(--paper)}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,64px);align-items:center;padding-block:clamp(30px,6vw,84px)}
.hero h1{margin-bottom:22px}
.card-index{padding:22px 24px 18px;transform:rotate(-.8deg);max-width:560px;background-image:repeating-linear-gradient(transparent 0 27px,rgba(70,110,170,.22) 27px 28px),url(paper.png);background-position:0 38px,0 0;border-top:30px solid #f4eee0;position:relative;font-size:18px;line-height:28px}
.card-index::before{content:"";position:absolute;left:0;right:0;top:-2px;height:2px;background:rgba(170,40,30,.45)}
.card-index p{margin:0}
.ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.telegram{display:inline-flex;flex-direction:column;background:#efe2b8;color:var(--ink);padding:10px 18px 10px 16px;margin-top:22px;transform:rotate(.7deg);box-shadow:var(--shadow);border-left:4px solid #b39550;font-family:Type,monospace}
.clock-label,.clock-when{font-size:13px;color:#5b5240;text-transform:uppercase;letter-spacing:.06em}
.clock-time{font:600 clamp(28px,4vw,40px)/1.1 Type,monospace;font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:.02em}

/* the folder object */
.hero-obj{perspective:1400px}
.folder3d{position:relative;aspect-ratio:1.32;max-width:560px;margin-inline:auto;transform:rotate(2.2deg)}
.f-back{position:absolute;inset:6% 0 0;background:url(paper.png) var(--manila2);background-blend-mode:multiply;border-radius:4px;box-shadow:var(--shadow)}
.f-back::before{content:"";position:absolute;top:-7%;left:6%;width:34%;height:9%;background:inherit;border-radius:6px 6px 0 0}
.f-paper{position:absolute;background:url(paper.png) var(--paper);background-blend-mode:multiply;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.f-paper.p1{inset:2% 8% 14% 6%;transform:rotate(-3deg)}
.f-paper.p2{inset:0 5% 18% 12%;transform:rotate(1.6deg);padding:9% 9%}
.typed-lines{display:block;height:46%;background:repeating-linear-gradient(transparent 0 11px,rgba(34,29,23,.38) 11px 13px);mask:linear-gradient(90deg,#000 70%,transparent)}
.f-photo{position:absolute;right:4%;top:6%;width:28%;background:#f4efe4;padding:6px 6px 20px;transform:rotate(7deg);box-shadow:0 4px 12px rgba(0,0,0,.4);z-index:2}
.f-photo svg{display:block;width:100%;filter:sepia(.5) contrast(.95)}
.f-photo span{position:absolute;bottom:2px;left:0;right:0;text-align:center;font:14px Pencil,cursive;color:#2b3560}
.f-front{position:absolute;inset:38% 0 0;background:url(paper.png) var(--manila);background-blend-mode:multiply;border-radius:3px 3px 4px 4px;box-shadow:0 -6px 14px -8px rgba(0,0,0,.45),var(--shadow);z-index:3}
.f-front::after{content:"";position:absolute;inset:0;background:linear-gradient(170deg,rgba(255,255,255,.18),transparent 40%,rgba(0,0,0,.08));border-radius:inherit}
.f-tab{position:absolute;top:10px;right:16px;font:13px Type,monospace;color:#5c4a28}
.f-label,.cover .f-label{position:absolute;left:7%;top:18%;width:58%;background:#f6f1e4;padding:10px 14px;box-shadow:0 1px 2px rgba(0,0,0,.2);color:var(--ink);transform:rotate(-1deg)}
.f-label small{display:block;font:11px Type,monospace;letter-spacing:.05em;color:var(--mute);text-transform:uppercase}
.f-label b{display:block;font:600 clamp(18px,2.4vw,26px)/1.1 Corm,serif;margin:4px 0}
.f-label span{font:12px Type,monospace;color:var(--mute)}
.stamp-red{position:absolute;right:7%;bottom:16%;font:clamp(16px,2.2vw,24px) Type,monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--red);border:3px solid currentColor;padding:6px 12px;transform:rotate(-11deg);opacity:.86;mix-blend-mode:multiply}
.stamp-red.closed{color:#1d4d2f}
.stamp-red.big{position:static;display:inline-block;margin-bottom:14px}
.pclip{position:absolute;width:24px;height:auto;top:-18px;left:18%;z-index:5;filter:drop-shadow(1px 2px 1px rgba(0,0,0,.4))}

/* how it works: index cards */
.how{padding-block:clamp(30px,5vw,60px)}
.how h2{color:var(--chalk)}
.cards{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.icard{padding:20px 18px;transform:rotate(var(--r));transition:transform .2s}
.icard:hover{transform:rotate(0) translateY(-4px)}
.icard .num{font:600 34px/1 Corm,serif;color:var(--red)}
.icard h3{margin:8px 0 8px;font-size:23px}
.icard p{margin:0;font-size:15.5px}

/* membership licence */
.joinband{padding-block:clamp(30px,5vw,70px)}
.licence{max-width:900px;margin:auto;border:10px solid #ece3cd;outline:1px solid #bfae86;outline-offset:-16px;padding:clamp(22px,4vw,44px);transform:rotate(-.4deg);background-image:radial-gradient(circle at 90% 20%,rgba(155,35,24,.06),transparent 30%),url(paper.png)}
.lic-head small{font:12px Type,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.lic-body{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:30px;margin:12px 0 20px}
.price{font:600 clamp(36px,5vw,54px)/1 Corm,serif;margin:6px 0 10px}
.ticks{list-style:none;padding:0;margin:0}
.ticks li{padding:9px 0 9px 30px;border-bottom:1px dashed var(--line);position:relative}
.ticks li::before{content:"";position:absolute;left:4px;top:13px;width:18px;height:14px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 14'%3E%3Cpath d='M1 8c2 1 4 3 5 5 3-6 7-10 11-12' stroke='%231f2f5c' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}
.lic-foot{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.lic-foot .note{margin:0;max-width:40ch}

/* hall of fame card */
.hallwrap{padding-bottom:40px}
.hall{padding:18px 20px;max-width:520px;transform:rotate(.6deg);border-top:6px solid var(--red)}
.hall h3{font-size:24px;margin-bottom:6px}
.hall-count{font:14px Type,monospace;color:var(--mute)}
.hall-list{list-style:none;margin:0;padding:0}
.hall-list li{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:baseline;padding:7px 0;border-bottom:1px dashed var(--line)}
.hall-list .pos{font:600 20px Corm,serif;color:var(--red)}
.hall-list .who{font:21px Pencil,cursive;color:var(--blue);line-height:1.2;overflow-wrap:anywhere}
.hall-list time{font:12px Type,monospace;color:var(--mute)}
.hall-list li.me{background:rgba(226,176,74,.18)}

/* case page */
.casehead{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,.7fr);gap:32px;align-items:end;padding-block:clamp(26px,4vw,50px) 26px}
.lede{font-size:19px;max-width:60ch;color:var(--chalk)}
.stamp-inline{display:inline-block;font:clamp(14px,2vw,20px) Type,monospace;letter-spacing:.16em;text-transform:uppercase;color:#7fc69a;border:3px solid currentColor;padding:4px 10px;transform:rotate(-8deg);vertical-align:middle}
.folderwrap{padding-bottom:60px}
.tabs{display:flex;flex-wrap:wrap;gap:4px;padding-left:10px;position:relative;z-index:1}
.tabs a{text-decoration:none;padding:12px 18px 10px;min-height:46px;display:inline-flex;align-items:center;font:15px Type,monospace;color:var(--ink);background:url(paper.png) var(--manila2);background-blend-mode:multiply;border-radius:8px 8px 0 0;box-shadow:inset 0 -6px 8px -6px rgba(0,0,0,.35);transform:translateY(4px);transition:transform .15s}
.tabs a:hover{transform:translateY(0)}
.tabs a[aria-current=page]{background-color:var(--manila);transform:translateY(0);box-shadow:none}
.tabcount{color:var(--red);margin-left:6px}
.manila{background:url(paper.png) var(--manila);background-blend-mode:multiply;padding:clamp(14px,3vw,30px);border-radius:2px 6px 6px 6px;box-shadow:var(--shadow);color:var(--ink)}
.manila .note.onmanila{color:#5a4a2c}
.evgrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
.side .hall{transform:rotate(1.2deg);max-width:none}
.register{padding:0;background-image:url(paper.png)}
.docket{width:100%;border-collapse:collapse}
.docket td,.docket th{padding:12px 16px;border-bottom:1px solid rgba(80,110,160,.28);text-align:left;vertical-align:baseline}
.docket td.no{border-right:2px solid rgba(170,40,30,.4);font:14px Type,monospace;color:var(--mute);width:1%;white-space:nowrap}
.dayrow th{font:600 22px/1.2 Corm,serif;padding-top:20px;border-bottom:2px solid var(--ink)}
.dayrow th span{color:var(--red);margin-right:6px}
.dayrow em{display:block;font:13px Type,monospace;color:var(--mute);font-style:normal;margin-top:3px}
.docket .act{text-align:right;white-space:nowrap;width:1%}
.docket a.read{font:14px Type,monospace;background:var(--ink);color:var(--paper);padding:5px 10px;text-decoration:none;border-radius:2px}
.docket .ti a{text-decoration:none;font-size:17px}.docket .ti a:hover{text-decoration:underline}
.docket tr.open:hover td{background:rgba(226,176,74,.12)}
.docket tr.sealed td,.docket tr.members td{color:#8a8070}
.docket tr.seen .ti a::after{content:"";display:inline-block;width:16px;height:12px;margin-left:8px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 14'%3E%3Cpath d='M1 8c2 1 4 3 5 5 3-6 7-10 11-12' stroke='%231f2f5c' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}
.lock{font:12px Type,monospace;color:var(--red);text-decoration:none;border:2px solid var(--red);padding:3px 8px;display:inline-block;transform:rotate(-3deg);text-transform:uppercase;letter-spacing:.06em}
.chip{display:inline-block;font:11px/1 Type,monospace;color:#fff;background:var(--red);padding:3px 6px;vertical-align:2px;margin-left:6px;transform:rotate(-4deg);letter-spacing:.06em;text-transform:uppercase}
.callout{margin:16px;padding:14px 16px;border-left:4px solid var(--red);background:rgba(155,35,24,.06)}
.dossier{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.dossier article{border-top:1px solid var(--line);padding:16px 0}
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.person{background:url(paper.png) #f6f1e4;background-blend-mode:multiply;padding:16px;display:grid;gap:10px;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.person:nth-child(odd){transform:rotate(-.6deg)}.person:nth-child(even){transform:rotate(.5deg)}
.person h3{margin:0;font-size:22px}.person p{margin:0}
.seg{display:flex;flex-wrap:wrap;border:1px solid var(--ink);border-radius:3px;overflow:hidden;width:max-content;max-width:100%}
.seg button{border:0;background:transparent;font:13px Type,monospace;padding:8px 10px;min-height:40px;cursor:pointer;color:var(--ink)}
.seg button+button{border-left:1px solid var(--ink)}
.seg button[aria-pressed=true][data-s=suspect]{background:var(--red);color:#fff}
.seg button[aria-pressed=true][data-s=cleared]{background:var(--ink);color:var(--paper)}
.seg button[aria-pressed=true][data-s=unsure]{background:var(--paper2)}
textarea,input,select{width:100%;font:16px Serif,serif;color:var(--ink);background:#fbf8f0;border:1px solid var(--line);border-radius:2px;padding:10px 12px}
select{width:auto;max-width:100%}
label{display:block;font-weight:600;margin:14px 0 6px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:10px}
.row.gap{gap:12px;margin-top:20px}
.row input{flex:1 1 220px;width:auto}
.chk{display:inline-flex;gap:8px;align-items:center;font-weight:400;margin:0}
.chk input{width:auto}
.msg{font-size:15px;color:var(--mute)}
.err{color:var(--red)}
.post{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:10px}
.posts{list-style:none;padding:0;margin:0}
.posts li{border-bottom:1px dashed var(--line);padding:14px 0}
.posts .who{font:13px Type,monospace;color:var(--mute);display:flex;flex-wrap:wrap;gap:4px 14px;margin-bottom:6px}
.posts .who span:first-child{font:19px Pencil,cursive;color:var(--blue)}
.posts .body{white-space:pre-wrap;overflow-wrap:anywhere}
.posts .spoil{filter:blur(6px);cursor:pointer;user-select:none}
.posts .acts{display:flex;gap:16px;margin-top:6px}
.posts .acts button{background:none;border:0;font:14px Serif,serif;color:var(--mute);cursor:pointer;padding:6px 0;min-height:36px;text-decoration:underline}

/* opening animation */
.opening{position:fixed;inset:0;z-index:50;display:grid;place-items:center;perspective:1600px;pointer-events:none;background:rgba(10,14,12,.55);animation:fadeout .5s 1.15s forwards}
.opening .cover{position:relative;width:min(680px,88vw);aspect-ratio:1.4;background:url(paper.png) var(--manila);background-blend-mode:multiply;border-radius:4px;box-shadow:var(--shadow);transform-origin:left center;animation:openfold 1.15s .25s cubic-bezier(.6,.02,.3,1) forwards}
.opening .cover .f-label{top:28%;left:9%;width:62%}
.opening .stamp-red{bottom:18%}
.opening.skip-anim{display:none}
@keyframes openfold{to{transform:rotateY(-168deg);box-shadow:none}}
@keyframes fadeout{to{opacity:0;visibility:hidden}}

/* document viewer */
.docwrap{max-width:940px;padding-block:20px 60px}
.docbar{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;justify-content:space-between;font:14px Type,monospace;color:var(--chalk2);margin-bottom:22px}
.docbar a{color:var(--chalk)}
.lensbtn{background:none;border:1px solid rgba(232,226,211,.35);color:var(--chalk);font:13px Type,monospace;padding:8px 12px;border-radius:3px;cursor:pointer;min-height:38px}
.lensbtn[aria-pressed=true]{background:var(--chalk);color:var(--ink)}
.stage{position:relative;perspective:2200px;min-height:300px}
.sheet{position:relative;transform:rotate(var(--tilt,0deg));transform-origin:50% 0;font:18.5px/1.5 Corm,Georgia,serif;color:#2b2118}
.sheet-in{padding:clamp(22px,5.5vw,64px);position:relative}
.sheet h2{font:600 31px/1.1 Corm,serif;border-bottom:1px solid #8b6f4e;padding-bottom:8px}
.sheet h3{font-size:22px;margin-top:18px}
.sheet .sc{font-family:Corm,serif;font-variant:small-caps;letter-spacing:.04em}
.sheet .typed{font:15px/1.7 Type,monospace;color:#1f1b17}
.sheet .hand{font-family:Hand,cursive;color:var(--blue);line-height:1.9}
.sheet .diary{font-style:italic;color:#25304f}
.sheet .diary .date{font-variant:small-caps;font-style:normal;color:#5a4630;display:block;margin-top:14px}
.sheet .box{border:1px solid #8b6f4e;padding:12px 14px;margin:12px 0;background:rgba(255,250,235,.5)}
.sheet .stamp{display:inline-block;border:3px double var(--red);color:var(--red);font:13px Type,monospace;padding:6px 10px;transform:rotate(-5deg);text-align:center;margin-top:10px;mix-blend-mode:multiply}
.sheet table{border-collapse:collapse;width:100%;font-size:16px;margin:8px 0}
.sheet td,.sheet th{border:1px solid #8b6f4e;padding:6px 8px;text-align:left;vertical-align:top}
.sheet th{font-variant:small-caps;font-weight:600;background:rgba(139,111,78,.12)}
.sheet .center{text-align:center}.sheet .small{font-size:15px}
.sheet .cols{display:flex;flex-wrap:wrap;gap:6px 18px}
.sheet .rule{border-top:1px solid #8b6f4e;margin:12px auto;width:60%}
.sheet .pclip{left:auto;right:14%}
.sheet .clip{background:#ece4d2;padding:16px;columns:2 260px;column-gap:22px;font-size:16px;border:1px solid #b9a789}
.sheet .clip h4{font:600 24px/1.15 Corm,serif;margin:0 0 10px;text-align:center}
.sheet .masthead{text-align:center;font:600 34px Corm,serif;font-variant:small-caps;border-top:3px double #2b2118;border-bottom:3px double #2b2118}
.sheet .teleg{background:#faf5e6;border:1px solid #9b8a6a;padding:16px}
.sheet .strip{background:#fffbef;font:15px Type,monospace;letter-spacing:.1em;padding:4px 8px;margin:4px 0;display:inline-block;border:1px solid #d8ccb0;box-shadow:0 1px 1px rgba(0,0,0,.15)}
.sheet .clip h4{column-span:all}
.sheet svg{max-width:100%;height:auto}
.sheet table{display:block;overflow-x:auto}
/* paper kinds */
.k-letter{background-image:repeating-linear-gradient(0deg,transparent 0 3px,rgba(120,100,60,.05) 3px 4px),linear-gradient(transparent 32.6%,rgba(0,0,0,.07) 33.2%,rgba(255,255,255,.4) 33.5%,transparent 34.4%,transparent 65.8%,rgba(0,0,0,.07) 66.4%,rgba(255,255,255,.4) 66.7%,transparent 67.6%),url(paper.png);background-color:#f4eedd}
.k-legend{background-color:#ecdfbf;box-shadow:inset 0 0 60px rgba(120,80,30,.35),var(--shadow)}
.k-legend .sheet-in{column-gap:30px}
.k-news{background-color:#e6e0cf;clip-path:polygon(0 1%,4% 0,9% .8%,15% .2%,22% 1%,30% 0,38% .7%,47% 0,55% .9%,63% .1%,71% .8%,80% 0,88% .9%,95% .2%,100% 1%,100% 99%,94% 100%,86% 99.2%,77% 100%,69% 99.1%,60% 99.9%,51% 99%,42% 100%,33% 99.2%,25% 100%,16% 99.1%,8% 99.9%,0 99%);filter:drop-shadow(0 10px 14px rgba(0,0,0,.5));box-shadow:none}
.k-news .sheet-in{font-family:Serif,serif;font-size:16.5px}
.k-list,.k-statement{background-color:#f3f0e6}
.k-statement::before,.k-list::before{content:"";position:absolute;left:12px;top:22%;height:56%;width:20px;background:radial-gradient(circle at 50% 10px,#1a201c 7px,rgba(0,0,0,.25) 8px,transparent 9px),radial-gradient(circle at 50% calc(100% - 10px),#1a201c 7px,rgba(0,0,0,.25) 8px,transparent 9px);z-index:2}
.k-statement .sheet-in::after{content:"COPY";position:absolute;right:6%;top:40%;font:80px Type,monospace;color:rgba(31,47,92,.06);transform:rotate(-24deg);pointer-events:none}
.k-diary{background-color:#f1ead6;background-image:linear-gradient(90deg,transparent 54px,rgba(200,60,50,.45) 54px 56px,transparent 56px),repeating-linear-gradient(transparent 0 27px,rgba(70,110,170,.25) 27px 28px),url(paper.png);background-position:0 0,0 70px,0 0}
.k-diary .sheet-in{padding-left:clamp(64px,9vw,90px)}
.k-receipt{max-width:600px;margin-inline:auto;background-color:#f7f2e6;border-top:10px dotted var(--desk)}
.k-cipher{background-color:#ece6c6;border:1px solid #c3b27c}
.k-cipher .sheet-in{background:linear-gradient(#efe9cc,#efe9cc) padding-box}
.k-ledger{background-color:#eef0e4;background-image:repeating-linear-gradient(transparent 0 30px,rgba(60,120,90,.25) 30px 31px),url(paper.png)}
.k-plan{background-color:#e9ece6;background-image:linear-gradient(rgba(40,80,120,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(40,80,120,.07) 1px,transparent 1px),url(paper.png);background-size:20px 20px,20px 20px,auto}
.tape{position:absolute;width:110px;height:30px;background:rgba(236,226,190,.62);box-shadow:0 1px 2px rgba(0,0,0,.15);z-index:3}
.tape.t1{top:-10px;left:12%;transform:rotate(-6deg)}.tape.t2{top:-8px;right:12%;transform:rotate(5deg)}
.ring-stain{position:absolute;right:8%;bottom:10%;width:130px;height:130px;border-radius:50%;box-shadow:inset 0 0 0 6px rgba(120,70,20,.13),inset 0 0 0 9px rgba(120,70,20,.05);pointer-events:none;transform:rotate(20deg) scaleX(1.05)}
.sealed-sheet{text-align:center}
.sealed-sheet .sheet-in{padding-block:80px}
.stampbig{display:inline-block;font:20px Type,monospace;color:var(--red);border:3px double var(--red);padding:10px 18px;transform:rotate(-4deg);letter-spacing:.12em;text-transform:uppercase}
.desk{margin-top:26px;border-top:2px dashed var(--red);padding-top:16px;font:16px Serif,serif}
.desk input{max-width:280px;text-transform:uppercase;letter-spacing:.12em;font-family:Type,monospace}
.alpha{font:14px/1.7 Type,monospace;overflow-x:auto;margin:12px 0}
.plain{font:18px Type,monospace;color:var(--blue);overflow-wrap:anywhere}
.pager{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:26px}
.pager a{font:15px Type,monospace;color:var(--chalk)}
.turnhint{margin:0;text-align:center}
/* page turn */
.sheet.turn-out-next{animation:outNext .6s cubic-bezier(.5,0,.75,0) forwards;transform-origin:0 50%}
.sheet.turn-out-prev{animation:outPrev .6s cubic-bezier(.5,0,.75,0) forwards;transform-origin:100% 50%}
.sheet.turn-in{animation:inSheet .55s .1s cubic-bezier(.2,.8,.3,1) both}
@keyframes outNext{to{transform:rotateY(-95deg) translateX(-4%);opacity:.2;filter:brightness(.6)}}
@keyframes outPrev{to{transform:rotateY(95deg) translateX(4%);opacity:.2;filter:brightness(.6)}}
@keyframes inSheet{from{transform:translateY(18px) rotate(calc(var(--tilt,0deg) + 2deg));opacity:0}to{transform:rotate(var(--tilt,0deg));opacity:1}}
.stage .sheet.leaving{position:absolute;inset:0 0 auto;z-index:3}
/* magnifier */
.lens{position:fixed;width:220px;height:220px;border-radius:50%;overflow:hidden;pointer-events:none;z-index:40;border:6px solid #2d2a25;box-shadow:0 0 0 2px #8a7b5c,0 18px 30px rgba(0,0,0,.6),inset 0 0 30px rgba(0,0,0,.25);background:var(--paper)}
.lens .lens-in{position:absolute;transform-origin:0 0}
.lens::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.35),transparent 40%)}

/* detective's report */
.form7{max-width:860px;margin-inline:auto;border-top:8px solid #3a3a3a}
.formhead{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 20px;align-items:baseline;border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:14px;font:13px Type,monospace;color:var(--mute)}
.formhead b{font:600 28px Corm,serif;color:var(--ink)}
.formhead em{font-style:normal;color:var(--red);font-size:16px}
fieldset{border:0;border-top:1px solid var(--line);margin:0;padding:16px 0 8px}
legend{font:600 21px/1.2 Corm,serif;padding:0 8px 0 0}
legend .qn{color:var(--red)}
.ticks-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:4px 18px;margin-top:8px}
.tick{display:flex;gap:12px;align-items:flex-start;font-weight:400;margin:0;padding:7px 4px;cursor:pointer;border-radius:2px}
.tick:hover{background:rgba(226,176,74,.12)}
.tick input{position:absolute;opacity:0;width:1px}
.tick .box{flex:none;width:22px;height:22px;border:2px solid var(--ink);position:relative;margin-top:2px;background:#fbf8f0}
.tick input:checked+.box::after{content:"";position:absolute;left:-3px;top:-6px;width:24px;height:24px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 4 L21 21 M20 3 L4 22' stroke='%231f2f5c' stroke-width='3' stroke-linecap='round' fill='none'/%3E%3C/svg%3E");animation:mark .18s ease-out}
.tick input:focus-visible+.box{outline:3px solid #e2b04a;outline-offset:2px}
@keyframes mark{from{transform:scale(1.6);opacity:0}}
.form7 select{margin-top:8px;width:100%}
.signrow{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end;justify-content:space-between;margin-top:22px;border-top:1px solid var(--line);padding-top:18px}
.sigline{flex:1 1 240px;border-bottom:1px solid var(--ink);position:relative;min-height:56px}
.sigline small{position:absolute;bottom:-22px;left:0;font:12px Type,monospace;color:var(--mute)}
.sig{display:block;font:28px/1.4 Hand,cursive;color:var(--blue);white-space:nowrap;overflow:hidden;width:0;transition:width 1.1s steps(28)}
.sig.on{width:100%}
.stampbtn{font:15px Type,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--red);background:transparent;border:3px solid var(--red);padding:12px 18px;transform:rotate(-3deg);cursor:pointer;min-height:50px;transition:transform .12s,background .12s}
.stampbtn:hover{background:rgba(155,35,24,.08);transform:rotate(-3deg) scale(1.03)}
.stampbtn:active{transform:rotate(-3deg) scale(.94)}
.returnslip{max-width:860px;margin:0 auto 16px;display:flex;gap:18px;align-items:center;background:#f7d9cf;color:var(--ink);padding:14px 18px;box-shadow:var(--shadow);transform:rotate(-.5deg)}
.returnslip .ring{flex:none;font:32px Pencil,cursive;color:var(--red);border:3px solid var(--red);border-radius:50%;width:84px;height:84px;display:grid;place-items:center;transform:rotate(-8deg)}
.returnslip p{margin:0}
.memo{max-width:860px;margin:0 auto 18px;background:#fbf3b6;color:var(--ink);padding:16px 20px;box-shadow:var(--shadow);transform:rotate(.6deg)}
.memo h3{font-size:20px}.memo ol{margin:0;padding-left:20px}.memo li{margin-bottom:8px;font-size:15.5px}
.returned{text-align:center}
.solution h3{color:var(--red);font-size:22px;margin-top:20px}
.slam{animation:slam .45s cubic-bezier(.3,1.6,.5,1) both}
@keyframes slam{from{transform:scale(3) rotate(-20deg);opacity:0}to{opacity:.9}}
.shake{animation:shake .35s .35s}
@keyframes shake{25%{transform:translate(3px,-2px)}50%{transform:translate(-3px,2px)}75%{transform:translate(2px,1px)}}

/* envelope and letter */
.closed-wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px;align-items:start;margin-bottom:24px}
.envelope{position:relative;aspect-ratio:1.55;max-width:560px;width:100%;margin:40px auto 0;perspective:1200px;cursor:pointer}
.env-back,.env-front,.env-flap{position:absolute;inset:0;background:#d9c49a url(paper.png);background-blend-mode:multiply;border-radius:3px}
.env-back{box-shadow:var(--shadow)}
.env-front{clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%);z-index:3;background-color:#e2cfa6}
.env-flap{clip-path:polygon(0 0,100% 0,50% 56%);transform-origin:50% 0;z-index:4;background-color:#cfb787;transition:transform .7s ease-in-out,z-index 0s .35s;filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}
.seal:hover{transform:scale(1.06)}
.letter{position:absolute;left:5%;right:5%;top:6%;bottom:6%;z-index:2;padding:22px 26px;font:15px/1.55 Serif,serif;overflow:hidden;transition:transform .8s .5s cubic-bezier(.3,.9,.3,1),bottom .6s 1.2s}
.letter .lh{font:600 18px Corm,serif;text-align:center;border-bottom:1px solid var(--line);padding-bottom:6px;font-variant:small-caps}
.letter .ldate{text-align:right;font-style:italic}
.letter .sign{text-align:right}
.letter .hand{font:24px Hand,cursive;color:var(--blue)}
.envelope.open .env-flap{transform:rotateX(180deg);z-index:1}
.envelope.open .seal{transform:scale(.2);opacity:0;pointer-events:none}
.envelope.open .letter{transform:translateY(-62%)}
.envelope.read{aspect-ratio:auto;cursor:default}
.envelope.read .env-back,.envelope.read .env-front,.envelope.read .env-flap,.envelope.read .seal{display:none}
.envelope.read .letter{position:relative;inset:auto;transform:rotate(-.6deg);animation:none;transition:none;overflow:visible;padding:clamp(22px,4vw,40px)}
.scorecard .big{font:600 clamp(24px,3vw,32px)/1.15 Corm,serif}
.nums{display:flex;gap:28px;margin:10px 0 16px}
.nums b{display:block;font:600 46px/1 Corm,serif;color:var(--red)}
.nums span{font:12px Type,monospace;color:var(--mute);text-transform:uppercase}
.share label{font:13px Type,monospace;color:var(--mute);font-weight:400}
.share input{font:14px Type,monospace}
.medals{list-style:none;padding:0;margin:12px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.medal{display:grid;justify-items:center;text-align:center;gap:4px}
.medal b{font:600 17px Corm,serif}
.medal small{font-size:12.5px;color:var(--mute);line-height:1.3}

/* id card, stats, certificate */
.idcard{padding:0;border-radius:10px;overflow:hidden;margin-bottom:22px;background-image:linear-gradient(135deg,rgba(255,255,255,.35),transparent 40%),url(paper.png);transform:rotate(-.7deg)}
.id-head{background:var(--blue);color:#efe9da;padding:12px 20px}
.id-head small{display:block;font:11px Type,monospace;letter-spacing:.1em;text-transform:uppercase;opacity:.8}
.id-head b{font:600 26px Corm,serif}
.id-body{display:grid;grid-template-columns:110px minmax(0,1fr);gap:20px;padding:20px}
.id-photo{border:4px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.3);transform:rotate(-2deg);align-self:start}
.id-photo svg{display:block;width:100%}
.idcard dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 18px;margin:0}
.idcard dt{font:12px Type,monospace;color:var(--mute);text-transform:uppercase;padding-top:5px}
.idcard dd{margin:0;font-weight:600}
.idcard dd.hand{font:24px/1.3 Hand,cursive;color:var(--blue);font-weight:400}
.chev{color:var(--red);letter-spacing:-.1em}
.rankbar{margin:0 20px;height:10px;background:rgba(0,0,0,.08);border:1px solid var(--line)}
.rankbar span{display:block;height:100%;background:repeating-linear-gradient(90deg,var(--red) 0 8px,#b8392a 8px 16px);transition:width 1.2s}
.idcard .note{margin:8px 20px 18px}
.statgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;text-align:center}
.statgrid b{display:block;font:600 40px/1 Corm,serif;color:var(--red)}
.statgrid span{font:12px Type,monospace;color:var(--mute);text-transform:uppercase}
.card{display:grid;grid-template-columns:max-content 1fr;gap:10px 22px;margin:0 0 10px}
.card dt{color:var(--mute)}.card dd{margin:0;font-weight:600}
.codebox{border:2px dashed var(--line);padding:18px;margin:18px 0}
.code{font:clamp(22px,4vw,30px)/1.2 Type,monospace;letter-spacing:.06em;overflow-wrap:anywhere}
.loginf{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.loginf input{flex:1 1 260px;width:auto;font-family:Type,monospace;letter-spacing:.08em}
.certificate{padding:12px;transform:rotate(-.5deg)}
.cert-in{border:3px double #8b6f4e;outline:1px solid #8b6f4e;outline-offset:6px;padding:clamp(26px,5vw,56px) clamp(18px,4vw,40px);text-align:center;position:relative;background:repeating-radial-gradient(circle at 50% 0,transparent 0 14px,rgba(139,111,78,.05) 14px 15px)}
.cert-in small{font:12px Type,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.cert-in h1{font-size:clamp(40px,6vw,64px);margin:8px 0 18px}
.cert-name{font:clamp(30px,5vw,46px)/1.3 Hand,cursive;color:var(--blue);margin:0 0 8px;overflow-wrap:anywhere}
.cert-line{font-size:19px}
.cert-in .medals{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 18px}.cert-in .medal{width:150px}
.cert-seal{position:absolute;right:6%;bottom:-24px;width:92px;height:92px;border-radius:50%;display:grid;place-items:center;font:600 26px Corm,serif;color:#f3d9c9;background:radial-gradient(circle at 35% 30%,#c4402f,#8f1d13 60%,#6c140c);box-shadow:0 3px 6px rgba(0,0,0,.5),0 0 0 6px rgba(143,29,19,.3);transform:rotate(-12deg)}
.cta-line{font:600 24px Corm,serif;margin-right:12px}
.legal h2{font-size:26px;margin-top:28px}
.foot{border-top:1px solid rgba(232,226,211,.12);padding-block:26px;font-size:14px;color:var(--chalk2)}
.foot .links{display:flex;flex-wrap:wrap;gap:6px 20px}
.admin td{font-size:14px}

@media(max-width:980px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.evgrid,.closed-wrap{grid-template-columns:minmax(0,1fr)}}
@media(max-width:860px){.hero,.casehead,.lic-body{grid-template-columns:minmax(0,1fr)}.dossier{grid-template-columns:minmax(0,1fr)}.hero-obj{order:-1}.folder3d{max-width:440px}}
@media(max-width:560px){body{font-size:16px}.cards{grid-template-columns:minmax(0,1fr)}.lede{font-size:17px}.docket td,.docket th{padding:10px 10px}.tabs a{padding:10px 11px 8px;font-size:13px}.statgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.id-body{grid-template-columns:80px minmax(0,1fr)}.sheet{font-size:17px}.k-statement::before,.k-list::before{display:none}.letter{font-size:13px;padding:14px}.turnhint{display:none}.lensbtn{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}.opening{display:none}}
[hidden]{display:none!important}
.form7 .msg{margin:34px 0 0}
.cert-in .medal small{font:12.5px/1.3 Serif,serif;text-transform:none;letter-spacing:0}

.medal img{width:76px;height:auto;display:block;filter:drop-shadow(0 2px 2px rgba(0,0,0,.25))}
/* wax seal on the envelope */
.seal{position:absolute;left:50%;top:50%;width:132px;height:auto;margin:0;transform:translate(-50%,-46%);background:none;box-shadow:none;border:0;padding:0;z-index:5;cursor:pointer;display:grid;justify-items:center;transition:transform .3s,opacity .3s}
.seal img{width:120px;height:auto;display:block;filter:drop-shadow(0 3px 3px rgba(0,0,0,.35))}
.seal span{font:12px Type,monospace;color:#3a2a14;background:rgba(242,235,218,.85);padding:2px 8px;margin-top:4px;text-transform:uppercase;letter-spacing:.06em}
.seal:hover{transform:translate(-50%,-46%) scale(1.04)}
.envelope.open .seal{transform:translate(-50%,-46%) scale(.3) rotate(25deg)}
.cert-seal{position:absolute;right:4%;bottom:-40px;width:130px;height:auto;background:none;box-shadow:none;border-radius:0;transform:rotate(-8deg);filter:drop-shadow(0 4px 4px rgba(0,0,0,.35))}
/* rubber-stamp ink: uneven, speckled, slightly bled */
.stamp-red,.stampbig,.lock,.stamp-inline,.sheet .stamp,.chip,.stampbtn,.returnslip .ring{-webkit-mask-image:url(obj/ink.png);mask-image:url(obj/ink.png);-webkit-mask-size:220px;mask-size:220px;text-shadow:0 0 .6px currentColor}
.stamp-red,.stamp-inline{border-width:3px;border-radius:2px}
.lock{-webkit-mask-position:37px 11px;mask-position:37px 11px}

/* archive marks on documents */
.fileref{font:12px Type,monospace;color:#6f6553;letter-spacing:.04em;margin:-18px 0 18px;opacity:.85}
.pencil{font:20px/1.25 Pencil,cursive;color:#55595e;max-width:250px;transform:rotate(var(--r));margin:0 0 14px auto;text-align:right;opacity:.85}
.recv{position:absolute;right:6%;bottom:5%;z-index:3;display:grid;justify-items:center;gap:1px;padding:6px 10px;border:2px solid #2d3f7a;border-radius:6px;color:#2d3f7a;font:11px/1.25 Type,monospace;letter-spacing:.06em;transform:rotate(var(--r));opacity:.72;mix-blend-mode:multiply;-webkit-mask-image:url(obj/ink.png);mask-image:url(obj/ink.png);-webkit-mask-size:180px;mask-size:180px;pointer-events:none}
.recv i{font:normal 15px Type,monospace;letter-spacing:.2em;border-block:1px solid currentColor;padding:1px 6px;margin:2px 0}
.sheet.ear{clip-path:polygon(0 0,calc(100% - 46px) 0,100% 46px,100% 100%,0 100%)}
.sheet.ear::after{content:"";position:absolute;right:0;top:0;width:46px;height:46px;background:linear-gradient(225deg,transparent 50%,#d9cfb8 50%,#efe7d4 70%);box-shadow:-3px 3px 6px rgba(0,0,0,.18);z-index:4}
@media(max-width:560px){.recv{transform:scale(.8) rotate(var(--r));right:2%;bottom:2%}.pencil{font-size:18px}}