:root{--paper:#fcf7ed;--ink:#2e3f36;--green:#375c47;--muted:#7e8375;--line:#e7dfcd}
body{background:radial-gradient(ellipse at 90% 10%,#eee6d24d,transparent 50%),var(--paper)}
.site-header{height:85px;border-bottom:1px solid #e7dfcd;max-width:1240px}.logo{letter-spacing:-1.5px}.landing{max-width:1240px}.hero{padding:68px 0;grid-template-columns:1fr 1.05fr;gap:48px}.hero h1{font-size:clamp(34px,4vw,54px);line-height:1.35;letter-spacing:-2.8px}.hero-description{font-size:15px}.hero-visual{height:420px;border-radius:28px;background:#f5ecdd;box-shadow:0 16px 50px #674d2510;overflow:hidden}.hero-visual .type-art{width:320px;height:426px;transform:none;margin-top:0}.floating-note{z-index:2;background:#fffdf4e8;backdrop-filter:blur(8px);border-radius:14px;font-size:11px}.note-one{top:70px;right:12px}.note-two{bottom:96px;left:12px}.visual-caption{z-index:2;bottom:18px;background:#fff9eeeb;padding:10px 22px;border-radius:30px}.orbit-label{z-index:2}.primary{border-radius:16px;box-shadow:0 8px 20px #355c4520}.preview-grid{gap:22px}.preview-card{background:#fff9f0;border:1px solid #e7dfcd;box-shadow:0 8px 25px #654f2910;padding:22px;border-radius:24px;overflow:hidden}.preview-card:hover{box-shadow:0 14px 32px #654f2920}.preview-card .type-art{width:210px;height:280px;transform:none;margin:12px auto 18px}.preview-card h3{font-size:23px}.tags span{background:#e8eddf;color:#54694f}.pill{background:#fffaf0}.result-card{background:#fff8ec!important;border:1px solid #e4d9c1;box-shadow:0 18px 50px #73532e14;border-radius:28px}.result-card .type-art{width:270px;height:360px;margin:18px auto 12px}.result-card h2{font-size:38px}.detail-panel{background:#fffdf8;border-color:#e7dfcd;border-radius:22px}.rating-panel{background:#f1eddf;border-radius:20px;margin-top:22px}.choice{background:#fffdf8;border-radius:16px}.question-shell{background:#fffcf5;border:1px solid #eee5d3;border-radius:26px;margin-top:28px;padding:30px}.quiet-note{margin-top:20px;background:#efeada}.edition b{background:#e5ecd9}.how-section{margin:0 0 50px;padding:28px;background:#edeedf;border-radius:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.how-section small{font-size:10px;letter-spacing:2px;color:#849076}.how-section h3{font-size:16px;margin:10px 0}.how-section p{font-size:12px;color:#77806d}.collection-link{font-size:12px;color:#375c47;display:inline-block;margin-top:22px;border-bottom:1px solid #b3bfa1;padding-bottom:6px}.field-guide{max-width:1240px;margin:auto;padding:42px 40px}.field-guide h1{font-size:36px;letter-spacing:-1.5px;margin:25px 0 12px}.field-guide>p{color:#7e8375;font-size:14px;margin-bottom:35px}.character-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.character-grid .type-art{width:180px;height:240px;transform:none;margin:18px auto}.character-grid h2{font-size:20px;margin:10px 0}.character-grid p{font-size:12px;color:#7e8375}.character-grid .symbol{background:#edf0e2;border-radius:12px;padding:8px;margin:14px 0;font-size:10px}.character-grid .preview-top{font-size:9px}
@media(max-width:900px){.character-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.hero{grid-template-columns:1fr;padding:38px 0;gap:28px}.hero h1{font-size:37px;letter-spacing:-1.8px}.hero-description{font-size:13px}.hero-visual{height:390px;margin:0;border-radius:24px}.hero-visual .type-art{width:285px;height:380px;transform:none;margin:0}.preview-card .type-art{position:relative;right:auto;top:auto;width:210px;height:280px;transform:none;margin:12px auto}.preview-card h3,.preview-card p{max-width:none}.preview-card h3{margin-top:0}.preview-card .tags{margin-top:18px}.how-section{grid-template-columns:1fr;gap:22px;padding:24px}.question-shell{margin:20px 14px 0;padding:25px 20px}.result-card .type-art{width:240px;height:320px}.result-card h2{font-size:32px}.field-guide{padding:30px 20px}.field-guide h1{font-size:27px}.character-grid{gap:10px}.character-grid .preview-card{padding:14px 9px}.character-grid .type-art{width:135px;height:180px}.character-grid h2{font-size:16px}.character-grid .preview-top{font-size:8px}.character-grid p{font-size:10px}.character-grid .symbol{font-size:9px}.site-header{height:77px}}