/* Yumio 1.16 — the observed Sprite layout, with Yumio's own identity and services. */
:root{--night:#13100c;--night-2:#201c17;--night-3:#2e2820;--ink:#f0ede9;--muted:#a9a49f;--accent:#eacd9d;--accent-deep:#b09e89;--paper:#e9e6e1;--outline:#110f0d;--text:#1c1915;--line:#ffffff14}
body,.reference-home{background:var(--night)}
.brand{align-items:center;font-size:25px;line-height:1}
.ref-hero{height:850px;background:radial-gradient(ellipse at 6% -10%,#60544677,transparent 48%),linear-gradient(180deg,#191511,#2c261f 44%,#474038 73%,#3c352c)}
.ref-hero-copy{padding-top:170px;max-width:620px}
.reference-home h1{font-size:104px;line-height:.9;letter-spacing:-3.5px;margin:22px 0 26px}
.reference-home h2{font-size:62px;line-height:1;letter-spacing:-2px;max-width:780px}
.ref-hero-copy>p{font-size:19px;line-height:1.6;max-width:500px;color:#d7d2c9}
.reference-home>section{padding:128px 0;background:var(--night)}
.reference-home>section.flush{padding-top:0}
.ref-lead{font-size:19px;line-height:1.6;max-width:560px;color:#a9a49f}
.ref-label{color:var(--accent)}
.ref-beam{background:linear-gradient(112deg,#eacd9d13,transparent 32%)}
.hero-original-stage{position:absolute;width:420px;height:420px;right:8%;bottom:5px;z-index:3;pointer-events:none}
.hero-canonical.living-mascot{width:100%;height:100%;animation:none!important}
.ref-speech{left:auto;right:0;bottom:365px;width:236px;z-index:4;font-size:15px}
.ref-speech small{color:#68645f}
.ref-strip{background:#17130f}
.ref-strip .ref-wrap{min-height:74px;font-size:14px}
.ref-panels{grid-template-columns:1.1fr 1fr 1fr;gap:26px;margin-top:64px}
.ref-panel,.ref-panel:nth-child(2),.ref-panel:nth-child(3){background:var(--paper);border:2.5px solid var(--outline);border-radius:20px;min-height:340px;padding:24px;box-shadow:6px 6px 0 var(--accent);transition:none}
.ref-panel:nth-child(2){box-shadow:6px 6px 0 #e4d1b1}
.ref-panel:nth-child(3){box-shadow:6px 6px 0 #ffd36e}
.ref-panel:hover{transform:none}
.ref-panel-number{top:16px;right:18px;font:700 15px var(--serif);color:#6c6761}
.ref-user{background:var(--outline);color:var(--ink);border:0;border-radius:16px 16px 4px;padding:11px 14px;font-size:15px;line-height:1.45;max-width:88%}
.ref-assistant{background:#fff;color:var(--text);border:2px solid var(--outline);border-radius:16px 16px 16px 4px;padding:11px 14px;font-size:15px;line-height:1.45}
.ref-caption{color:#544f49;font-size:14px;max-width:70%;line-height:1.6}
.ref-receipt{background:#ffffffb0;border:2px dashed #18161366;color:var(--text);border-radius:12px;font-size:13px;padding:12px 14px;max-width:89%}
.ref-receipt code{font-size:12px;color:#544f49}
.ref-ok{background:var(--accent);color:var(--outline);border:1.5px solid var(--outline)}
.ref-panel>.panel-mascot{width:165px;height:165px;right:-5px;bottom:-6px;position:absolute}
.ref-preview{margin-top:64px;border-radius:22px;box-shadow:10px 10px 0 var(--accent)}
.ref-preview-app{grid-template-columns:1fr 1.05fr;height:470px}
.ref-preview-stage{background:radial-gradient(ellipse at 50% 48%,#443b3088,transparent 66%),#1a1611;padding:0}
.preview-mascot{width:280px;height:280px}
.ref-preview-chat{background:#201c17}
.ref-preview-assistant{background:#322c26}
.ref-preview-input{background:transparent}
.ref-details{grid-template-columns:1fr 1fr;gap:0 72px;margin-top:60px}
.ref-details article{display:grid;grid-template-columns:60px 1fr;gap:20px;padding:30px 0;border-top:1px solid var(--line);background:none;border-radius:0}
.ref-feature-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:14px;border:2.5px solid var(--outline);background:var(--paper);color:var(--outline);box-shadow:3px 3px 0 var(--accent)}
.ref-details h3{font:700 23px var(--serif);margin:0 0 6px}
.ref-details p{font-size:16px;color:var(--muted);margin:0}
.ref-steps{gap:44px;margin-top:72px}
.ref-night{background:radial-gradient(ellipse at 80% 100%,#4c423766,transparent 65%),linear-gradient(#13100c,#231e18);padding:120px 0 0}
.closing-mascot{width:330px;height:330px;margin-bottom:40px}
/* The workspace uses the same quiet surfaces as the public app illustration. */
.app-layout{background:radial-gradient(ellipse at 10% 0,#4e453a29,transparent 55%),linear-gradient(#1b1712,#2a241d)}
.app-main{height:100dvh}
.app-header{height:64px;min-height:64px;background:#17130fe8;padding:0 24px;gap:24px}
.workspace-topnav{background:#13100c66}
.workspace-tab{font-size:13px;padding:6px 13px}
.workspace-tab.selected{background:var(--paper);box-shadow:inset 0 0 0 2px var(--outline)}
.app-header-actions{gap:12px}
.app-social-link{font-size:14px;color:var(--muted)}
.network-chevron{display:none}
.chat-view{grid-template-columns:minmax(300px,.95fr) minmax(0,1.15fr);height:calc(100dvh - 64px);min-height:560px;max-width:1700px;margin:auto;gap:0;padding:0}
.companion-panel{grid-template-rows:minmax(200px,1fr) auto auto;padding:24px 28px;gap:12px;border-right:1px solid var(--line);background:none}
.companion-card{border:0;border-radius:0;box-shadow:none;background:radial-gradient(ellipse at 50% 55%,#483f3544,transparent 68%);overflow:hidden}
.companion-stage-clip{inset:0;align-items:center;overflow:hidden}
.chat-mascot{width:300px;height:300px;max-width:100%;max-height:100%}
.companion-hill{display:none}
.companion-info-card{background:#1c181380;border:1px solid #d5c7ae24;border-radius:12px;padding:12px 16px}
.companion-info-card h4{font-size:10px;letter-spacing:1.3px;color:#a8a199;margin:0 0 8px}
.companion-row{font-size:12px}
.companion-row strong{font-size:12px}
.companion-row+.companion-row{margin-top:7px}
.companion-info-card>.btn{margin-top:10px;padding:5px 10px;font-size:11px}
.companion-card-foot,.companion-card-foot button{font-size:11px}
.chat-panel{border:0;border-radius:0;background:#1d191480;min-width:0}
.chat-panel-top{min-height:60px;padding:14px 22px;border-bottom:1px solid var(--line)}
.chat-title{display:flex;align-items:center;gap:10px;min-width:0}
.chat-title strong{font-size:14px;font-weight:650}
.chat-tools{display:flex;align-items:center;gap:9px;margin-left:auto}
.chat-tools .icon-btn{font-size:11px;padding:5px 8px}
.automatic-voice-badge{display:flex;align-items:center;color:var(--muted);font-size:10px}
.automatic-voice-badge>span{display:none}
.automatic-voice-badge>.ico{height:15px;width:15px}
.chat-log{padding:24px 28px;gap:16px}
.chat-welcome{width:540px;padding:20px 0}
.welcome-mascot{display:none}
.chat-welcome h2{font-size:40px;line-height:1.1;letter-spacing:-1px}
.chat-welcome>p{font-size:14px;line-height:1.7;max-width:410px;margin:18px auto 24px}
.welcome-enable{background:#2c261f;border:1px solid #91887e44;box-shadow:none;padding:16px;gap:12px;border-radius:12px}
.welcome-enable strong{font-size:13px}
.welcome-enable span{font-size:12px}
.welcome-enable .btn{font-size:11px;padding:7px 10px;flex-shrink:0}
.welcome-starters{gap:8px;margin-top:12px}
.welcome-starters button{font-size:12px;background:#231e19;border:1px solid #9b938933;border-radius:10px;padding:12px 10px}
.welcome-starters small{font-size:10px}
.composer-area{padding:15px 22px 20px;border-top:1px solid #d5c7ae10;background:#1b171380}
.starter-questions{gap:7px;margin-bottom:11px}
.starter-questions button{font-size:10px;padding:6px 10px;border:1px solid #9b93893d;background:transparent;border-radius:999px;color:#d2c8b7}
.composer{background:#231e18;border:1px solid #8f867c5c;border-radius:12px;min-height:54px;padding:7px;box-shadow:none}
.composer textarea{font-size:14px;padding:8px 10px}
.send-btn{background:var(--accent);border:0;box-shadow:none;border-radius:9px;font-size:13px;padding:9px 14px}
.quota-chip{font:10px var(--mono);white-space:nowrap;color:#e2d2b8;border:1px solid #eacd9d30;border-radius:999px;padding:3px 8px}
.quota-chip.exhausted{color:#f1cc9a}
.quota-line{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:var(--muted);margin-top:10px}
.quota-meter{height:2px;background:#ffffff0c;overflow:hidden;margin-top:6px}
.quota-meter>span{display:block;height:100%;background:var(--accent);transition:width .3s}
.composer-meta{font-size:10px;margin-top:8px}
.voice-feedback{font-size:10px;color:var(--muted);margin-top:5px}
.voice-feedback:empty{display:none}
.msg-avatar{overflow:hidden;display:grid;place-items:center;background:#383129;border:1px solid #9c948a44;border-radius:9px;width:36px;height:36px}
.message-avatar-mascot{width:38px;height:38px}
.message-avatar-mascot .original-plush-art{overflow:hidden}
.msg-text{background:#322c26;border-radius:14px 14px 14px 4px;padding:11px 14px;line-height:1.6;font-size:14px}
.user .msg-text{background:var(--accent);color:var(--outline);box-shadow:none;border-radius:14px 14px 4px}
.chat-result{background:#1b1712;border:1px solid #eacd9d44}
.result-heading{background:#2f2922}
.message-receipt{margin-left:48px;width:min(420px,calc(100% - 48px))}
.reference-empty{background:radial-gradient(ellipse at 50% 35%,#4e453a26,transparent 60%);min-height:calc(100dvh - 64px);padding:48px 24px 65px}
.empty-mascot{width:220px;height:220px}
.reference-empty h2{font-size:40px;line-height:1.12;letter-spacing:-.8px}
.reference-empty p{font-size:14px;line-height:1.7;max-width:430px;margin:18px auto 22px}
.empty-networks,.empty-activity-guide{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin:28px auto 17px;max-width:670px}
.empty-networks>span,.empty-activity-guide>span{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted);padding:7px 11px;border:1px solid #cfc0a724;border-radius:999px}
.empty-networks .chain-icon{height:19px;width:19px}
.empty-activity-guide .ico{height:14px;width:14px}
.reference-empty>.textlink{font-size:11px}
.title-actions,.portfolio-title{display:flex;align-items:center;gap:14px}
.feature-buddy{display:none}
.page-view,.portfolio-page,.activity-page,.settings-page{padding-top:36px;padding-bottom:48px}
.page-title h1,.portfolio-head h1,.activity-head h1,.settings-content>h1{font-size:40px;letter-spacing:-1px}
.page-title p,.portfolio-head p,.activity-head p{font-size:14px}
.settings-peek{background:radial-gradient(ellipse at 50% 60%,#5b504344,transparent),#241f1a;height:210px;box-shadow:none;border:1px solid var(--line)}
.settings-peek>.settings-mascot{width:190px;height:190px;left:20px;bottom:0}
.settings-page{grid-template-columns:238px minmax(0,1fr);max-width:1160px;gap:36px}
.settings-box,.note-card,.activity-detail{background:#231e18;border-color:#d5c7ae24}
.settings-box>header{background:#2d2720}
.settings-box>header h2{font-size:19px}
.settings-agent-card{background:#2f2921;border:1px solid #8b82783d;color:var(--ink);box-shadow:none}
.settings-agent-card span{color:var(--muted)}
.setting-row p{font-size:12px;line-height:1.7}
.activity-stats>div{background:#2f2922;color:var(--ink);box-shadow:none;border:1px solid #bead9033;border-radius:12px}
.activity-stats span{color:var(--muted)}
.activity-detail-stage{background:radial-gradient(ellipse at 35% 55%,#5b504344,transparent),#241f1a}
.activity-detail-stage>.detail-mascot{width:180px;height:180px;left:40px;bottom:0}
.wallet-option,.network-option{background:#2d2720}
.modal{background:#211c17}
.voice-settings-foot{padding:0 20px 15px;font-size:12px;color:var(--muted)}
.plush-mascot .sleep-breath{display:none}
.plush-mascot .plush-ground{opacity:.15}
.hero-canonical[data-mood=hello] .plush-wave-arm{opacity:1;animation:plush-soft-wave 1.5s ease-in-out 3}
.hero-canonical[data-mood=hello] .plush-right-arm{opacity:0}
.hero-canonical[data-mood]:not([data-mood=hello]) .plush-wave-arm{opacity:0}
.hero-canonical[data-mood]:not([data-mood=hello]) .plush-right-arm{opacity:1}
.boot-screen{background:radial-gradient(ellipse at 50% 40%,#443c3255,transparent 60%),#1f1a15}
@media(max-width:1100px) and (min-width:701px){.hero-original-stage{width:340px;height:340px;right:2%;bottom:10px}.ref-speech{right:3%;bottom:320px}.app-doc-link,.app-social-link{display:none}.chat-view{grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr)}.companion-panel{padding:20px}.chat-tools .chat-memory{display:none}}
@media(max-width:900px){.reference-home h1{font-size:88px}.reference-home h2{font-size:54px}.app-header{padding:0 18px;gap:14px}.workspace-tab{padding:6px 9px;font-size:12px}.chat-title{gap:6px}.chat-tools{gap:6px}.chat-log{padding:20px}.chat-welcome h2{font-size:32px}.settings-page{grid-template-columns:210px 1fr;gap:20px}.settings-peek>.settings-mascot{left:5px}}
@media(max-width:700px){.ref-hero{height:auto;min-height:800px;padding-bottom:280px}.ref-hero-copy{padding-top:104px}.reference-home h1{font-size:54px;letter-spacing:-1.5px}.ref-hero-copy>p{font-size:17px}.hero-original-stage{width:240px;height:240px;bottom:0;right:4%}.ref-speech{left:24px;right:auto;width:180px;bottom:165px;font-size:12px;padding:12px}.ref-speech small{font-size:10px}.reference-home h2{font-size:38px;letter-spacing:-1px}.reference-home>section{padding:80px 0}.reference-home>section.flush{padding-top:0}.ref-label{font-size:11px}.ref-lead{font-size:17px}.ref-strip .ref-wrap{font-size:11px}.ref-panels,.ref-details,.ref-steps{grid-template-columns:1fr;gap:22px;margin-top:40px}.ref-panel,.ref-panel:nth-child(2),.ref-panel:nth-child(3){min-height:300px}.ref-preview{margin-top:40px;box-shadow:6px 6px 0 var(--accent)}.ref-preview-app{height:auto;grid-template-columns:1fr}.ref-preview-stage{display:none}.ref-details article{grid-template-columns:52px 1fr;padding:24px 0;gap:16px}.ref-details h3{font-size:22px}.ref-details p{font-size:15px}.ref-feature-icon{width:44px;height:44px;border-radius:12px}.ref-night{padding-top:80px}.closing-mascot{height:220px;width:220px;margin-bottom:10px}.app-main{height:calc(100dvh - 60px)}.app-header{height:64px;min-height:64px;padding:0 16px}.app-social-link{display:none}.app-header-actions{gap:10px}.chat-view{height:calc(100dvh - 124px);min-height:0;grid-template-columns:1fr;grid-template-rows:120px minmax(0,1fr);gap:0}.companion-panel{display:block;padding:0;border-right:0;border-bottom:1px solid var(--line)}.companion-card{height:120px}.companion-stage-clip{width:100%;inset:0;justify-content:center}.chat-mascot{width:115px;height:115px}.chat-panel-top{min-height:50px;padding:11px 15px}.chat-log{padding:14px}.chat-welcome{padding:10px 0}.chat-welcome h2{font-size:28px}.chat-welcome>p{font-size:13px}.chat-tools .icon-btn{font-size:10px}.quota-chip{font-size:9px}.composer-area{padding:12px 14px 16px}.composer{min-height:48px}.composer textarea{font-size:14px}.quota-line{font-size:9px}.message-receipt{margin-left:0;width:100%}.reference-empty{min-height:calc(100dvh - 124px);padding:30px 22px 50px}.empty-mascot{height:190px;width:190px}.reference-empty h2{font-size:30px}.reference-empty p{font-size:13px}.settings-page{grid-template-columns:1fr;gap:20px;padding:24px 18px}.settings-menu{display:none}.settings-content>h1,.portfolio-head h1,.activity-head h1,.page-title h1{font-size:30px}.page-view,.portfolio-page,.activity-page{padding:24px 18px}.app-mobile-nav{background:#1d1813f5}}
@media(prefers-reduced-motion:reduce){.plush-mascot *{animation:none!important;transition:none!important}}
.welcome-enable{color:var(--ink)}.welcome-enable strong{color:var(--ink)}.welcome-enable span{color:var(--muted)}
.send-btn{color:var(--outline)}.send-btn:disabled{color:#d7cdbd;background:#474139;opacity:.65}
.msg-text{color:var(--ink)}
.activity-detail-stage{height:200px}
