:root { --paper:#f3eee3; --ink:#1c1b19; --red:#cf2849; --yellow:#f4d96f; --muted:#706b62; --line:#26231f; }
* { box-sizing:border-box; }
html { background:var(--paper); scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"PingFang SC","Noto Sans SC","Microsoft YaHei",sans-serif; }
button,input { font:inherit; }
a { color:inherit; }
.activation-page { min-height:100vh; padding:0 clamp(18px,4vw,64px); overflow:hidden; }
.masthead { height:92px; display:flex; align-items:center; justify-content:space-between; border-bottom:3px solid var(--line); }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.brand-mark { width:42px; height:42px; display:grid; place-items:center; border:2px solid var(--line); border-radius:50%; font:800 24px Tahoma,sans-serif; }
.brand strong { display:block; font-size:16px; letter-spacing:.04em; }
.brand small { display:block; margin-top:3px; font:700 9px/1 Arial,sans-serif; letter-spacing:.17em; color:var(--muted); }
.edition { display:flex; align-items:stretch; border:2px solid var(--line); font-size:11px; font-weight:700; }
.edition span,.edition b { padding:8px 10px; }
.edition b { color:white; background:var(--ink); font-family:Arial,sans-serif; letter-spacing:.08em; }
.gate { max-width:1420px; min-height:calc(100vh - 148px); margin:0 auto; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(410px,.85fr); }
.editorial-panel { position:relative; padding:clamp(50px,7vw,98px) clamp(38px,6vw,90px) 64px 0; border-right:3px solid var(--line); }
.eyebrow { display:flex; gap:12px; align-items:center; margin-bottom:24px; font-size:11px; font-weight:800; letter-spacing:.12em; }
.eyebrow span:first-child { padding:6px 9px; background:var(--red); color:#fff; }
.thai-title { position:absolute; top:54px; right:35px; color:rgba(207,40,73,.15); font:900 clamp(34px,5vw,72px)/.92 Tahoma,sans-serif; text-align:right; transform:rotate(-3deg); }
.editorial-panel h1 { position:relative; margin:0; max-width:690px; font:900 clamp(46px,6.3vw,92px)/.97 "Songti SC","STSong",serif; letter-spacing:-.055em; }
.editorial-panel h1::after { content:""; display:inline-block; width:.18em; height:.18em; margin-left:.08em; border-radius:50%; background:var(--red); }
.lead { max-width:570px; margin:30px 0 46px; font-size:clamp(15px,1.3vw,19px); line-height:1.8; color:#4e4a43; }
.field-notes { display:grid; grid-template-columns:repeat(3,1fr); border-top:2px solid var(--line); border-bottom:2px solid var(--line); }
.field-notes article { min-height:132px; padding:17px 18px 16px 0; }
.field-notes article+article { border-left:1px solid #8c8579; padding-left:18px; }
.field-notes b { font:800 10px Arial,sans-serif; color:var(--red); }
.field-notes span { display:block; margin:10px 0 7px; font-weight:800; font-size:14px; }
.field-notes p { margin:0; color:var(--muted); font-size:11px; line-height:1.55; }
.margin-note { margin:20px 0 0; text-align:right; font:700 13px Tahoma,sans-serif; color:var(--muted); letter-spacing:.05em; }
.pass-panel { align-self:center; margin:44px 0 44px clamp(30px,5vw,78px); background:#fffdf8; border:3px solid var(--line); box-shadow:12px 12px 0 var(--yellow); }
.pass-number { padding:12px 17px; border-bottom:2px dashed var(--line); font:800 10px Arial,sans-serif; letter-spacing:.16em; }
.pass-heading { display:flex; gap:17px; align-items:center; padding:26px 28px 15px; }
.key-stamp { width:52px; height:52px; display:grid; place-items:center; background:var(--yellow); border-radius:50%; font-size:25px; }
.pass-heading p { margin:0 0 4px; color:var(--red); font-size:11px; font-weight:800; letter-spacing:.1em; }
.pass-heading h2 { margin:0; font:900 30px/1.1 "Songti SC","STSong",serif; }
.pass-copy { margin:0; padding:0 28px; color:var(--muted); font-size:13px; line-height:1.7; }
.activation-form { padding:22px 28px 10px; }
.activation-form label { display:block; margin-bottom:8px; font-size:11px; font-weight:800; }
.code-field { display:flex; align-items:center; border:2px solid var(--line); background:#fff; }
.code-field>span { padding:0 12px; color:var(--red); font:900 18px Georgia,serif; }
.code-field input { width:100%; min-width:0; height:54px; border:0; border-left:1px solid #b4aea4; outline:none; padding:0 13px; color:var(--ink); background:transparent; font:800 clamp(14px,1.35vw,18px) Arial,sans-serif; letter-spacing:.06em; text-transform:uppercase; }
.code-field:focus-within { box-shadow:0 0 0 3px rgba(207,40,73,.18); }
.code-help { margin:7px 0 16px; color:var(--muted); font-size:10px; }
.activation-form button { width:100%; min-height:54px; display:flex; align-items:center; justify-content:space-between; padding:0 18px; border:2px solid var(--line); background:var(--ink); color:white; font-size:14px; font-weight:800; cursor:pointer; transition:transform .16s,background .16s; }
.activation-form button:hover { background:var(--red); transform:translate(-2px,-2px); }
.activation-form button:disabled { cursor:wait; opacity:.72; transform:none; }
.activation-form button:focus-visible { outline:3px solid var(--yellow); outline-offset:3px; }
.activation-form button b { font-size:22px; }
.form-message { min-height:18px; margin:8px 0 0; color:var(--red); font-size:11px; line-height:1.5; }
.benefits { display:grid; grid-template-columns:repeat(3,1fr); border-top:2px dashed var(--line); border-bottom:2px solid var(--line); }
.benefits>div { padding:16px 11px; display:flex; gap:7px; }
.benefits>div+div { border-left:1px solid #b4aea4; }
.benefits span { width:18px; height:18px; flex:none; display:grid; place-items:center; border-radius:50%; background:var(--yellow); font-size:10px; font-weight:900; }
.benefits p { margin:0; }
.benefits b,.benefits small { display:block; }
.benefits b { font-size:10px; }
.benefits small { margin-top:4px; color:var(--muted); font-size:8px; line-height:1.4; }
.help-line { display:flex; justify-content:space-between; gap:16px; padding:13px 17px; color:var(--muted); font-size:10px; }
.help-line a { color:var(--ink); font-weight:800; text-underline-offset:3px; }
footer { height:56px; display:flex; justify-content:space-between; align-items:center; border-top:1px solid #8c8579; color:var(--muted); font:700 9px Arial,sans-serif; letter-spacing:.08em; }
.library-status { min-height:100vh; display:grid; place-content:center; justify-items:center; gap:18px; background:var(--paper); }
.library-status p { margin:0; color:var(--muted); font-size:13px; }
.library-welcome { min-height:100vh; padding:0 clamp(20px,5vw,72px); background:var(--paper); }
.library-welcome header { height:92px; display:flex; align-items:center; justify-content:space-between; border-bottom:3px solid var(--line); }
.access-live { padding:7px 10px; border:2px solid var(--line); font-size:11px; font-weight:800; color:#27754b; }
.library-welcome section { min-height:calc(100vh - 92px); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; max-width:920px; padding:70px 0; }
.eyebrow-text { margin:0 0 19px; color:var(--red); font:800 11px Arial,sans-serif; letter-spacing:.13em; }
.library-welcome h1 { margin:0; font:900 clamp(58px,9vw,126px)/.95 "Songti SC","STSong",serif; letter-spacing:-.06em; }
.library-welcome section>p:not(.eyebrow-text) { max-width:620px; margin:28px 0; color:var(--muted); font-size:16px; line-height:1.8; }
.library-welcome section>a { min-width:260px; display:flex; justify-content:space-between; padding:17px 19px; background:var(--ink); color:#fff; text-decoration:none; font-size:14px; font-weight:800; box-shadow:8px 8px 0 var(--yellow); }
@media (max-width:980px) { .gate{grid-template-columns:1fr}.editorial-panel{padding-right:0;border-right:0;border-bottom:3px solid var(--line)}.pass-panel{width:min(620px,calc(100% - 16px));margin:58px auto 70px} }
@media (max-width:600px) {
  .activation-page{padding:0 16px}.masthead{height:74px}.brand-mark{width:36px;height:36px;font-size:20px}.brand strong{font-size:13px}.brand small{font-size:7px}.edition span{display:none}
  .editorial-panel{padding:45px 0 38px}.thai-title{top:38px;right:-8px;font-size:42px}.editorial-panel h1{max-width:350px;font-size:clamp(44px,15vw,64px)}.lead{margin:25px 0 34px}
  .field-notes{grid-template-columns:1fr}.field-notes article{min-height:0;padding:14px 0}.field-notes article+article{border-left:0;border-top:1px solid #8c8579;padding-left:0}
  .pass-panel{width:calc(100% - 9px);margin:46px 9px 58px 0;box-shadow:9px 9px 0 var(--yellow)}.pass-heading{padding:22px 19px 13px}.pass-heading h2{font-size:27px}.pass-copy,.activation-form{padding-left:19px;padding-right:19px}
  .benefits{grid-template-columns:1fr}.benefits>div{padding:11px 19px}.benefits>div+div{border-left:0;border-top:1px solid #b4aea4}footer{gap:12px;font-size:7px}
}
@media (prefers-reduced-motion:reduce) { *{scroll-behavior:auto!important;transition:none!important} }