/* Feiqi visual edition: three distinct layouts, one illustrated travel-journal system. */
:root { --paper:#fcf8f3; --ink:#493a3e; --muted:#7b6866; --rose:#94566e; --line:#e8d9d1; --petal:#f2dce1; --sage:#9aaa99; --gold:#b99b72; --shadow:0 16px 45px #76515d0b; }
body { background:var(--paper); }
button, a { transition:background-color .2s, color .2s, border-color .2s, box-shadow .2s; }
button:focus-visible, a:focus-visible { outline:2px solid #895168; outline-offset:4px; }
.shell { width:min(1160px,calc(100% - 96px)); }
.site-header { background:#fcf8f3ed; }
.header-inner { min-height:104px; border-bottom:1px solid #dfc9c577; }
.brand { gap:11px; font-size:32px; }.brand img { width:40px; height:40px; }
.desktop-nav { gap:5px; margin:0; padding:5px; border:1px solid #eadbd5; background:#fffaf680; border-radius:40px; }
.desktop-nav a { padding:11px 17px; border-radius:30px; font-size:12px; gap:5px; }.desktop-nav a:hover,.desktop-nav a.current { background:#f2e2e3; color:#94566e; }.desktop-nav a::after { display:none; }.desktop-nav a span { font-size:7px; }
.header-note { display:flex; flex-direction:column; position:relative; padding-left:24px; font:13px var(--serif); color:#8e6c70; letter-spacing:1px; }.header-note i { position:absolute; left:0; top:4px; font-size:22px; font-style:normal; }.header-note small { margin-top:5px; font:6px var(--mono); letter-spacing:1.2px; color:#b09389; }
#main { position:relative; isolation:isolate; overflow:clip; }
#main::before { content:""; position:absolute; z-index:-1; top:0; left:0; right:0; height:720px; background:linear-gradient(90deg,#fcf8f3f5 5%,#fcf8f3ed 48%,#fcf8f3ba),linear-gradient(0deg,#fcf8f3,transparent 50%),url('../assets/profile-garden.webp') center 35% / cover; opacity:.78; }
.hero { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:42px; min-height:705px; padding:48px 0 45px; }
.hero-copy { padding:0 0 10px; }.journal-edition { display:inline-flex; gap:20px; align-items:center; color:#aa847f; font:11px var(--serif); border-bottom:1px solid #d6babe; padding-bottom:10px; margin-bottom:35px; letter-spacing:2px; }.journal-edition i { font:8px var(--mono); color:#b3968b; letter-spacing:1px; }
.hero-copy .eyebrow { font-size:8px; letter-spacing:1.7px; margin-bottom:19px; }.hero-name { margin:0 0 15px; font-size:18px; letter-spacing:1px; }.hero h1 { font-size:clamp(59px,5.8vw,81px); line-height:1.28; letter-spacing:-1px; margin-bottom:25px; }.hero-description { line-height:2.15; color:#806b65; font-size:13px; }
.hero-actions { margin-top:29px; gap:27px; }.button { border-radius:5px; min-height:49px; }.primary { background:#94566e; box-shadow:0 6px 13px #9c627121; }.primary:hover { background:#7f4059; }.hero-footnote { margin-top:23px; color:#9a857b; }
.hero-art-v2 { margin:0 8px 0 0; padding:36px 18px 29px; border:1px solid #e3cbd0; outline:1px solid #eedfe0; outline-offset:7px; border-radius:47% 47% 9px 9px; background:#fff; box-shadow:0 25px 65px #b8808d13; }
.hero-art-v2 .garden-art { width:100%; height:500px; max-height:500px; object-fit:contain; }
.hero-art-v2 .art-caption { top:20px; right:0; width:100%; text-align:center; font:8px var(--mono); letter-spacing:2px; color:#ba929a; }.hero-art-v2 .vertical-note { right:-31px; top:25%; font-size:11px; color:#ae8b8b; letter-spacing:3px; }.hero-art-v2 .mood-sticker { left:-30px; bottom:24px; border-radius:5px; padding:13px 17px; background:#fffaf4; border-color:#dfc8c6; box-shadow:4px 6px 0 #eddfe059; }.spark-one { left:-13px; top:14%; }.spark-two { right:-23px; top:53%; }
.interest-strip { border-block:1px solid #dfcac2; min-height:69px; font-size:10px; }.interest-strip i { font-size:19px; }.strip-label { color:#b09385; font-size:8px; letter-spacing:1.3px; }.interest-strip > span:not(.strip-label) { color:#8c7770; font-size:10px; }
.journey-invitation { display:grid; grid-template-columns:72px minmax(0,1fr) auto; align-items:center; gap:25px; margin-top:39px; padding:28px 33px; border:1px solid #ead3d6; border-radius:8px; background:linear-gradient(110deg,#f6e6e7,#fbf1e9 60%,#f6ece0); position:relative; }
.journey-invitation::before { content:""; position:absolute; inset:5px; border:1px solid #fffaf5c9; border-radius:5px; pointer-events:none; }.invitation-seal { width:63px; height:70px; border:1px solid #cd9eac; border-radius:50%; display:grid; align-content:center; justify-items:center; gap:2px; color:#aa6d83; transform:rotate(-8deg); }.invitation-seal > span { font-size:27px; }.invitation-seal small { font:6px var(--mono); letter-spacing:2px; }.invitation-kicker { color:#b08a85; font:8px var(--sans); letter-spacing:1px; margin:0 0 7px; }.journey-invitation h2 { font:29px/1.3 var(--serif); }.journey-invitation > div > p:last-child { font-size:10px; line-height:1.8; color:#aa8a7b; margin:10px 0 0; }.invitation-actions { display:grid; justify-items:start; gap:10px; position:relative; }.invitation-actions a { font:17px var(--serif); color:#8f586d; padding-bottom:9px; border-bottom:1px solid #ba8d99; }.invitation-actions a span { margin-left:22px; }.invitation-actions > span { font-size:8px; color:#aa8d7d; }
.section-space { padding-block:88px; }.section-heading h2 { font-size:39px; line-height:1.5; }.section-heading .eyebrow { font-size:8px; letter-spacing:2px; }.about-section { grid-template-columns:1fr 1.2fr .76fr; gap:46px; }.about-body { padding-top:33px; }.about-body p { font-size:12px; line-height:2.2; }.about-body .about-lead { font-size:18px; }.little-note { background:#f3e5df; box-shadow:6px 8px 0 #e4cfc539; margin-top:40px; }.interest-tags span { background:#eee5da; border-radius:3px; color:#9a7f70; }
.projects-section { background:#f3ede5; border-color:#e5d9cd; position:relative; }.projects-section::before,.playground-section::before { content:"✦"; position:absolute; top:-12px; left:calc(50% - 13px); width:26px; background:var(--paper); text-align:center; font-size:21px; color:#be939d; }.project-grid { gap:25px; }.project-card { border:1px solid #e3d1c7; border-radius:8px; box-shadow:0 10px 24px #8d655309; }.project-visual { height:253px; }.project-content { padding:25px; }.project-content h3 { font-size:29px; color:#735360; }.project-content p { font-size:11px; line-height:1.95; }.project-meta { font-size:7px; color:#a88d82; }.filter.active { box-shadow:0 2px 4px #80585108; }.project-bottom { margin-top:21px; }.projects-disclaimer { color:#a08a7c; }
.wardrobe-section { gap:75px; padding-block:99px; }.wardrobe-intro h2 { font-size:46px; }.look-frame { border:1px solid #dec7ca; outline:1px solid #efe2de; outline-offset:7px; height:527px; border-radius:46% 46% 10px 10px; padding-top:33px; }.look-button { border-radius:5px; min-height:76px; background:#fffaf5; }.look-button.active { background:#f4e2e6; box-shadow:inset 3px 0 #b87a90; }.look-button small { font-size:9px; }.wardrobe-stage figcaption { margin-top:26px; padding:20px 24px; background:#fbf0eb; border-color:#ddc1c4; }
.playground-section { position:relative; }.playground-layout { gap:70px; }.idea-desk { border-radius:7px; background:repeating-linear-gradient(0deg,transparent,transparent 30px,#cfb8ac13 30px,#cfb8ac13 31px),#fffaf4; border:1px solid #dfc4c4; box-shadow:7px 9px 0 #eadad75c; padding:28px 31px; }.desk-heading { color:#b78c93; font-size:8px; }.idea-prompt h3 { font-size:27px; }.idea-category { border-radius:4px; }.explore-paths article { gap:22px; }.path-symbol { border-color:#d7bfc2; width:41px; height:41px; }.explore-paths h3 { font-size:23px; }
.in-between { padding-block:70px; }.in-between p { font-size:32px; }.contact-section { padding-block:64px; }.contact-links > a,.contact-links > button { background:#f6eae4; border-color:#e2cdc5; border-radius:6px; }.site-footer { margin-top:0; border-top:1px solid #dfc9c2; padding-block:29px; }
/* The archive: portrait passport beside a layered, indexed paper dossier. */
.profile-backdrop { background:linear-gradient(#fcf5ee48,#f8efe9d9 60%,#f7eee9),url('../assets/profile-garden.webp') center top / 100% auto no-repeat; }
.profile-shell { width:min(1180px,calc(100% - 88px)); }.profile-topbar { min-height:75px; border-bottom:1px solid #d5b8b088; }.profile-home { background:#fffbf4b8; padding:10px 15px; border:1px solid #dfc6bc; border-radius:4px; }.profile-heading { padding:29px 0 32px; }.profile-flourish { display:block; color:#bb8a94; letter-spacing:5px; font-size:14px; margin-bottom:15px; }.profile-heading h1 { font-size:48px; }.profile-heading .eyebrow { font-size:8px; }.profile-heading > p:last-of-type { font-size:11px; color:#947769; }.profile-heading .profile-adventure-link { min-height:40px; margin-top:17px; font-size:10px; }
.rpg-layout { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:38px; }.rpg-portrait-panel { position:sticky; top:23px; padding:35px 18px 19px; border-radius:145px 145px 7px 7px; outline-offset:6px; background:#fff; box-shadow:0 20px 50px #95697715; }.profile-portrait { height:498px; }.portrait-plaque > span { font-size:34px; }.portrait-passport { display:flex; justify-content:center; gap:22px; padding-top:15px; border-top:1px solid #eeded8; margin-top:17px; }.portrait-passport > span { display:grid; gap:5px; font-size:7px; color:#b5988d; text-align:center; letter-spacing:.5px; }.portrait-passport b { font:13px var(--serif); color:#967082; }
.rpg-window { overflow:visible; position:relative; border-radius:7px; background:#fffaf5; box-shadow:6px 7px 0 #e7d4d87a,12px 14px 0 #ecdfd249; }.rpg-window::after { content:""; position:absolute; inset:7px; border:1px solid #eddeda; border-radius:3px; pointer-events:none; }.rpg-windowbar { position:relative; z-index:1; border-radius:6px 6px 0 0; padding:14px 25px; background:linear-gradient(90deg,#edd6da,#f2e3df); font-size:18px; }.profile-tabs { position:relative; z-index:1; gap:0; padding:16px 25px 0; }.profile-tab { flex:1; border-radius:4px 4px 0 0; font-size:20px; padding:10px 12px 13px; }.profile-tab.active { background:#f3e4e5; border-color:#a86d87; color:#8f526d; }.profile-panel { padding:29px 32px 31px; min-height:430px; }.profile-panel h2 { font-size:31px; }.panel-eyebrow { font-size:7px; letter-spacing:2px; }.character-facts { margin-top:25px; gap:20px; }.character-facts dt { color:#b49787; }.character-facts dd { font-size:12px; }.trait-card { border-radius:4px; padding:18px 19px 15px; background:#f6ede4; border-color:#e1cdbf; }.trait-card .stat-row { margin:13px 0; }.trait-card > span { font-size:8px; color:#ac867b; }.stat-row meter { height:8px; }.stat-row meter::-webkit-meter-optimum-value { background:linear-gradient(90deg,#d5a1b3,#a76a86); }.quest-list { gap:24px; }.inventory-list article { background:#fffdf8; padding:16px; border-radius:4px; }.chapter-picker { gap:8px; margin:23px 0; }.chapter-button { min-height:40px; min-width:40px; border-radius:4px; }.chapter-page { min-height:298px; }.chapter-page h3 { font-size:28px; }.chapter-page > p { font-size:8px; }.chapter-navigation { border-top-style:dashed; }
.rpg-dialogue { margin-top:30px; padding:28px 58px 25px 125px; border-radius:6px; background:#fffaf4; box-shadow:4px 5px 0 #e5cdd67a; }.dialogue-content p { font-size:20px; }.dialogue-speaker { border-radius:4px; background:#a36882; }.chibi-guide { width:118px; bottom:4px; }.chibi-guide img { height:133px; }
.party-section { margin-top:65px; background:#fcf5eecf; border-color:#d6b4bb; padding:38px 39px; border-radius:8px; }.party-index { display:block; text-align:center; font:8px var(--mono); letter-spacing:2px; color:#b79883; margin:0 0 17px; }.party-heading h2 { font-size:38px; }.party-grid { gap:25px; margin-top:29px; }.companion-card { border-radius:6px; background:linear-gradient(#fbf6eb,#f3ebdf); padding:18px 20px 20px; }.companion-card:nth-child(2) { background:linear-gradient(#f6f3ec,#eae8e9); }.companion-card:nth-child(3) { background:linear-gradient(#fbf3e7,#f3e7d8); }.companion-card.active { border-color:#aa748b; box-shadow:inset 0 0 0 3px #fffaf5,0 9px 22px #ab768819; }.companion-art { height:223px; }.companion-card strong { font-size:29px; }.companion-details { margin-top:28px; padding:29px; border-radius:5px; background:#fffaf4; gap:35px; }.companion-quote { background:linear-gradient(160deg,#f7e9e780,transparent); padding:17px 15px 15px 27px; }.companion-sheet-heading { border-bottom:1px dashed #dfc6bc; padding-bottom:11px; }.companion-equipment { padding-top:12px; border-top:1px dashed #e7d6ca; }
/* The adventure: a small illustrated theater, with a practical travel-status rail. */
.adventure-view { background:linear-gradient(180deg,#f7ebe7,#fcf8f3 720px); }
.adventure-shell { width:min(1180px,calc(100% - 88px)); max-width:1180px; }.adventure-breadcrumb { padding-top:26px; font-size:10px; gap:15px; }.adventure-breadcrumb a { padding:7px 10px; border:1px solid #e2ccc2; background:#fffaf4a6; border-radius:4px; }
.adventure-header { position:relative; isolation:isolate; overflow:hidden; margin-top:23px; padding:39px 44px; min-height:255px; border:1px solid #ddc5bb; border-radius:9px; background:#fcf4e9; box-shadow:var(--shadow); }.adventure-scenery { position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#fff7e9ef,#fff5e4ad 53%,#f9ece74a),url('../assets/profile-garden.webp') center 55% / cover; }.adventure-header::after { content:""; position:absolute; inset:7px; border:1px solid #fffaf4b9; border-radius:5px; pointer-events:none; }.adventure-header > div:not(.adventure-scenery) { position:relative; z-index:1; }.adventure-header .eyebrow { font-size:8px; color:#a48076; letter-spacing:2px; }.adventure-header h1 { font-size:57px; line-height:1.12; color:#86546b; }.adventure-header h1 > span { font-size:19px; color:#927268; margin-top:13px; }.adventure-intro { font-size:11px; line-height:1.9; color:#987d70; margin-top:15px; }.adventure-header-note { position:relative; flex-basis:285px; padding:0 0 0 155px; border:0; }.adventure-header-note img { position:absolute; width:170px; height:190px; object-fit:contain; left:-14px; top:50%; transform:translateY(-50%); }.adventure-header-note > span { color:#bd9c74; font-size:25px; }.adventure-header-note p { font-size:18px; line-height:1.6; margin:8px 0; color:#8f6d69; }.adventure-header-note small { font-size:8px; color:#a28673; }
.adventure-trail { margin:30px 0 26px; padding-top:0; border-color:#d9bfc0; }.adventure-trail li { font-size:9px; color:#aa8b85; padding-top:14px; }.adventure-trail li.current { color:#965c76; }.adventure-trail li.current::before { background:#af718c; border-color:#af718c; box-shadow:0 0 0 4px #f0dce3; }
.adventure-layout { grid-template-columns:minmax(0,1fr) 285px; gap:27px; }.adventure-story-card { padding:0 34px 33px; border:1px solid #d5b9bd; border-radius:7px; background:#fffcf7; box-shadow:6px 7px 0 #ead9dc74; }.adventure-theater-label { margin:0 -34px 0; padding:14px 27px; background:linear-gradient(90deg,#ecd6da,#f3e6de); border-bottom:1px solid #d7bac0; border-radius:6px 6px 0 0; display:flex; align-items:center; gap:12px; color:#97697b; font:17px var(--serif); }.adventure-theater-label > span { font-size:20px; }.adventure-theater-label i { font:6px var(--mono); letter-spacing:1.5px; margin-left:auto; color:#b1908f; }.adventure-scene-top { padding:19px 0 16px; border-bottom-style:dashed; color:#af9185; font-size:9px; }.adventure-scene-heading { padding-top:26px; }#adventure-place { color:#a2877c; font-size:9px; letter-spacing:1px; }#adventure-scene-title { font-size:34px; line-height:1.4; color:#80556b; margin-bottom:20px; }.adventure-story { font-size:13px; line-height:2.2; color:#745e56; }.adventure-story p { margin-bottom:17px; }
.adventure-feedback { background:#f2e5e1; border-left-color:#b77e91; border-radius:0 4px 4px 0; }.adventure-feedback p { font-size:18px; }.adventure-choice-heading { margin-top:27px; padding-top:18px; border-top:1px solid #eadad0; }.adventure-choice-heading h3 { font-size:19px; color:#916975; }.adventure-choices { gap:11px; }.adventure-choice { border:1px solid #dfc9c4; background:#fffaf5; border-radius:5px; padding:16px 18px; gap:15px; min-height:92px; box-shadow:0 3px 0 #efe4db66; }.adventure-choice-number { width:25px; height:25px; flex-basis:25px; display:grid; place-items:center; border:1px solid #e5cbd0; color:#b68998; transform:rotate(45deg); font-size:8px; border-radius:4px; }.adventure-choice strong { font-size:20px; color:#785965; }.adventure-choice-actor { font-size:8px; letter-spacing:1px; color:#ae7b8d; }.adventure-choice small { font-size:10px; line-height:1.65; color:#988177; }.adventure-choice:hover:not(:disabled) { border-color:#b57993; background:#fceef0; transform:translateX(3px); box-shadow:0 5px 13px #9c62700c; }.adventure-choice:disabled { background:#f2ece6; box-shadow:none; }.adventure-choice:disabled .adventure-choice-number { border-color:#d9cbbd; }
.adventure-sidebar { gap:19px; position:sticky; top:24px; }.adventure-hud { background:#f3e1e4; border-color:#d3b0bc; border-radius:6px; padding:21px; }.adventure-hud-heading h2 { font-size:23px; color:#885d72; }.adventure-hud-heading > strong { color:#a56b83; font-size:17px; }.adventure-lamp-pips { margin-block:17px 14px; gap:7px; }.adventure-lamp-pips > span { height:17px; border-radius:50% 50% 3px 3px; background:#e7d1ce; border-color:#cdb6a6; }.adventure-lamp-pips > span.lit { background:linear-gradient(#f2d9ae,#cba575); border-color:#b39468; box-shadow:0 2px 9px #daba892d; }#adventure-lamp-note { font-size:9px; color:#997b75; }.adventure-party { background:#fffaf4; border-radius:6px; border-color:#deccc0; padding:21px; }.adventure-party-member { padding-block:13px 0; }.adventure-party-member > img { width:49px; height:49px; border-radius:7px; background:#f2e8dc; border:1px solid #e6d7c4; }.adventure-party-member h3 { font-size:19px; }.adventure-party-status { font-size:8px; }.adventure-bag { background:#f4ebdf; border-style:dashed; border-color:#cfb99d; border-radius:6px; padding:20px; }.adventure-bag li { background:#fffaf0; border-color:#dfcbb4; border-radius:3px; font-size:9px; }.adventure-quest { position:relative; background:#f7eee2; border:1px solid #e0cab0; padding:24px 20px 18px; margin:0 4px; transform:rotate(-1deg); box-shadow:3px 4px 0 #e8d9c954; }.quest-pin { position:absolute; left:calc(50% - 11px); top:-12px; background:#ead4b5; color:#ad8667; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; }.adventure-quest-label { font-size:8px; color:#ad8765; }.adventure-quest h2 { font-size:20px; }.adventure-quest p { font-size:10px; }.adventure-tools { padding:25px 0; border-color:#dfc9bc; }.adventure-tools > div { padding:0 14px; border:1px solid #dfc7bf; background:#fff9f2; border-radius:5px; gap:23px; }.adventure-tools button { font-size:10px; }.adventure-ending-moral { background:#faf0e5; border:1px solid #e8d2bf; border-radius:6px; padding:21px; font-size:24px; }.adventure-finished .adventure-story-card { background:linear-gradient(150deg,#fffcf7 60%,#f8e8eb); }
/* Tablet: preserve generous two-column rhythm without squeezing labels. */
@media (max-width:1120px) {
 .shell { width:calc(100% - 64px); }.header-note { display:none; }.desktop-nav a { padding-inline:15px; }.header-inner { min-height:92px; }
 .hero { gap:34px; min-height:656px; padding-block:40px; }.hero h1 { font-size:66px; }.hero-art-v2 .garden-art { height:460px; max-height:460px; }.hero-art-v2 .vertical-note { right:-24px; font-size:10px; }.hero-art-v2 .mood-sticker { left:-18px; padding:11px 13px; }.journal-edition { margin-bottom:28px; }
 .journey-invitation { grid-template-columns:62px minmax(0,1fr) auto; gap:20px; padding:25px; }.journey-invitation h2 { font-size:28px; }.invitation-actions a { font-size:15px; }
 .about-section { gap:30px; }.section-heading h2 { font-size:34px; }.project-grid { gap:18px; }.project-content { padding:22px 19px; }.project-content h3 { font-size:26px; }.project-visual { height:224px; }.wardrobe-section { gap:44px; }.wardrobe-intro h2 { font-size:40px; }.look-frame { height:500px; }.playground-layout { gap:42px; }
 .profile-shell,.adventure-shell { width:calc(100% - 56px); }.rpg-layout { grid-template-columns:minmax(0,.78fr) minmax(0,1.2fr); gap:29px; }.profile-panel { padding:26px; }.profile-portrait { height:474px; }.portrait-passport { gap:15px; }.party-section { padding:34px 30px; }.party-grid { gap:18px; }.companion-art { height:204px; }
 .adventure-layout { grid-template-columns:minmax(0,1fr) 258px; gap:22px; }.adventure-header { padding:34px; }.adventure-header-note { flex-basis:260px; padding-left:140px; }.adventure-header-note img { width:150px; height:172px; }.adventure-story-card { padding-inline:26px; }.adventure-theater-label { margin-inline:-26px; padding-inline:22px; }.adventure-sidebar { top:18px; }.adventure-hud,.adventure-party,.adventure-bag { padding:18px; }.adventure-choice { padding:14px;gap:11px; }
}
@media (max-width:850px) {
 .shell { width:calc(100% - 56px); }.desktop-nav a { font-size:11px; padding:10px 11px; }.desktop-nav a span { font-size:6px; }.brand { font-size:29px; gap:8px; }.brand img { width:35px;height:35px; }.hero { gap:28px; min-height:599px; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); }.hero h1 { font-size:56px; }.hero-description { font-size:11px; line-height:2; }.hero-actions { gap:16px; }.hero-actions .button { padding-inline:15px;font-size:11px;gap:12px; }.hero-footnote { font-size:7px; gap:5px; }.hero-name { font-size:16px; }.journal-edition { font-size:10px; margin-bottom:25px; }.hero-copy .eyebrow { font-size:6px;letter-spacing:1.2px;gap:8px; }.hero-art-v2 { padding:33px 11px 26px; }.hero-art-v2 .garden-art { height:430px;max-height:430px; }.hero-art-v2 .vertical-note { right:-21px;letter-spacing:2px; }.hero-art-v2 .mood-sticker { bottom:19px;left:-16px;gap:7px; padding:10px; }.hero-art-v2 .mood-sticker strong { font-size:12px; }.hero-art-v2 .mood-label { font-size:7px; }.mood-icon { font-size:24px; }.hero-art-v2 .art-caption { font-size:6px; }
 .journey-invitation { grid-template-columns:54px 1fr; gap:17px; padding:24px; }.invitation-seal { width:51px;height:59px; }.journey-invitation h2 { font-size:28px; }.invitation-actions { grid-column:2; display:flex; align-items:center; flex-wrap:wrap; gap:12px 19px; }.invitation-actions a { font-size:14px; padding-bottom:6px; }.invitation-actions > span { font-size:7px; }
 .about-section { grid-template-columns:1fr 1.2fr;gap:32px; }.little-note { grid-column:2;margin-top:0; }.section-space { padding-block:71px; }.project-grid { gap:19px; }.project-content { padding:24px; }.project-visual { height:240px; }.wardrobe-section { gap:32px; }.wardrobe-intro h2 { font-size:37px; }.look-frame { height:501px; }.look-button { min-height:57px; }.look-button small { font-size:8px; }.playground-layout { gap:29px; }.idea-desk { padding:24px; }.idea-prompt h3 { font-size:24px; }
 .profile-shell,.adventure-shell { width:calc(100% - 44px); }.rpg-layout { grid-template-columns:minmax(0,.75fr) minmax(0,1.2fr);gap:24px; }.profile-panel { padding:23px; }.profile-panel h2 { font-size:27px; }.profile-tabs { padding-inline:19px; }.profile-tab { font-size:18px; }.profile-portrait { height:452px; }.rpg-windowbar { padding-inline:20px;font-size:16px; }.rpg-dialogue { padding-left:104px;padding-right:45px; }.dialogue-speaker { left:108px; }.chibi-guide { width:98px; }.chibi-guide img { height:120px; }.dialogue-content p { font-size:18px; }.party-heading h2 { font-size:33px; }.companion-art { height:185px; }.companion-details { gap:27px;padding:25px; }.companion-stats { gap:11px; }
 .adventure-header { padding:31px; }.adventure-header h1 { font-size:51px; }.adventure-header-note { flex-basis:228px;padding-left:124px; }.adventure-header-note img { width:138px;height:162px; }.adventure-header-note p { font-size:16px; }.adventure-header-note small { font-size:7px; }.adventure-header h1 > span { font-size:17px; }.adventure-layout { grid-template-columns:minmax(0,1fr) 240px;gap:20px; }.adventure-story-card { padding-inline:22px; }.adventure-theater-label { margin-inline:-22px;padding-inline:20px; }.adventure-theater-label i { display:none; }#adventure-scene-title { font-size:29px; }.adventure-choice-number { flex-basis:21px;width:21px;height:21px; }.adventure-choice strong { font-size:18px; }.adventure-choice small { font-size:9px; }.adventure-hud,.adventure-party,.adventure-bag { padding:17px; }.adventure-party-member > img { width:44px;height:44px; }.adventure-party-member h3 { font-size:17px; }
}
/* Small tablets: turn the archive into a portrait introduction and single dossier. */
@media (max-width:760px) {
 .profile-shell { width:calc(100% - 40px); }.profile-topbar { min-height:66px; }.profile-chapter { font-size:7px;letter-spacing:1px; }.profile-heading { padding:26px 0 29px; }.profile-heading h1 { font-size:39px; }.profile-flourish { font-size:12px;margin-bottom:13px; }.profile-heading > p:last-of-type { font-size:10px; }.rpg-layout { grid-template-columns:1fr;gap:32px; }.rpg-portrait-panel { position:relative;top:auto;width:min(100%,360px);padding:31px 21px 18px; }.profile-portrait { height:390px; }.portrait-passport { gap:26px; }.portrait-plaque > span { font-size:30px; }.profile-panel { padding:27px;min-height:0; }.profile-panel h2 { font-size:31px; }.rpg-windowbar { padding:14px 24px;font-size:19px; }.profile-tabs { padding:15px 21px 0; }.profile-tab { font-size:20px; }.rpg-dialogue { margin-top:30px; padding:29px 54px 24px 120px; }.chibi-guide { width:112px; }.chibi-guide img { height:128px; }.dialogue-speaker { left:125px; }.dialogue-content p { font-size:20px; }.chapter-page { min-height:300px; }.party-section { margin-top:47px;padding:32px 22px; }.party-grid { gap:11px; }.companion-art { height:151px; }.companion-card { padding:14px 10px; }.companion-card strong { font-size:25px; }.companion-card > span:not(.companion-art) { font-size:9px;line-height:1.7; }.companion-card small { font-size:8px; }.companion-details { grid-template-columns:1fr;gap:23px;padding:26px; }.companion-quote { border-left:0;border-top:1px solid #e2cdc5;padding:20px 0 0;background:none; }.companion-sheet { margin-top:22px; }.companion-stats { gap:13px 25px; }
 .adventure-shell { width:calc(100% - 40px); }.adventure-layout { grid-template-columns:1fr; }.adventure-sidebar { position:static;grid-template-columns:1fr 1fr;gap:17px;align-items:start; }.adventure-party { grid-row:span 2; }.adventure-quest { grid-column:1/-1;transform:none; margin:7px 0 0; }.adventure-story-card { padding-inline:29px; }.adventure-theater-label { margin-inline:-29px;padding-inline:25px; }.adventure-theater-label i { display:block; }.adventure-hud,.adventure-party,.adventure-bag { padding:21px; }.adventure-choice { padding:16px; }.adventure-choice strong { font-size:20px; }.adventure-story { font-size:13px; }.adventure-header { padding:31px;min-height:253px; }.adventure-header-note { flex-basis:220px; }.adventure-header h1 { font-size:48px; }.adventure-trail { margin-top:26px; }.adventure-choice-number { transform:none;border-radius:50%;width:25px;height:25px;flex-basis:25px; }
}
/* Phones get their own vertical compositions, touch sizes and quieter decoration. */
@media (max-width:640px) {
 .shell { width:calc(100% - 44px); }.header-inner { min-height:79px; }.brand { font-size:28px; }.brand img { width:34px;height:34px; }.desktop-nav { display:none; }.menu-toggle { background:#fff9f3;border-color:#dec5c2; }.mobile-nav { background:#fcf1eb;border-color:#e3cdc6; }.mobile-nav a { border-bottom:1px solid #e9d8d080;font:18px var(--serif);padding:13px 8px; }.mobile-nav a:last-child { border:0; }
 #main::before { height:1020px;background-position:center top;opacity:.46; }.hero { display:grid;grid-template-columns:1fr;gap:31px;padding:38px 0 33px;min-height:0; }.hero-copy { padding:0 3px; }.journal-edition { font-size:10px;gap:20px;padding-bottom:8px;margin-bottom:25px; }.hero-copy .eyebrow { font-size:6px;letter-spacing:1.35px;margin-bottom:15px; }.hero-copy .hello-line { width:29px; }.hero-name { font-size:16px;margin-bottom:14px; }.hero h1 { font-size:clamp(48px,13vw,67px);line-height:1.24;letter-spacing:-.5px;margin-bottom:22px; }.hero-description { font-size:12px;line-height:2.1; }.hero-actions { margin-top:25px;gap:25px; }.hero-actions .button { font-size:12px;padding:14px 20px;gap:15px; }.hero-footnote { font-size:7px;gap:6px;margin-top:22px; }.hero-art-v2 { width:calc(100% - 26px);max-width:365px;margin:6px auto 7px;padding:32px 15px 29px;outline-offset:5px; }.hero-art-v2 .garden-art { height:440px;max-height:440px; }.hero-art-v2 .art-caption { top:16px;font-size:7px; }.hero-art-v2 .vertical-note { right:-23px;font-size:9px; }.hero-art-v2 .mood-sticker { left:-17px;bottom:24px;padding:12px 13px; }.hero-art-v2 .mood-sticker strong { font-size:13px; }.spark-one { left:-16px; }.spark-two { right:-17px; }.interest-strip { padding:19px 2px;gap:15px; }.interest-strip > span:not(.strip-label) { font-size:10px; }.interest-strip i { font-size:18px; }
 .journey-invitation { margin-top:29px;padding:24px 22px;grid-template-columns:1fr;gap:15px; }.invitation-seal { position:absolute;right:19px;top:19px;width:44px;height:50px;opacity:.55; }.invitation-seal > span { font-size:21px; }.invitation-seal small { font-size:5px; }.journey-invitation > div:nth-child(2) { padding-right:36px; }.journey-invitation h2 { font-size:28px;line-height:1.5; }.journey-invitation > div > p:last-child { font-size:10px;line-height:1.9; }.invitation-kicker { font-size:7px;letter-spacing:.7px; }.invitation-actions { grid-column:auto;gap:13px; }.invitation-actions a { font-size:17px;min-height:36px; }.invitation-actions > span { font-size:8px; }
 .section-space { padding-block:62px; }.about-section { grid-template-columns:1fr;gap:24px; }.section-heading h2 { font-size:34px; }.section-heading .eyebrow { font-size:7px;letter-spacing:1.6px; }.about-body { padding-top:0; }.about-body .about-lead { font-size:18px; }.about-body p { font-size:12px;line-height:2.15; }.little-note { grid-column:auto;width:94%;margin:10px auto 0;padding:26px; }.note-writing { font-size:24px; }.projects-section { padding-top:60px;padding-bottom:41px; }.projects-heading h2 { font-size:32px; }.project-grid { gap:25px; }.project-card { border-radius:7px; }.project-visual,.project-card:last-child .project-visual { height:257px; }.project-content { padding:24px; }.project-content h3 { font-size:29px; }.project-content p { font-size:12px; }.project-bottom { margin-top:23px; }.project-meta { font-size:7px; }.project-toolbar { margin-block:24px 22px; }.filter { min-height:44px;padding-inline:12px; }.projects-disclaimer { font-size:9px;line-height:1.9; }
 .wardrobe-section { gap:33px;padding-block:65px; }.wardrobe-intro h2 { font-size:36px; }.wardrobe-options { gap:9px;margin-top:25px; }.look-button { min-height:69px;padding:12px; }.look-button strong { font-size:19px; }.look-button small { font-size:8px; }.look-frame { height:445px;max-width:360px;outline-offset:5px;padding:31px 15px 13px; }.wardrobe-stage figcaption { padding:20px;margin-top:23px; }#look-title { font-size:26px; }#look-description { font-size:17px; }.wardrobe-footnote { font-size:8px;line-height:1.9; }
 .playground-layout { grid-template-columns:1fr;gap:33px;margin-top:31px; }.explore-paths { gap:25px; }.explore-paths h3 { font-size:23px; }.idea-desk { padding:25px;border-radius:6px; }.idea-prompt { min-height:187px; }.idea-prompt h3 { font-size:26px; }.idea-prompt p { font-size:12px; }.in-between { padding-block:61px; }.in-between p { font-size:26px;line-height:1.6; }.contact-section { padding-block:56px;gap:26px; }.contact-section h2 { font-size:31px; }.contact-links { gap:13px; }.contact-links > a,.contact-links > button { padding:21px; }.site-footer { padding-block:25px; }.site-footer .demo-footer { font-size:7px;line-height:1.8; }
}
@media (max-width:480px) {
 .profile-shell,.adventure-shell { width:calc(100% - 32px); }.profile-topbar { gap:12px; }.profile-home { font-size:10px;padding:10px 12px; }.profile-chapter { font-size:6px;letter-spacing:.5px; }.profile-chapter i { padding:0 4px; }.profile-heading { padding:26px 0 28px; }.profile-heading h1 { font-size:35px; }.profile-heading .eyebrow { font-size:6px;letter-spacing:1.8px; }.profile-heading > p:last-of-type { font-size:9px; }.profile-heading .profile-adventure-link { margin-top:18px; }.rpg-portrait-panel { width:calc(100% - 22px);max-width:335px;outline-offset:5px; }.profile-portrait { height:385px; }.portrait-passport { gap:25px; }.rpg-windowbar { padding:13px 18px;font-size:18px; }.profile-tabs { padding:13px 16px 0; }.profile-tab { padding:10px 7px 12px;font-size:19px; }.profile-panel { padding:25px 22px; }.profile-panel h2 { font-size:28px; }.character-facts { gap:19px 15px; }.character-facts dd { font-size:11px; }.trait-card { padding:15px; }.trait-card .stat-row { gap:10px; }.chapter-button { min-width:34px;min-height:39px; }.chapter-picker { gap:7px; }.chapter-page { min-height:355px; }.chapter-page h3 { font-size:25px; }#chapter-text p { font-size:12px;line-height:2.1; }.rpg-dialogue { padding:26px 44px 24px 105px; }.dialogue-content p { font-size:18px; }.chibi-guide { width:99px; }.chibi-guide img { height:120px; }.dialogue-speaker { left:108px;font-size:15px;padding-inline:19px; }#profile-dialogue-next { right:10px; }.party-section { padding:29px 16px; }.party-heading h2 { font-size:29px; }.party-heading .eyebrow { font-size:7px; }.party-index { font-size:6px;letter-spacing:1.7px; }.party-grid { gap:8px;margin-top:24px; }.companion-card { padding:11px 7px 13px; }.companion-art { height:115px; }.companion-card strong { font-size:23px; }.companion-card > span:not(.companion-art) { font-size:8px; }.companion-card small { font-size:7px; }.companion-details { padding:23px 17px;margin-top:21px; }.companion-stats { gap:13px 11px; }.companion-sheet-heading { gap:10px; }#companion-quote { font-size:20px; }.profile-footer { font-size:10px;gap:15px;line-height:1.8; }
 .adventure-breadcrumb { font-size:9px;padding-top:20px;gap:9px; }.adventure-breadcrumb a { padding:7px 8px; }.adventure-header { padding:26px 23px 28px;margin-top:19px;min-height:252px;display:block; }.adventure-scenery { background:linear-gradient(90deg,#fff7e9f2,#fff6e5b8 60%,#f8e8e887),url('../assets/profile-garden.webp') center / cover; }.adventure-header .eyebrow { font-size:6px;letter-spacing:1.1px;margin-bottom:16px; }.adventure-header h1 { font-size:45px;max-width:230px; }.adventure-header h1 > span { font-size:16px;max-width:195px;margin-top:11px; }.adventure-intro { font-size:10px;line-height:1.95;max-width:230px;margin-top:16px; }.adventure-header-note { position:absolute!important;right:10px;bottom:19px;width:97px;padding:0;text-align:right; }.adventure-header-note img { position:relative;left:auto;top:auto;transform:none;width:97px;height:107px; }.adventure-header-note > span { display:none; }.adventure-header-note p { font:7px/1.7 var(--sans);margin:3px 0 0;color:#a27e73; }.adventure-header-note small { display:none; }
 .adventure-trail { margin:25px 0 25px; }.adventure-trail li { font-size:8px;padding-top:13px;letter-spacing:0; }.adventure-layout { gap:25px; }.adventure-story-card { padding:0 19px 25px; }.adventure-theater-label { margin-inline:-19px;padding:12px 19px;font-size:17px; }.adventure-theater-label i { font-size:5px;letter-spacing:.8px; }.adventure-scene-top { padding-top:16px;font-size:8px; }.adventure-scene-heading { padding-top:23px;padding-right:29px; }#adventure-scene-symbol { font-size:27px; }#adventure-place { font-size:8px; }#adventure-scene-title { font-size:28px;line-height:1.5;margin-bottom:17px; }.adventure-story { font-size:12px;line-height:2.15; }.adventure-feedback { padding:12px; }.adventure-feedback p { font-size:17px; }.adventure-choice-heading { padding-top:15px;margin-top:23px; }.adventure-choice-heading h3 { font-size:18px; }.adventure-choice { padding:14px 11px;gap:11px;min-height:96px; }.adventure-choice-number { flex-basis:23px;width:23px;height:23px;font-size:8px; }.adventure-choice strong { font-size:18px;line-height:1.55; }.adventure-choice small { font-size:9px; }.adventure-choice-actor { font-size:8px;letter-spacing:.3px; }.adventure-choice-arrow { font-size:16px; }.adventure-sidebar { gap:13px; }.adventure-hud,.adventure-party,.adventure-bag { padding:17px 13px; }.adventure-hud-heading h2 { font-size:19px; }.adventure-hud-heading > strong { font-size:14px; }.adventure-party-member { gap:7px; }.adventure-party-member > img { width:36px;height:40px; }.adventure-party-member h3 { font-size:17px; }.adventure-party-member h3 > span { font-size:7px;margin-left:4px; }.adventure-party-status { font-size:7px; }.adventure-party .adventure-hud-heading { gap:4px; }.adventure-party .adventure-hud-heading > span { font-size:8px; }.adventure-kindness { font-size:8px; }.adventure-lamp-pips { gap:4px;margin-block:16px 12px; }.adventure-lamp-pips > span { height:15px; }#adventure-lamp-note { font-size:8px; }.adventure-bag li { font-size:8px; }.adventure-quest { padding:23px 19px 19px; }.adventure-quest h2 { font-size:20px; }.adventure-quest p { font-size:10px; }.adventure-tools { padding-block:23px;gap:13px; }.adventure-tools > div { padding-inline:12px;gap:18px; }.adventure-tools > a { font-size:10px; }.adventure-tools > p { font-size:9px; }.adventure-ending-moral { padding:20px 15px;font-size:22px; }
}
@media (max-width:360px) {
 .shell { width:calc(100% - 36px); }.hero h1 { font-size:46px; }.hero-art-v2 .garden-art { height:392px;max-height:392px; }.hero-art-v2 .mood-sticker { left:-10px;padding:10px; }.hero-art-v2 .mood-sticker strong { font-size:12px; }.hero-actions { gap:17px; }.hero-actions .button { padding-inline:16px; }.hero-footnote { font-size:6px; }.journey-invitation { padding:22px 19px; }.journey-invitation h2 { font-size:25px; }.invitation-actions { display:grid;gap:8px; }.section-heading h2 { font-size:30px; }.wardrobe-intro h2 { font-size:32px; }.look-button { padding:10px;gap:8px; }.look-button strong { font-size:17px; }.look-button small { font-size:7px; }.look-frame { height:395px; }.idea-desk { padding:22px; }
 .profile-shell,.adventure-shell { width:calc(100% - 28px); }.profile-heading h1 { font-size:31px; }.profile-chapter { display:none; }.profile-portrait { height:346px; }.portrait-passport { gap:20px; }.profile-panel { padding:23px 17px; }.trait-card { padding:13px; }.trait-card b { width:54px; }.trait-card .stat-row { gap:7px; }.rpg-dialogue { padding-left:86px;padding-right:40px; }.chibi-guide { width:80px; }.dialogue-speaker { left:87px; }.dialogue-content p { font-size:17px; }.party-section { padding-inline:13px; }.companion-art { height:96px; }.companion-card { padding-inline:5px; }.companion-card > span:not(.companion-art) { font-size:7px; }.companion-stats { grid-template-columns:1fr; }.chapter-button { min-width:31px; }.chapter-picker { gap:5px; }
 .adventure-header { padding:25px 20px; }.adventure-header h1 { font-size:39px; }.adventure-header h1 > span { font-size:15px; }.adventure-header-note { width:79px;right:8px;bottom:21px; }.adventure-header-note img { width:79px;height:92px; }.adventure-intro { font-size:9px;max-width:192px; }.adventure-header .eyebrow { font-size:5px; }.adventure-header-note p { font-size:6px; }.adventure-theater-label i { display:none; }.adventure-story-card { padding-inline:16px; }.adventure-theater-label { margin-inline:-16px; }.adventure-choice { gap:8px;padding-inline:9px; }.adventure-choice-number { flex-basis:20px;width:20px;height:20px; }.adventure-choice strong { font-size:17px; }.adventure-choice-arrow { font-size:14px; }.adventure-sidebar { grid-template-columns:1fr; }.adventure-party { grid-row:auto; }.adventure-party-member > img { width:46px;height:48px; }.adventure-party-status { font-size:9px; }.adventure-party-star { display:block; }.adventure-party .adventure-hud-heading { flex-wrap:nowrap; }.adventure-hud,.adventure-party,.adventure-bag { padding:20px; }
}
@media (prefers-reduced-motion:reduce) {
 button,a { transition:none!important; }.adventure-choice:hover:not(:disabled),.chibi-guide:hover,.project-card:hover,.primary:hover { transform:none; }
}
@media (forced-colors:active) {
 .hero-art-v2,.rpg-window,.adventure-story-card,.companion-card,.look-button,.adventure-choice { border:1px solid CanvasText; }.adventure-choice-number { border-color:ButtonText; }.profile-tab.active,.desktop-nav a.current { border-bottom:2px solid Highlight; }
}
/* Keep small numeric controls upright and portrait art comfortably inside its mount. */
.adventure-choice-number { transform:none; border-radius:50%; }
.companion-art { padding:5px 7px; }
@media (max-width:480px) { .adventure-intro { max-width:calc(100% - 85px); }.adventure-header { min-height:266px; }.companion-art { padding:3px; } }