/* 死信局《查无此人》 —— 共用样式 */
:root{
  --desk:#15130f; --desk-2:#221e17;
  --paper:#efe4cb; --paper-deep:#e3d4b2; --paper-light:#f6efdd; --note:#fbf6ea;
  --ink:#241c14; --ink-2:#4b3f31; --ink-3:#7a6b57; --rule:#cdbd9a;
  --red:#a5322a; --red-2:#c2463b; --blue:#233d5c; --green:#2f6b3a;
  --gold:#e0c98c; --dust:#a5977b; --dust-2:#d7c9ab;
  --serif:"Noto Serif CJK SC","Source Han Serif SC","Source Han Serif CN","Songti SC","STSong",SimSun,"Times New Roman",Georgia,serif;
  --kai:"Kaiti SC","STKaiti",KaiTi,"AR PL UKai CN","LXGW WenKai","Noto Serif CJK SC",serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono","Courier New",monospace;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--desk)}
body{margin:0;min-height:100vh;color:var(--ink);font-family:var(--serif);font-size:17px;line-height:1.85;
  background:radial-gradient(ellipse at 50% -10%,rgba(255,214,150,.13),transparent 55%),
             radial-gradient(ellipse at 50% 110%,rgba(0,0,0,.55),transparent 65%),var(--desk);}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.16;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='220' height='220' filter='url(%23n)' opacity='.9'/></svg>");}
a{color:var(--blue)}
b,strong{font-weight:700}
code{font-family:var(--mono);font-size:.92em}

.desk{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:28px 18px 90px}

/* 页眉 */
.masthead{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:18px;color:var(--dust);font-size:12px;letter-spacing:.25em}
.brand{color:#d9c9a4;text-decoration:none;font-weight:700;font-size:16px;letter-spacing:.45em;line-height:1.2}
.brand span{display:block;font-size:9px;letter-spacing:.32em;color:#8d7d5f;font-family:var(--mono);font-weight:400;margin-top:3px}
.progress{font-family:var(--mono);letter-spacing:.15em;white-space:nowrap}

/* 纸张 */
.sheet{position:relative;background:linear-gradient(180deg,var(--paper-light),var(--paper) 28%,var(--paper-deep));
  padding:44px 48px 40px;border-radius:2px;
  box-shadow:0 40px 70px -28px rgba(0,0,0,.85),0 1px 0 rgba(255,255,255,.35) inset,0 0 0 1px rgba(90,70,40,.25)}
.sheet::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:2px;opacity:.28;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .55 0 0 0 0 .48 0 0 0 0 .36 0 0 0 .5 0'/></filter><rect width='300' height='300' filter='url(%23p)'/></svg>");}
.station{margin:0 0 22px;padding-right:120px;font-size:34px;letter-spacing:.22em;font-weight:700;line-height:1.25;color:var(--ink)}
.station small{display:block;font-size:12px;letter-spacing:.55em;color:var(--ink-3);margin-bottom:6px;font-weight:400}
.body p{margin:0 0 1em}
.body p:last-child{margin-bottom:0}
.say{font-family:var(--kai);color:var(--blue);font-size:1.03em}
.dim{color:var(--ink-3);font-size:.9em}
.pencil{color:#5d5750;font-family:var(--kai)}

/* 邮戳 */
.postmark{position:absolute;right:26px;top:24px;width:116px;height:116px;border-radius:50%;border:3px double var(--red);color:var(--red);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;transform:rotate(-9deg);opacity:.86;mix-blend-mode:multiply;
  line-height:1.05;text-align:center;letter-spacing:.1em;font-family:var(--serif);user-select:none;z-index:2}
.postmark::before{content:"";position:absolute;inset:5px;border-radius:50%;border:1px solid currentColor;opacity:.8}
.postmark .pm-top{font-size:10px;letter-spacing:.4em;text-indent:.4em}
.postmark .pm-char{font-size:36px;font-weight:700;letter-spacing:0;line-height:1;margin:2px 0}
.postmark .pm-no{font-size:11px;font-family:var(--mono);letter-spacing:.12em}
.postmark .pm-name{font-size:10px;letter-spacing:.2em;text-indent:.2em}
.postmark.blank{border-style:dashed;opacity:.5}
.postmark.returned{color:var(--red);opacity:.9}

/* 信纸残片 */
.fragment{position:relative;margin:26px 10px 0;filter:drop-shadow(0 14px 18px rgba(0,0,0,.55))}
.fragment::before{content:"";position:absolute;inset:0;background:var(--note);
  clip-path:polygon(0 6%,2% 0,11% 3%,24% 0,39% 3%,53% 0,68% 2%,84% 0,96% 3%,100% 9%,99% 32%,100% 56%,98% 81%,100% 95%,91% 100%,76% 97%,61% 100%,46% 97%,31% 100%,16% 98%,4% 100%,0 91%,1% 60%,0 30%)}
.fragment>*{position:relative}
.fragment{padding:24px 30px 26px;color:#2b2a3a;font-family:var(--kai);transform:rotate(-.6deg)}
.frag-label{font-family:var(--mono);font-size:11px;letter-spacing:.3em;color:#8a7f6a;margin-bottom:6px}
.fragment p{margin:0;font-size:17px;line-height:1.95}

/* 投递窗口 */
.counter{margin:30px 0 0;padding:22px 26px 18px;color:var(--dust-2);background:rgba(255,255,255,.035);border:1px solid rgba(217,201,164,.18);border-radius:2px}
.counter label{display:block;font-size:12px;letter-spacing:.45em;color:var(--dust);margin-bottom:10px}
#deliver{display:flex;gap:12px;align-items:flex-end}
#answer{flex:1;min-width:0;background:transparent;border:0;border-bottom:1px solid #8d7d5f;color:#f1e6cc;font:inherit;font-size:21px;letter-spacing:.15em;padding:8px 4px;outline:none;border-radius:0}
#answer::placeholder{color:#6f6248;letter-spacing:.05em;font-size:15px}
#answer:focus{border-bottom-color:var(--gold)}
#deliver button{font:inherit;font-weight:700;letter-spacing:.3em;text-indent:.3em;padding:8px 18px;border:2px solid var(--red-2);color:#ffd9d2;background:transparent;cursor:pointer;border-radius:3px;white-space:nowrap}
#deliver button:hover{background:rgba(194,70,59,.22)}
.msg{min-height:1.7em;margin-top:10px;font-family:var(--mono);font-size:13px;color:#e08f84;letter-spacing:.04em}
.msg.ok{color:#b8d8a0}
.msg .dim{color:#a5977b}
.shake{animation:shake .4s}
@keyframes shake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
.hints{margin-top:14px;font-size:14px}
.hints summary{cursor:pointer;color:var(--dust);letter-spacing:.2em;user-select:none}
.hints summary:hover{color:var(--gold)}
.hint-row{display:flex;gap:8px;margin:12px 0 0;flex-wrap:wrap}
.hint-btn{font:inherit;font-size:13px;letter-spacing:.2em;text-indent:.2em;padding:4px 12px;background:transparent;border:1px solid #6f6248;color:#c9b993;cursor:pointer;border-radius:2px}
.hint-btn:hover:not(:disabled){border-color:var(--gold);color:var(--gold)}
.hint-btn:disabled{opacity:.35;cursor:not-allowed}
.hint-btn.used{opacity:.55;border-style:dashed}
.hint-text{margin:10px 0 0;padding:10px 14px;background:rgba(0,0,0,.28);border-left:2px solid #8d7d5f;color:#e5d8bb;line-height:1.75;word-break:break-word}
.hint-text code{background:rgba(255,255,255,.08);padding:0 5px;border-radius:2px;font-size:12px}
.hint-text a{color:var(--gold)}
.hint-text b{color:#fff}

/* 页脚 */
.foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:26px;font-size:13px;letter-spacing:.2em;color:var(--dust)}
.foot a,.linkish{color:var(--dust);text-decoration:none;border-bottom:1px dotted #6f6248;background:none;border-top:0;border-left:0;border-right:0;font:inherit;padding:0;cursor:pointer;letter-spacing:inherit}
.foot a:hover,.linkish:hover{color:var(--gold)}

/* 通用小部件 */
table.form{width:100%;border-collapse:collapse;margin:14px 0 18px;font-size:15px}
table.form th{width:6.5em;text-align:left;font-weight:400;color:var(--ink-3);letter-spacing:.2em;padding:8px 10px;border-bottom:1px dashed var(--rule);vertical-align:top;white-space:nowrap}
table.form td{padding:8px 10px;border-bottom:1px dashed var(--rule);vertical-align:top}
table.form .remark{color:var(--red);font-weight:700}
.inkstamp{display:inline-block;border:2px solid var(--red);color:var(--red);padding:0 10px;letter-spacing:.3em;text-indent:.3em;font-weight:700;transform:rotate(-3deg);border-radius:3px;opacity:.85;font-size:19px}
.signboard{display:inline-flex;flex-direction:column;align-items:center;background:#6b4a30;color:#f1e6cc;padding:14px 28px;border:3px solid #4a3324;border-radius:3px;margin:12px 0 16px;letter-spacing:.4em;text-indent:.4em;font-weight:700;font-size:20px;box-shadow:0 12px 22px -14px #000}
.signboard small{font-size:10px;font-family:var(--mono);letter-spacing:.2em;text-indent:0;color:#c9b27a;margin-top:6px;font-weight:400}
.signboard.broken{background:#5a6b70;border-color:#3b474a;flex-direction:row;gap:6px}
.signboard .smudge{color:#3b474a;letter-spacing:0;text-indent:0;font-size:22px;line-height:1;filter:blur(1.2px)}
.poem{font-family:var(--kai);font-size:19px;letter-spacing:.15em;line-height:2;margin:14px 0 18px;padding:14px 26px;background:var(--note);border:1px solid #e3d8bf;display:inline-block}
.poem p{margin:0}
.poem .poem-sign{text-align:right;font-size:14px;color:var(--ink-3)}
.poem.tight{font-size:17px}
.doclink{color:var(--blue);font-weight:700;letter-spacing:.15em}
.note{margin:16px 0;padding:18px 24px 22px;background:var(--note);box-shadow:0 1px 0 #d9ccae inset,0 8px 18px -12px rgba(0,0,0,.5)}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin:22px 0 8px;align-items:center}
.btn{display:inline-block;padding:10px 26px;border:2px solid #8d7d5f;color:#3a2c1a;text-decoration:none;letter-spacing:.3em;text-indent:.3em;font-weight:700;border-radius:3px;background:transparent;cursor:pointer;font:inherit;font-size:16px}
.btn:hover{border-color:var(--ink)}
.btn.primary{background:var(--red);border-color:var(--red);color:#fff5ec}
.btn.primary:hover{background:var(--red-2);border-color:var(--red-2)}

/* 首页 */
.title{margin:0 0 18px;font-size:44px;letter-spacing:.3em;font-weight:700;line-height:1.1}
.title small{display:block;font-size:11px;letter-spacing:.5em;color:var(--ink-3);font-family:var(--mono);font-weight:400;margin-top:8px}
.envelope{position:relative;background:#f4ecd8;border:1px solid #d8c9a5;padding:26px 28px 24px;margin:18px 0 24px;min-height:210px;box-shadow:0 12px 26px -16px rgba(0,0,0,.6)}
.envelope::before{content:"";position:absolute;inset:6px;border:1px dashed #d8c9a5;pointer-events:none}
.env-stamp{position:absolute;right:26px;top:22px;width:46px;height:58px;background:#c7d4c0;border:5px solid #fff;outline:1px dashed #c9b27a;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#3f5a3a;font-weight:700;line-height:1.1}
.env-stamp i{font-style:normal;font-size:10px;font-family:var(--mono)}
.env-postmark{position:absolute;right:58px;top:32px;width:76px;height:76px;border-radius:50%;border:2px solid rgba(60,50,40,.45);color:rgba(60,50,40,.6);font-size:11px;display:flex;align-items:center;justify-content:center;text-align:center;transform:rotate(-14deg);line-height:1.3;letter-spacing:.1em}
.env-addr{font-family:var(--kai);margin-top:46px}
.env-line{display:flex;align-items:baseline;gap:14px;margin:8px 0}
.env-k{font-size:12px;letter-spacing:.3em;color:var(--ink-3);width:4.5em;font-family:var(--serif);flex:none}
.env-v{border-bottom:1px solid #c9b895;min-width:12em;padding:0 4px;color:#2b2a3a}
.env-v.big{font-size:27px;letter-spacing:.3em}
.env-v.blank{min-width:18em}
.env-return{position:absolute;left:36%;top:40%;transform:rotate(-12deg);border:3px double var(--red);color:var(--red);padding:4px 18px;font-size:27px;font-weight:700;letter-spacing:.3em;text-indent:.3em;opacity:.82;text-align:center;mix-blend-mode:multiply;line-height:1.2}
.env-return small{display:block;font-size:10px;letter-spacing:.2em;text-indent:0;font-family:var(--mono);font-weight:400}
.env-dlo{position:absolute;right:28px;bottom:16px;border:2px solid var(--blue);color:var(--blue);padding:2px 10px;font-size:13px;letter-spacing:.2em;transform:rotate(4deg);opacity:.75;text-align:center;line-height:1.35}
.env-dlo i{font-style:normal;font-family:var(--mono);font-size:10px;letter-spacing:.05em}
.intro p{margin:0 0 .8em}
.rules{margin:22px 0 6px;padding:16px 22px 12px;border:1px solid var(--rule);background:rgba(255,255,255,.25)}
.rules h2{margin:0 0 8px;font-size:14px;letter-spacing:.5em;color:var(--red);font-weight:700}
.rules ol{margin:0;padding-left:1.6em}
.rules li{margin:4px 0}
.done{color:var(--green);font-weight:700;letter-spacing:.1em}
.home-sheet .note{font-size:13px;color:var(--ink-3);margin:18px 0 0;padding:0;background:none;box-shadow:none;line-height:1.7}
.record{margin-top:32px;color:var(--dust-2)}
.record h2{font-size:14px;letter-spacing:.5em;color:var(--dust);font-weight:400;margin:0 0 12px}
.record ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:10px}
.record li{background:rgba(255,255,255,.04);border:1px solid rgba(217,201,164,.16);padding:10px 12px;display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;border-radius:2px}
.record li a{color:#e5d8bb;text-decoration:none;display:flex;flex-direction:column}
.record li a:hover .rname{color:var(--gold)}
.record .rn{font-size:11px;letter-spacing:.3em;color:var(--dust);font-family:var(--mono)}
.record .rname{font-size:18px;letter-spacing:.15em}
.mini-stamp{width:56px;height:56px;border-radius:50%;border:2px double var(--red-2);color:var(--red-2);display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-10deg);opacity:.92;line-height:1;flex:none}
.mini-stamp b{font-size:21px}
.mini-stamp i{font-style:normal;font-size:9px;font-family:var(--mono);margin-top:3px;letter-spacing:.05em}
.mini-stamp.none{opacity:.3;border-style:dashed}
.record details{grid-column:1/-1;font-size:13px;color:#b9a98a}
.record summary{cursor:pointer;letter-spacing:.2em;font-size:12px;color:#8d7d5f}
.record details p{margin:6px 0 0;font-family:var(--kai);color:var(--dust-2);line-height:1.7}

/* 退信单 */
.notfound .sheet.slip{background:linear-gradient(180deg,#f3ece0,#e9dfcb)}
.notfound code{word-break:break-all;color:var(--blue)}

/* 终点 */
.signform{display:flex;gap:14px;align-items:flex-end;margin-top:24px;flex-wrap:wrap}
.signform label{font-size:12px;letter-spacing:.4em;color:var(--ink-3);padding-bottom:10px}
.signform input{font:inherit;font-family:var(--kai);font-size:23px;border:0;border-bottom:1px solid #8d7d5f;background:transparent;padding:6px 8px;letter-spacing:.2em;outline:none;min-width:11em;border-radius:0;color:#2b2a3a}
.signform input:focus{border-bottom-color:var(--red)}
.signform button{font:inherit;padding:8px 22px;border:2px solid var(--red);color:var(--red);background:transparent;letter-spacing:.3em;text-indent:.3em;cursor:pointer;border-radius:3px;font-weight:700}
.signform button:hover{background:var(--red);color:#fff5ec}
.delivered .signform{display:none}
.letter{margin-top:34px;position:relative}
.delivered-stamp{position:absolute;right:22px;top:-20px;z-index:2;border:4px double var(--green);color:var(--green);padding:6px 20px;font-size:28px;font-weight:700;letter-spacing:.3em;text-indent:.3em;transform:rotate(-10deg);background:rgba(244,236,216,.55);text-align:center;line-height:1.2;animation:stampin .55s cubic-bezier(.2,1.5,.4,1) both}
.delivered-stamp small{display:block;font-size:10px;font-family:var(--mono);letter-spacing:.15em;text-indent:0;font-weight:400}
@keyframes stampin{from{transform:rotate(-10deg) scale(2.4);opacity:0}to{transform:rotate(-10deg) scale(1);opacity:1}}
.letter-paper{background:var(--note);padding:48px 50px;font-family:var(--kai);font-size:17px;line-height:2.05;color:#2b2a3a;box-shadow:0 30px 60px -20px rgba(0,0,0,.75)}
.letter-paper p{margin:0 0 1em;text-indent:2em}
.letter-to{text-indent:0!important;font-size:20px}
.letter-to s{color:#8a7f6a}
.letter-sign{text-align:right;text-indent:0!important;margin-top:2em}
.letter-sign small{font-size:13px;color:var(--ink-3)}
.credits{color:var(--dust);font-size:13px;letter-spacing:.15em;text-align:center;margin-top:26px;line-height:2}
.credits .stations{font-family:var(--kai);color:#8d7d5f}
.credits a{color:var(--dust-2)}

/* 响应式 */
@media (max-width:640px){
  body{font-size:16px}
  .desk{padding:18px 12px 70px}
  .sheet{padding:28px 22px 26px}
  .station{padding-right:0;font-size:28px}
  .postmark{position:static;transform:rotate(-6deg);margin:-6px 0 12px auto;width:100px;height:100px}
  .postmark .pm-char{font-size:30px}
  .title{font-size:34px}
  .env-return{left:26%;font-size:22px}
  .env-postmark{display:none}
  .letter-paper{padding:30px 22px}
  .fragment{margin:22px 0 0;padding:20px 20px 22px}
}
@media (prefers-reduced-motion:reduce){
  .shake,.delivered-stamp{animation:none}
}
