:root{--bg:#F7F6ED;--bg1:#FFFDF5;--bg2:#E9E9D9;--bg3:#D9DDBB;--line:#D0D0BC;--line2:#A6A994;--line3:#70765F;--fg:#171C14;--fg2:#4A5142;--fg3:#535A48;--green:#ED7C3B;--green2:#CC6226;--green-deep:#4B5735;--green-ink:#171C14;--red:#A13226}
@font-face { font-family: 'Sora'; src: url('/fonts/sora-var-latin.woff2') format('woff2'); font-weight: 100 800; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url('/fonts/jetbrains-mono-var-latin.woff2') format('woff2'); font-weight: 100 800; font-display: swap; }
:root { --sans: 'Sora', system-ui, sans-serif; --mono: 'JetBrains Mono', monospace; --gut: 20px; --top: 82px; --ease: cubic-bezier(.2,.8,.2,1); color-scheme: light; }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--top) + 24px); }
body { margin: 0; min-height: 100vh; display: flex; flex-direction: column; background: var(--bg); color: var(--fg); font: 400 15px/1.65 var(--sans); -webkit-font-smoothing: antialiased; }
::selection { background: var(--green); color: var(--fg); }
img, svg, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, p, dl, dd, figure, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button:disabled { cursor: not-allowed; opacity: .4; }
:focus-visible { outline: 3px solid var(--green-deep); outline-offset: 4px; border-radius: 4px; }
[hidden] { display: none !important; }
.vh { position: absolute!important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.wrap { width: min(100% - 2 * var(--gut), 1240px); margin-inline: auto; }
.mono, .micro, .eyebrow, .k { font-family: var(--mono); }
.num { font-variant-numeric: tabular-nums; }
.micro, .k { font-size: 11px; line-height: 1.6; color: var(--fg3); }
.eyebrow { font-size: 11px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; line-height: 1.5; color: var(--fg2); }
.plate { display: inline-block; background: var(--bg1); border: 1px solid var(--line2); padding: 8px 16px; border-radius: 8px; }
.skip { position: fixed; top: -100px; left: 16px; z-index: 100; padding: 10px 16px; background: var(--fg); color: var(--bg1); }
.skip:focus { top: 10px; }
.top { position: sticky; top: 0; z-index: 30; padding: 14px 0; background: var(--bg3); }
.top-in { min-height: 54px; display: flex; gap: 20px; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex: none; background: var(--bg1); padding: 8px 18px 8px 12px; border: 1px solid var(--line2); border-radius: 999px; }
.brand-mark { height: 30px; width: 30px; flex: none; }
.wordmark { font-size: 21px; font-weight: 750; letter-spacing: -.05em; }
.nav { display: flex; gap: 3px; align-items: center; flex-wrap: wrap; }
.nav-a { display: inline-flex; justify-content: center; align-items: center; padding: 11px 12px; border-radius: 999px; font: 500 11px/1.2 var(--mono); white-space: nowrap; color: var(--fg2); }
.nav-a:hover, .nav-a[aria-current='page'] { background: var(--bg1); color: var(--fg); }
.nav-go { background: var(--fg); color: var(--bg1); padding-inline: 18px; }
.nav-go:hover, .nav-go[aria-current='page'] { background: var(--green-deep); color: var(--bg1); }
.nav-short { display: none; }
.foot { margin-top: auto; border-top: 1px solid var(--line2); background: var(--bg3); padding: 56px 0 30px; }
.foot-in { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 35px; }
.foot-brand { display: inline-flex; gap: 10px; align-items: center; font-size: 25px; letter-spacing: -.04em; }
.foot-tag { margin-top: 14px; max-width: 30ch; color: var(--fg2); font-size: 14px; }
.foot-col { display: grid; gap: 9px; align-content: start; font: 500 12px/1.5 var(--mono); }
.foot-col a:hover { text-decoration: underline; text-underline-offset: 4px; }
.foot-meta { grid-column: 1/-1; border-top: 1px solid var(--line2); padding-top: 24px; display: flex; flex-wrap: wrap; gap: 10px 25px; font: 500 10px/1.6 var(--mono); color: var(--fg3); }
.foot-social { display: flex; gap: 15px; margin-top: 15px; }
.foot-social a { display: flex; align-items: center; gap: 6px; }
.btn { min-height: 48px; padding: 14px 22px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; border: 1px solid transparent; border-radius: 999px; font: 600 13px/1.25 var(--sans); white-space: normal; text-align: center; transition: background .18s, color .18s, translate .18s; }
.btn:hover:not(:disabled) { translate: 0 -2px; }
.btn-go { background: var(--fg); color: var(--bg1); }
.btn-go:hover:not(:disabled) { background: var(--green-deep); }
.btn-line { background: transparent; border-color: var(--line3); }
.btn-line:hover:not(:disabled) { background: var(--bg2); }
.btn-s { min-height: 38px; padding: 9px 16px; font-size: 12px; }
.btn-wide { width: 100%; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.ic { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.text-link { display: inline-flex; gap: 12px; align-items: center; font-size: 13px; font-weight: 650; border-bottom: 1px solid var(--line3); padding-bottom: 5px; width: fit-content; }
.link { text-decoration: underline; text-underline-offset: 4px; }
.h1, .h2, .hero-t { font-weight: 800; letter-spacing: -.075em; line-height: .99; text-wrap: balance; }
.h1 { font-size: clamp(40px, 5.8vw, 76px); }
.h2 { font-size: clamp(34px, 4.2vw, 60px); }
.h3 { font-size: 23px; font-weight: 700; line-height: 1.2; letter-spacing: -.045em; }
.lead { font-size: clamp(15px, 1.3vw, 18px); color: var(--fg2); max-width: 58ch; line-height: 1.7; }
.state-note { font: 400 12px/1.7 var(--mono); color: var(--fg2); padding: 14px 0; max-width: 80ch; }
.state-note.is-error, .err { color: var(--red); }
.err { font-size: 12px; line-height: 1.6; margin-top: 6px; }
.err:empty { display: none; }
.hint { font-size: 12px; line-height: 1.7; color: var(--fg3); margin-top: 8px; }
.pill { font: 500 10px/1.3 var(--mono); display: inline-flex; padding: 6px 10px; border-radius: 999px; background: var(--bg2); border: 1px solid var(--line2); }
.copy { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line3); padding: 7px 10px; font: 500 11px/1.2 var(--mono); background: var(--bg1); border-radius: 6px; }
.note { padding: 20px; border-left: 3px solid var(--green); background: var(--bg2); font-size: 13px; line-height: 1.7; }
.in { display: block; width: 100%; min-width: 0; padding: 13px 14px; border: 1px solid var(--line3); border-radius: 10px; background: var(--bg1); font-size: 14px; line-height: 1.55; }
.in::placeholder { color: var(--fg3); opacity: 1; }
.in[aria-invalid='true'] { border-color: var(--red); }
.in-num { font-family: var(--mono); font-size: 12px; }
.ta { resize: vertical; }
.field { display: grid; gap: 8px; min-width: 0; }
.field-top { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.field-l { display: block; font-size: 13px; font-weight: 600; }
.count, .opt { font: 400 10px var(--mono); color: var(--fg3); }
.consent { display: flex; align-items: flex-start; gap: 10px; font-size: 12px; color: var(--fg2); }
.consent input { margin-top: 5px; flex: none; accent-color: var(--green-deep); }
.seg { display: flex; gap: 8px; flex-wrap: wrap; }
.seg-o { position: relative; cursor: pointer; }
.seg-o input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.seg-o span { display: block; padding: 10px 16px; border: 1px solid var(--line3); border-radius: 999px; font-size: 12px; }
.seg-o input:checked + span { background: var(--fg); border-color: var(--fg); color: var(--bg1); }
.seg-o input:focus-visible + span { outline: 3px solid var(--green-deep); outline-offset: 3px; }
.fs { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 16px; }
.fs-l { font: 600 11px var(--mono); text-transform: uppercase; letter-spacing: .06em; padding: 0 0 16px; }
.sheet { position: fixed; inset: 0; z-index: 70; background: rgb(23 28 20 / .45); display: grid; place-items: center; padding: 20px; }
.sheet-card { background: var(--bg1); border: 1px solid var(--line3); border-radius: 22px; width: min(100%, 420px); padding: 24px; max-height: 85vh; overflow-y: auto; }
.sheet-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.sheet-x { width: 36px; height: 36px; border: 1px solid var(--line2); background: var(--bg2); border-radius: 50%; font-size: 24px; }
.sheet-list { display: grid; gap: 10px; }
.sheet-row { width: 100%; display: flex; align-items: center; gap: 12px; padding: 14px; background: var(--bg2); border: 1px solid var(--line3); border-radius: 12px; font-size: 13px; text-align: left; }
.sheet-ic { width: 28px; height: 28px; border-radius: 6px; background: var(--bg3); }
.sheet-note { font-size: 13px; color: var(--fg2); }
@media (max-width: 900px) { :root { --top: 126px; } .top-in { flex-wrap: wrap; gap: 10px; } .nav { width: 100%; justify-content: space-between; gap: 0; } .nav-a { padding: 10px 9px; } .top { padding: 10px 0; } }
@media (max-width: 480px) { :root { --gut: 16px; --top: 130px; } .nav-long { display: none; } .nav-short { display: inline; } .nav-a { font-size: 9px; padding: 10px 7px; } .nav-go { padding-inline: 12px; } .brand { padding-block: 5px; } .wordmark { font-size: 20px; } .foot-in { grid-template-columns: 1fr 1fr; gap: 30px 20px; } .foot-in > div:first-child { grid-column: 1/-1; } .btn { padding-inline: 18px; } }
.main { flex: 1; padding-bottom: 80px; }
.home { background: var(--bg3); }
.home .main { background: var(--bg); }
.home .opening { height: 90px; }
.hero { width: 100%; background: var(--bg3); padding: 0 var(--gut) 12px; text-align: center; }
.hero .plate { font-size: 10px; padding: 4px 12px; }
.hero-t { font-size: clamp(44px, 4.5vw, 64px); margin: 8px auto; max-width: 18ch; }
.hero-t em { font-style: normal; color: var(--green-deep); }
.hero-s { max-width: 60ch; margin: 0 auto; color: var(--fg2); font-size: 15px; line-height: 1.6; }
.hero-cta { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 12px 0 8px; }
.page-head { padding-top: 18px; padding-bottom: 45px; }
.page-head .eyebrow { margin-bottom: 20px; }
.page-head .lead { margin-top: 24px; }
.editorial { padding-block: 72px; }
.editorial.compact { padding-block: 35px 65px; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 50px; margin-bottom: 30px; }
.section-head .eyebrow { margin-bottom: 20px; }
.section-copy { max-width: 34ch; color: var(--fg2); font-size: 14px; }
.full-band { background: var(--bg2); border-block: 1px solid var(--line); }
.duo, .how-block { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 70px; align-items: center; }
.editorial > *, .duo > *, .how-block > * { min-width: 0; }
.duo .eyebrow { margin-bottom: 18px; }
.duo .lead { margin-block: 25px; }
.paper-figure { background: var(--bg3); border-radius: 22px; border: 1px solid var(--line2); overflow: hidden; }
.paper-figure img { width: 100%; height: auto; min-height: 160px; object-fit: contain; }
.paper-figure figcaption { padding: 15px 20px; border-top: 1px solid var(--line2); }
.scene-art { width: 100%; height: auto; }
.browse-bar { display: flex; gap: 20px; align-items: flex-end; justify-content: space-between; margin-bottom: 10px; }
.search-label { width: min(100%, 380px); display: grid; gap: 8px; font: 500 11px var(--mono); }
.character-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.character-card { background: var(--bg1); border: 1px solid var(--line2); border-radius: 18px; overflow: hidden; }
.character-cover { background: var(--bg2); aspect-ratio: 4/5; overflow: hidden; }
.character-cover img { width: 100%; height: 100%; object-fit: cover; }
.character-body { padding: 20px; display: grid; gap: 12px; }
.character-body .h3 { font-size: 20px; }
.character-body p { font-size: 13px; color: var(--fg2); }
.character-body .micro { font-size: 10px; }
.empty-studio { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 40px; border: 1px solid var(--line2); border-radius: 20px; padding: 20px 40px 20px 10px; background: var(--bg1); }
.empty-studio .eyebrow { margin-bottom: 12px; }
.empty-studio p { font-size: 13px; color: var(--fg2); max-width: 40ch; }
.empty-studio .h3 { margin-bottom: 15px; }
.empty-studio .text-link { margin-top: 20px; }
.workspace { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: 45px; align-items: start; }
.paper-form { padding: 30px; background: var(--bg1); border: 1px solid var(--line2); border-radius: 20px; display: grid; gap: 22px; min-width: 0; }
.paper-form .state-note { padding-block: 0; }
.paper-form .btn { width: fit-content; }
.studio-aside { display: grid; gap: 24px; }
.aside-note { padding: 10px 20px; color: var(--fg2); font-size: 13px; line-height: 1.8; }
.aside-note .eyebrow { margin-bottom: 15px; }
.candidate-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.candidate { padding: 0; background: var(--bg1); border: 2px solid var(--line3); border-radius: 16px; overflow: hidden; text-align: left; }
.candidate[aria-pressed='true'] { border-color: var(--fg); box-shadow: 0 0 0 4px var(--bg3); }
.candidate img { aspect-ratio: 4/5; width: 100%; object-fit: cover; }
.candidate span { display: block; font: 500 11px/1.5 var(--mono); padding: 14px; }
.empty-outline { display: grid; justify-items: center; border: 1px dashed var(--line3); border-radius: 20px; padding: 15px 25px 30px; text-align: center; }
.empty-outline img { max-width: 800px; }
.empty-outline p { color: var(--fg2); font-size: 13px; }
.persona-work { display: grid; grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr); gap: 35px; align-items: start; }
.selected-portrait, .profile-portrait { background: var(--bg2); border: 1px solid var(--line2); border-radius: 20px; overflow: hidden; }
.selected-portrait img, .profile-portrait img { width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover; }
.example-posts { display: grid; gap: 12px; }
.example-posts li { padding: 18px; border: 1px solid var(--line2); border-radius: 12px; background: var(--bg1); font-size: 14px; color: var(--fg2); white-space: pre-wrap; }
.profile-layout { display: grid; grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr); gap: 45px; }
.profile-copy { display: grid; align-content: start; gap: 23px; min-width: 0; }
.profile-copy .micro { overflow-wrap: anywhere; }
.data-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 25px 20px; }
.data-grid dt { font: 500 10px/1.5 var(--mono); color: var(--fg3); margin-bottom: 7px; }
.data-grid dd { font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
.data-grid dd.mono { font-size: 11px; font-weight: 500; }
.feed-grid, .owner-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.feed-post { padding: 25px; border: 1px solid var(--line2); background: var(--bg1); border-radius: 18px; display: grid; align-content: start; gap: 18px; }
.feed-post p { font-size: 14px; white-space: pre-wrap; }
.feed-post .micro { font-size: 10px; }
.feed-post img, .feed-post video { width: 100%; border-radius: 12px; }
.session-bar { display: flex; gap: 25px; align-items: center; flex-wrap: wrap; }
.owner-card { padding: 26px; border: 1px solid var(--line2); background: var(--bg1); border-radius: 18px; display: grid; gap: 20px; }
.owner-card-top { display: flex; gap: 18px; align-items: center; }
.owner-card-top img { width: 75px; height: 88px; object-fit: cover; border-radius: 12px; }
.owner-card .actions .btn { font-size: 11px; }
.claim-lookup { max-width: 720px; }
.claim-box { padding: 20px; background: var(--bg2); border: 1px solid var(--line2); border-radius: 14px; display: grid; gap: 14px; }
.how-block .eyebrow { margin-bottom: 18px; }
.how-block .lead { margin-block: 25px; }
.vault-controls { margin-top: 28px; }
.how-block p:not(.lead):not(.eyebrow) { margin-top: 18px; font-size: 14px; color: var(--fg2); }
.risk-section { max-width: 1240px; }
.risk-section .h2 { margin: 20px 0 30px; }
.risk-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; margin-bottom: 38px; font-size: 13px; color: var(--fg2); }
.risk-section .paper-figure { max-width: 800px; }
.tier-table-wrap { width: 100%; max-width: 100%; overflow-x: auto; margin-top: 24px; border: 1px solid var(--line2); border-radius: 12px; }
.tier-table { width: 100%; min-width: 580px; border-collapse: collapse; font: 400 10px/1.7 var(--mono); background: var(--bg1); text-align: left; }
.tier-table caption { text-align: left; padding: 15px; background: var(--bg2); color: var(--fg2); }
.tier-table th, .tier-table td { padding: 12px; border-top: 1px solid var(--line); }
.tier-table th { font-weight: 600; }
.lost-actions { padding-block: 0 80px; }
.ln-grid { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,.7fr); gap: 35px; align-items: start; }
.ln-form { background: var(--bg1); border: 1px solid var(--line2); border-radius: 20px; padding: 30px; display: grid; gap: 35px; min-width: 0; }
.coin-row { display: grid; grid-template-columns: 145px 1fr; gap: 24px; }
.coin-fields { display: grid; gap: 20px; }
.drop { position: relative; min-width: 0; }
.drop-in { min-height: 145px; display: grid; place-items: center; background: var(--bg2); border: 1px dashed var(--line3); border-radius: 16px; overflow: hidden; cursor: pointer; }
.drop-empty { display: grid; justify-items: center; gap: 7px; padding: 20px; font-size: 12px; }
.drop-s { color: var(--fg3); font-size: 10px; }
.drop-ic { height: 24px; width: 24px; }
.drop-img { width: 100%; height: 145px; object-fit: cover; }
.drop.has-img .drop-empty { display: none; }
.drop.is-over .drop-in { border-style: solid; border-color: var(--fg); }
.drop:focus-within .drop-in { outline: 3px solid var(--green-deep); outline-offset: 3px; }
.in-wrap { position: relative; }
.in-pre, .in-ic, .in-lock, .in-suf { position: absolute; top: 50%; translate: 0 -50%; }
.in-pre, .in-ic { left: 14px; }.in-tk, .in-has-ic { padding-left: 40px; }.in-suf,.in-lock { right: 14px; color: var(--fg3); font: 500 10px var(--mono); }
.links { display: grid; gap: 18px; }
.chips { display: flex; gap: 8px; margin-top: 10px; }
.chip { background: var(--bg2); border: 1px solid var(--line3); border-radius: 999px; padding: 6px 16px; font: 500 11px var(--mono); }
.ln-sticky { position: sticky; top: calc(var(--top) + 24px); display: grid; gap: 18px; }
.card { display: grid; background: var(--bg1); border: 1px solid var(--line2); border-radius: 18px; overflow: hidden; }
.card-img { background: var(--bg2); aspect-ratio: 4/3; display: grid; place-items: center; }
.card-img img { width: 100%; height: 100%; object-fit: cover; }
.portrait-blank { width: 120px; height: 120px; }
.card-body { padding: 20px; display: grid; gap: 14px; }
.card-name { font-size: 20px; letter-spacing: -.03em; }.tk { font: 500 12px var(--mono); color: var(--fg3); }
.card-mc { display: flex; gap: 10px; align-items: center; }.card-tags { margin-left: auto; }.card-meta { display: grid; gap: 7px; font-size: 12px; color: var(--fg2); }
.bar { width: 100%; height: 4px; accent-color: var(--green-deep); }.side-art { background: var(--bg3); border-radius: 14px; }
.ln-go { grid-column: 1/-1; max-width: 650px; width: 100%; }
.review { scroll-margin-top: calc(var(--top) + 20px); }.rv-card { padding: 30px; border: 1px solid var(--line2); border-radius: 20px; background: var(--bg1); display: grid; gap: 25px; }.rv-grid { display: grid; grid-template-columns: 200px 1fr; gap: 25px; }.rv-img img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 14px; }.rv-dl { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; min-width: 0; }.rv-dl dd { margin-top: 5px; font-size: 13px; overflow-wrap: anywhere; }.rv-pre { white-space: pre-wrap; overflow-wrap: anywhere; font: 400 13px/1.7 var(--sans); }.rv-agent { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; }.rv-agent p:not(.k) { margin-top: 8px; font-size: 13px; }.rv-go { display: flex; gap: 12px; }.ref { background: var(--bg3); }.steps { display: grid; gap: 12px; }.steps li { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 12px; }.st-dot { width: 9px; height: 9px; background: var(--line2); border-radius: 50%; }.is-now .st-dot { background: var(--green); }.is-done .st-dot { background: var(--green-deep); }.is-bad .st-dot { background: var(--red); }.st-v { color: var(--fg3); font-size: 11px; }
@media (max-width: 900px) { .workspace, .ln-grid, .duo, .how-block { gap: 30px; } .character-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .paper-form, .ln-form { padding: 24px; } .ln-grid { grid-template-columns: minmax(0,1fr) 290px; }.coin-row { grid-template-columns: 110px 1fr; }.section-head { gap: 30px; }.rv-grid { grid-template-columns: 150px 1fr; } }
@media (max-width: 699px) { .main { padding-bottom: 40px; }.home .opening { height: 72px; }.hero { padding-bottom: 12px; }.hero-t { margin-block: 8px; }.hero-s { max-width: 34ch; font-size: 14px; line-height: 1.45; }.hero .plate { font-size: 9px; padding: 4px 10px; }.hero .micro { font-size: 9px; }.hero-cta { gap: 10px; }.page-head { padding-bottom: 30px; }.page-head .lead { margin-top: 20px; }.editorial { padding-block: 45px; }.section-head { display: grid; gap: 20px; margin-bottom: 25px; }.section-copy { max-width: 48ch; }.duo, .how-block, .workspace, .ln-grid, .persona-work, .profile-layout { grid-template-columns: 1fr; gap: 25px; }.paper-form, .ln-form { padding: 22px; }.empty-studio { grid-template-columns: 1fr; padding: 15px 24px 26px; gap: 5px; }.character-grid { gap: 15px; }.character-cover { aspect-ratio: 1; }.character-body { padding: 15px; }.character-body .h3 { font-size: 17px; }.candidate-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }.candidate span { font-size: 10px; }.selected-portrait, .profile-portrait { max-width: 420px; width: 100%; }.selected-portrait img, .profile-portrait img { aspect-ratio: 1; }.feed-grid, .owner-grid, .risk-grid { grid-template-columns: 1fr; gap: 18px; }.paper-figure img { min-height: 135px; }.how-block .paper-figure { order: 2; }.risk-grid { gap: 20px; }.ln-side { order: 2; }.ln-go { order: 3; }.ln-sticky { position: static; }.coin-row { grid-template-columns: 105px minmax(0,1fr); gap: 16px; }.drop-in { min-height: 130px; }.drop-img { height: 130px; }.card-img { aspect-ratio: 3/2; max-height: 250px; }.rv-grid { grid-template-columns: 1fr; }.rv-img { width: 170px; }.rv-dl { gap: 16px; }.rv-agent { grid-template-columns: 1fr; }.rv-card { padding: 22px; }.studio-aside { gap: 15px; } }
@media (max-width: 359px) { .hero-t { font-size: 40px; }.hero-cta .btn { min-height: 42px; padding: 10px 12px; font-size: 11px; }.character-grid { grid-template-columns: 1fr; }.kind-seg .seg-o span { padding-inline: 11px; }.coin-row { grid-template-columns: 1fr; }.drop { max-width: 160px; } }
.opening { width: 100%; height: 190px; overflow: hidden; background: var(--bg3); }
.opening .d-svg { width: 100%; height: 100%; }
.draw-arrive { an\69mation: paper-arrive .9s var(--ease) both; }
.draw-later { an\69mation-delay: .18s; }
.draw-loop { transform-box: fill-box; transform-origin: center; an\69mation: paper-breathe 6s ease-in-out 1.2s infinite; }
.brand-mark .mk-core { an\69mation: mark-arrive .7s var(--ease) both; }
.hero-t, .page-head .h1 { an\69mation: title-arrive .9s var(--ease) both; }
.is-new { an\69mation: value-arrive .35s var(--ease) both; }
@keyframes paper-arrive { from { opacity: 0; translate: 0 35px; } to { opacity: 1; translate: 0 0; } }
@keyframes paper-breathe { 0%,100% { rotate: -8deg; scale: .95; } 50% { rotate: 8deg; scale: 1.06; } }
@keyframes mark-arrive { from { opacity: 0; scale: .7; } }
@keyframes title-arrive { from { opacity: 0; translate: 0 15px; } }
@keyframes value-arrive { from { opacity: .4; translate: 0 4px; } }
@media (max-width: 699px) { .opening { height: 115px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { an\69mation: none !important; transition: none !important; scroll-behavior: auto !important; } }