:root{font-family:var(--app-font);color:#14233e;background:#b9eaff;--ink:#14233e;--muted:#435e78;--surface:#eef9ffed;--line:#9dcced;--blue:#056cc1;--field:#f4fbff;--glass:linear-gradient(140deg,#ffffffee,#d3eeffdf)}*{box-sizing:border-box}body{margin:0;padding:16px 24px 40px;background:url('/art/sky-garden-v1.png') center center/cover fixed;min-height:100vh;font-size:0.875rem}button,input,textarea,select{font:inherit}button,a,input,textarea,summary{touch-action:manipulation}button,a{color:inherit}button{cursor:pointer;border:1px solid transparent;border-radius:12px;padding:9px 13px;min-height:40px;background:transparent;font-weight:600}button:hover{background:#d0ebff}button:disabled{opacity:.55;cursor:not-allowed}a{text-decoration:none}input,textarea{background:var(--field);border:1px solid var(--line);border-radius:12px;color:var(--ink);padding:10px 13px;min-width:0}textarea{resize:vertical;line-height:1.55}input:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #1262ad;outline-offset:3px}h1,h2,h3,p{margin:0}h1{font-size:1.25rem}h2{font-size:1.0625rem}h3{font-size:1rem}p{line-height:1.6}small{color:var(--muted);font-size:0.75rem;line-height:1.5}.glass{background:var(--glass);border:1.5px solid #fff;box-shadow:inset 0 0 0 1px #b4dffd,0 4px 14px #257fb826;border-radius:22px;backdrop-filter:blur(16px)}.masthead{max-width:1580px;margin:auto;padding:8px 14px}.header-line{display:flex;align-items:center;gap:12px}.brand{display:flex;align-items:center;gap:8px;font-size:1.4375rem;white-space:nowrap;padding:0 6px}.brand img{width:48px;height:48px;object-fit:contain}.global-search{flex:1;border-radius:25px;margin:0 12px}.primary{background:linear-gradient(#168ef1,#0565b7);color:white;border:1px solid #ffffff;box-shadow:0 2px 6px #2087cc35}.primary:hover{background:#075caa}.pill{border:1px solid #9dcff7;background:linear-gradient(#fff,#d8efff);border-radius:25px;padding:9px 15px;white-space:nowrap;font-weight:650}.stack-badge{font-size:0.6875rem}.layout{display:grid;grid-template-columns:225px minmax(360px,1fr) 300px;gap:14px;max-width:1580px;margin:14px auto;align-items:start}.sidebar{padding:12px;position:sticky;top:14px}.profile-link{display:flex;gap:9px;text-align:left;width:100%;padding:5px 0 12px;align-items:center}.profile-link strong{display:block;overflow-wrap:anywhere}.profile-link small{display:block;margin-top:2px}.avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(#e6faff,#a5dfff);border:2px solid white;display:inline-flex;align-items:center;justify-content:center;font-size:1.5625rem;flex-shrink:0}.avatar.small{width:38px;height:38px;font-size:1.375rem}.sidebar nav{display:grid;border-top:1px solid var(--line);padding-top:10px;gap:3px}.sidebar nav button{text-align:left;display:flex;align-items:center;gap:10px;font-size:1rem;padding:11px}.sidebar nav button span{font-size:1.5rem;width:26px}.sidebar nav button.active{background:linear-gradient(#a8e5ff,#6dc8f4);border-color:white;box-shadow:inset 0 0 0 1px #8acbeb}.community-promo{margin-top:18px;border-top:1px solid var(--line);padding:18px 8px 0;position:relative;min-height:230px;overflow:hidden}.community-promo h2{white-space:pre-line;font-size:1.4375rem;line-height:1.2;position:relative;z-index:1}.community-promo p{max-width:155px;font-size:0.8125rem;margin-top:8px}.community-promo img{width:115px;display:block;margin:0 0 0 auto;transform:rotate(-8deg)}.sidebar-footer{display:block;margin:14px 8px 4px}main{min-width:0;display:grid;gap:12px;scroll-margin-top:14px}main:focus{outline:none}.feed-heading{display:flex;justify-content:space-between;align-items:center;padding:6px 16px;border-radius:16px}.composer{padding:12px}.composer>div{display:flex;gap:10px;align-items:start}.composer textarea{width:100%;min-height:78px;border-radius:15px}.composer footer{display:flex;gap:12px;align-items:center;border-top:1px solid var(--line);padding-top:9px;margin-top:9px;color:var(--muted);font-size:0.75rem}.composer footer>span:first-child{margin-right:auto}.composer footer button{min-width:85px}.post{padding:12px 14px;overflow-wrap:anywhere}.post>header{display:flex;gap:8px;align-items:center}.post>header small{display:block}.author{padding:0;min-height:22px;text-align:left}.post-body{white-space:pre-wrap;font-size:0.9375rem;margin:10px 0 14px}.post-counts{display:flex;justify-content:space-between;font-size:0.75rem;color:var(--muted);padding:6px 0}.post-actions{display:flex;border-top:1px solid var(--line);margin-top:3px;padding-top:4px}.post-actions button{flex:1}.selected{color:#0757a0;background:#d0ebff}.post-menu{margin-left:auto;position:relative}.post-menu summary{padding:10px;cursor:pointer;list-style:none}.post-menu>div{position:absolute;right:0;z-index:4;background:var(--surface);padding:6px;border-radius:12px;border:1px solid var(--line);width:110px;display:grid}.post textarea{width:100%;margin:10px 0}.right-column{display:grid;gap:12px;position:sticky;top:14px}.connect-card{padding:18px}.section-title{display:flex;justify-content:space-between;align-items:center}.connect-mascot{display:block;width:100px;height:100px;object-fit:contain;margin:12px auto}.connect-card h3{margin-bottom:8px}.connect-card p{color:var(--muted);font-size:0.8125rem}.link-button{display:block;text-align:center;border-radius:20px;margin-top:16px;padding:11px 8px;font-size:0.8125rem}.compact{padding:18px}.compact p{font-size:0.8125rem;color:var(--muted);margin-top:8px}.compact h3{margin-bottom:8px}.guest-composer{display:flex;gap:10px;align-items:center;padding:14px;flex-wrap:wrap}.guest-composer>span:nth-child(2){flex:1}.empty{text-align:center;padding:35px 18px}.empty p{margin:10px 0;color:var(--muted)}.error{max-width:1580px;margin:10px auto;display:flex;align-items:center;justify-content:space-between;padding:8px 16px;color:#8c2131;background:#fff0f0}.person{display:flex;align-items:center;gap:12px;padding:16px}.person>div{flex:1;min-width:0}.person p{font-size:0.8125rem}.person h2{font-size:1rem}.profile-editor{padding:20px}label{display:grid;gap:6px;margin:12px 0;font-size:0.8125rem;font-weight:600}label input,label textarea{width:100%}.address{overflow-wrap:anywhere;font-size:0.75rem;color:var(--muted);margin:6px 0 14px}.inline-panel{padding:12px;border:1px solid var(--line);border-radius:12px;margin:10px 0}.review{border-bottom:1px solid var(--line);padding:15px 0}.review small{display:block}.audit{padding:8px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.modal-backdrop{position:fixed;inset:0;z-index:100;background:#0b2d5166;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:20px;overflow-y:auto}.login-dialog{position:relative;width:460px;max-width:100%;max-height:95vh;overflow-y:auto;padding:24px;background:var(--surface)}.login-dialog>p{font-size:0.8125rem;color:var(--muted);margin-top:12px}.login-mascot{display:block;width:65px;height:65px;object-fit:contain;margin:0 auto 8px}.login-dialog h1{text-align:center}.login-dialog textarea{min-height:100px}.close{position:absolute;right:10px;top:10px;font-size:1.5rem}.wide{width:100%;margin-top:10px}.check{display:flex;align-items:center;gap:8px}.check input{width:auto}.security-note{padding:12px;background:#fff3cd;border-radius:10px;color:#594008!important}.skip{position:fixed;top:-100px;z-index:200;background:white;padding:12px}.skip:focus{top:10px}[hidden]{display:none!important}
html[data-theme=dark]{color-scheme:dark;--ink:#e7f3ff;--muted:#aac4da;--surface:#122b43;--field:#10273d;--line:#41617c;--glass:linear-gradient(135deg,#19354cef,#12273aed);color:var(--ink);background:#0c2132}html[data-theme=dark] body{background:linear-gradient(#092239b8,#092239d9),url('/art/sky-garden-v1.png') center/cover fixed}html[data-theme=dark] .glass{border-color:#618ba5;box-shadow:inset 0 0 0 1px #426985,0 4px 14px #00142544}html[data-theme=dark] .pill{background:#1b405d;border-color:#537fa0}html[data-theme=dark] button:hover{background:#285271}html[data-theme=dark] .sidebar nav button.active,html[data-theme=dark] .selected{background:#24567c;color:#e0f3ff}html[data-theme=dark] .error{color:#ffd5d5;background:#522c3a}html[data-theme=dark] .avatar{background:#326282}
@media(min-width:1500px){.layout{grid-template-columns:250px minmax(400px,1fr) 350px}.masthead{padding:10px 18px}.header-line{gap:20px}.brand{font-size:1.625rem}}
@media(max-width:1150px){body{padding:12px}.layout{grid-template-columns:185px minmax(0,1fr) 245px;gap:10px}.brand{font-size:1.125rem}.global-search{margin:0}.header-line{gap:6px}.account{max-width:120px;overflow:hidden;white-space:nowrap}.sidebar nav button{font-size:0.875rem}.connect-card{padding:14px}}
@media(max-width:950px){.layout{grid-template-columns:170px minmax(0,1fr)}.right-column{display:none}.header-line{flex-wrap:wrap}.global-search{order:3;flex-basis:100%}.header-line>.pill{margin-left:auto}.brand img{width:38px;height:38px}.brand{font-size:1.25rem}}
@media(max-width:620px){body{padding:8px}.layout{display:block;margin-top:8px}.sidebar{position:static;padding:4px;margin-bottom:8px;border-radius:16px}.profile-link,.community-promo,.sidebar-footer{display:none}.sidebar nav{display:flex;overflow-x:auto;border:0;padding:0;gap:2px}.sidebar nav button{white-space:nowrap;font-size:0.75rem;padding:8px;min-height:44px;gap:4px}.sidebar nav button span{font-size:1.125rem;width:auto}.header-line>.pill{font-size:0.75rem;padding:8px}.brand{font-size:1.125rem}.account{font-size:0.75rem}.preferences>span:first-child{display:none}.preferences{padding-top:3px}.preferences details{margin-left:0;margin-right:auto}.masthead{padding:7px 9px}.header-line{gap:4px}main{gap:8px}.glass{border-radius:17px}.post{padding:11px}.post-body{font-size:0.9375rem}.post-actions button{font-size:0.75rem;padding:8px}.composer{padding:10px}.guest-composer{font-size:0.8125rem}.guest-composer .primary{width:100%}.modal-backdrop{padding:12px}.login-dialog{padding:20px}.person{flex-wrap:wrap}.person button{margin-left:auto}.stack-badge{font-size:0.625rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.post-photo{width:100%;max-height:620px;object-fit:contain;display:block;border-radius:14px;background:#d8efff;margin:8px 0}.upload-label{margin:0;display:flex;align-items:center;color:var(--blue);cursor:pointer;position:relative;overflow:hidden;padding:10px;border:1px solid var(--line);border-radius:16px;min-width:70px}.upload-label input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.upload-label:focus-within{outline:3px solid var(--blue)}.attachment{font-size:0.75rem;color:var(--muted)}

.settings{flex-wrap:wrap;max-width:calc(100vw - 32px)}.font-picker{display:flex;align-items:center;gap:8px}.font-picker select{max-width:220px}.brand strong{font-weight:900;letter-spacing:-.8px}.settings select{font:inherit} html[data-font="pressstart"] body{font-size:0.75rem}html[data-font="pressstart"] .brand{font-size:1rem}.wallet{padding:20px;min-width:0}.wallet label{display:grid;gap:6px;margin:14px 0}.wallet input,.wallet select{min-width:0;width:100%;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--field);color:inherit}.wallet dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px}.wallet dd{margin:0;overflow-wrap:anywhere}.wallet .balance{font-size:1.875rem;font-weight:800}.wallet .address,.wallet .tx-hash{overflow-wrap:anywhere;user-select:all}.wallet-actions{display:flex;gap:8px;flex-wrap:wrap}.wallet-review{padding:16px;border:2px solid #46a9e8;border-radius:16px;margin:18px 0}.wallet-status{overflow-wrap:anywhere}.login-preview{overflow-wrap:anywhere;font-weight:700}.sidebar nav{overflow-x:auto}html[data-font="pressstart"] .sidebar nav button{font-size:0.6875rem}

@media(max-width:620px){.settings{left:0;right:auto;max-width:calc(100vw - 52px)}.account{text-overflow:ellipsis}}

/* Compact reference layout: one visible toolbar and consistent card spacing. */
body{padding:10px 12px 20px;line-height:1.4;background:linear-gradient(135deg,#d7f0ff,#bee5fc 48%,#dff4ff);background-attachment:fixed}
.masthead,.layout{max-width:none}.masthead{padding:8px 14px;border-radius:22px 22px 16px 16px}.header-line{gap:10px}.brand{font-size:1.5rem;gap:6px}.brand img{width:44px;height:44px}.global-search{margin:0 12px;min-height:40px}.layout{grid-template-columns:216px minmax(0,1fr) 296px;gap:12px;margin:10px auto;align-items:start}.glass{border-radius:18px;box-shadow:inset 0 0 0 1px #b4dffd,0 2px 6px #257fb81a}.sidebar{padding:10px;top:10px}.sidebar nav{gap:2px;padding-top:8px}.sidebar nav button{min-height:40px;padding:7px 10px;line-height:1.25;font-size:0.9375rem;gap:10px}.sidebar nav button span{font-size:1.3125rem;width:24px}.profile-link{gap:8px;padding:4px 0 10px}.profile-link strong{font-size:0.875rem;line-height:1.3}.profile-link small{margin-top:2px}.community-promo{margin-top:12px;padding:14px 4px 0;min-height:180px}.community-promo h2{font-size:1.3125rem}.community-promo p{margin-top:7px;line-height:1.35}.community-promo img{width:90px}.sidebar-footer{margin:8px 4px 0}.right-column,main{gap:10px}.connect-card,.compact{padding:14px}.connect-mascot{width:80px;height:80px;margin:8px auto}.connect-card p,.compact p{line-height:1.45}.link-button{margin-top:10px;padding:9px 6px}.post{padding:12px}.post-body{line-height:1.45;margin:9px 0}.post-counts{padding:5px 0}.post-actions{padding-top:2px}.post-actions button{min-height:36px;padding:6px}.composer{padding:10px 12px}.composer textarea{min-height:48px;line-height:1.4;padding:10px 12px}.composer footer{margin-top:6px;padding-top:6px;gap:8px}.empty{padding:24px 16px}.feed-heading{padding:4px 12px}.feed-heading h1{font-size:1.0625rem}.wallet{padding:16px}.wallet label{margin:10px 0}.wallet p{line-height:1.45}.wallet-review{margin:12px 0;padding:12px}.wallet .balance{margin:10px 0}.account{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.preferences{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;border-top:1px solid var(--line);margin-top:8px;padding:8px 0 0;color:var(--ink);font-size:0.8125rem}.preferences-title{display:flex;align-items:center;gap:7px;font-size:0.875rem;white-space:nowrap}.preferences-title>span{font-size:1.25rem;color:var(--blue)}.theme-picker{display:flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:12px;background:var(--field)}.theme-picker button{display:flex;align-items:center;justify-content:center;min-height:34px;padding:6px 12px;line-height:1.2;border-radius:9px}.theme-picker button[aria-pressed=true]{background:linear-gradient(#2299fb,#0871d6);color:#fff;box-shadow:0 2px 5px #0871d630}.font-picker{display:flex;align-items:center;gap:8px;margin:0;min-width:0;max-width:360px;font-size:0.8125rem}.font-picker select{max-width:none;min-width:0;width:230px;height:40px;padding:6px 10px;border:1px solid var(--line);border-radius:11px;background:var(--field);color:var(--ink)}.secret-field{display:flex;align-items:stretch;gap:6px}.secret-field input{flex:1;min-width:0;width:100%}.secret-field button{flex-shrink:0;background:var(--field);border:1px solid var(--line);min-width:64px}.login-dialog>p{line-height:1.45}.login-dialog label{margin:10px 0 5px}.login-preview:empty{display:none}
@media(min-width:1600px){.layout{grid-template-columns:236px minmax(0,1fr) 320px}.brand{font-size:1.625rem}}
@media(max-width:1150px){.layout{grid-template-columns:190px minmax(0,1fr) 260px}.brand{font-size:1.25rem}.global-search{margin:0}.header-line{gap:6px}}
@media(max-width:950px){.layout{grid-template-columns:184px minmax(0,1fr)}.right-column{display:none}.brand{font-size:1.3125rem}.header-line{flex-wrap:wrap}.global-search{order:3;flex-basis:100%}.header-line>.pill{margin-left:auto}}
@media(max-width:620px){body{padding:6px 6px 72px}.masthead{padding:8px 10px}.brand{font-size:1.125rem}.brand img{width:34px;height:34px}.header-line>.pill{font-size:0.6875rem;padding:7px}.account{font-size:0.75rem;max-width:160px}.preferences{gap:7px 10px;padding-top:7px;margin-top:7px}.preferences-title{font-size:0.8125rem;margin-right:auto}.theme-picker button{min-height:34px;padding:6px 10px}.font-picker{flex:1 1 100%;max-width:none;justify-content:space-between}.font-picker select{width:calc(100% - 50px);height:38px}.layout{display:block;margin-top:8px}.sidebar{padding:4px;margin-bottom:8px;position:static}.sidebar nav{display:flex;gap:2px;padding:0;border:0}.sidebar nav button{padding:7px 9px;font-size:0.75rem;min-height:38px;white-space:nowrap;gap:4px}.sidebar nav button span{font-size:1.125rem;width:auto}.profile-link,.community-promo,.sidebar-footer{display:none}.post,.composer{padding:10px}.wallet{padding:12px}.wallet .section-title h1{font-size:1.125rem}.wallet dl{grid-template-columns:1fr;gap:4px}.wallet dd{margin-bottom:6px}.secret-field button{padding:8px;min-width:56px}}
/* Fruit Nation social layout */
.icon{display:inline-block;width:22px;height:22px;flex-shrink:0;vertical-align:middle}.fruit-avatar{width:42px;height:42px;flex-shrink:0;object-fit:contain;border-radius:50%;background:linear-gradient(#effbff,#a5ddfb);border:1px solid #91c6ed;padding:3px}.brand img{object-fit:contain}.masthead{background:linear-gradient(100deg,#e5f7ffed,#bfe6ffed)}.messenger-link{display:flex;align-items:center;gap:8px;justify-content:center;min-height:40px}.messenger-link .icon{color:#0874ef}.notification-button{width:42px;height:42px;padding:8px;position:relative;background:#f5fbff;border:1px solid var(--line);border-radius:50%}.notification-dot,.unread-dot{width:8px;height:8px;background:#ff3c62;border:1.5px solid #fff;border-radius:50%}.notification-dot{position:absolute;right:8px;top:6px}.account{display:flex;align-items:center;gap:7px;padding:0;max-width:175px;text-align:left}.account .fruit-avatar{width:38px;height:38px}.account span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:0.75rem}.logout-button{padding:7px;font-size:0.75rem}.sidebar{background:linear-gradient(135deg,#ebf9ffe8,#d5edffe6)}.profile-link{padding:8px;border:1px solid #98d6f1;background:linear-gradient(120deg,#e4f8ff,#a5e3ff);border-radius:17px;margin-bottom:10px}.profile-link strong{max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar nav{border-top:0;padding:0}.sidebar nav button{border-radius:13px}.sidebar nav button.active{background:linear-gradient(#a6e5ff,#7ecdf5);border:1px solid #fff}.nav-secondary{display:grid;grid-template-columns:1fr 1fr;gap:2px;border-top:1px solid var(--line);margin-top:8px;padding-top:6px}.sidebar .nav-secondary button{font-size:0.75rem;min-height:30px;padding:5px 6px}.community-promo{background:linear-gradient(#bce9ff,#e4f6ff 65%,#c2ee78);border:1px solid #a3d4ef;border-radius:18px;padding:14px 12px 10px;position:relative;min-height:220px}.community-promo h2{font-size:1.1875rem;line-height:1.15;max-width:165px}.community-promo p{font-size:0.75rem;width:110px;line-height:1.35}.community-promo img{width:88px;position:absolute;right:6px;bottom:52px;transform:rotate(-6deg)}.community-promo button{font-size:0.75rem;position:relative;margin-top:56px;border-radius:25px;min-height:34px;padding:7px 10px}.text-link{font-size:0.75rem;color:#0067d7;white-space:nowrap;padding:4px;min-height:30px}.muted{font-size:0.75rem;color:var(--muted)}.section-title{gap:8px}.stories{padding:10px 14px}.stories .section-title{margin-bottom:8px}.stories h2{font-size:1.0625rem}.story-strip{display:flex;gap:12px;overflow-x:auto;padding:1px 0 3px;align-items:stretch}.story-add,.story-item{flex:0 0 76px;display:flex;flex-direction:column;gap:5px;align-items:center;padding:4px 0;min-width:0;border-radius:18px}.story-add{background:linear-gradient(#ebfaff,#c9edff);border:1px solid #a6d8f5;justify-content:center;font-size:0.75rem}.story-add-icon{display:grid;place-items:center;width:47px;height:47px;background:#f8fcff;border:1px solid #c1e5fc;box-shadow:0 2px 5px #43abeb22;border-radius:50%;font-size:2rem;color:#087bf0;line-height:1}.story-ring{border:2px solid #159fff;border-radius:50%;padding:3px;display:flex}.story-ring .fruit-avatar{width:53px;height:53px;border:0;padding:2px}.story-item strong{font-size:0.6875rem;width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.story-empty{flex:1;display:flex;align-items:center;gap:12px;min-width:160px;background:linear-gradient(100deg,#eefaff,#e5f5ff);border-radius:16px;overflow:hidden}.story-empty img{width:150px;height:88px;object-fit:cover;object-position:50% 72%}.story-empty p{font-size:0.8125rem;color:var(--muted);padding-right:12px;line-height:1.4}.feed-heading{background:none;border:none;box-shadow:none;padding:0 3px;min-height:28px}.feed-heading button{min-height:28px;padding:2px 7px}.feed-heading h1{font-size:0.875rem;color:var(--muted)}.composer-input{align-items:center!important}.composer textarea{min-height:42px;height:42px;border-radius:22px;resize:vertical}.composer-options{display:flex!important;align-items:center!important;flex-wrap:wrap;gap:8px!important;margin:8px 0 0;padding:0 0 0 50px}.composer-options label,.audience-picker{display:flex;align-items:center;gap:5px;margin:0;font-size:0.6875rem;white-space:nowrap}.composer-options select,.audience-picker select{max-width:160px;font-size:0.75rem;padding:4px 5px;min-height:30px;background:var(--field);color:var(--ink);border:1px solid var(--line);border-radius:10px;min-width:0}.composer footer{flex-wrap:wrap;border-top:0;margin-top:6px;padding-top:0}.composer footer .character-count{margin-left:auto}.upload-label{padding:6px 10px;min-height:34px;min-width:110px;font-size:0.75rem;background:var(--field);border-radius:20px}.composer footer .primary{min-height:34px;min-width:68px;padding:6px 12px;border-radius:14px}.feed-filters{display:flex;gap:6px;padding:4px}.feed-filters button{flex:1;min-height:32px;padding:4px 8px;font-size:0.75rem;border-radius:18px}.feed-filters button.active{background:linear-gradient(#2db1ff,#087ce9);color:#fff;border:1px solid #fff}.post>header{gap:9px}.post>header .fruit-avatar{width:40px;height:40px}.post .author{font-size:0.875rem;line-height:1.2}.post>header small{font-size:0.6875rem;line-height:1.3}.post-body{margin:8px 0;font-size:0.875rem;line-height:1.4}.post-photo{margin:8px 0;border-radius:14px;max-height:520px;width:100%;object-fit:contain}.post-actions button{display:flex;align-items:center;justify-content:center;gap:6px;font-size:0.75rem;line-height:1.25}.post-actions .icon{width:18px;height:18px}.post-feeling{font-size:0.75rem;color:var(--muted)}.shared-post{border:1px solid var(--line);padding:12px;border-radius:12px;background:var(--field);margin:8px 0}.shared-post p{line-height:1.45;font-size:0.875rem}.welcome{padding:10px 12px 18px}.welcome-art{width:100%;max-height:270px;object-fit:cover;object-position:50% 72%;border-radius:13px;margin-bottom:12px}.welcome p{margin:7px 0 12px}.suggestions,.wallet-summary,.governance-promo{padding:13px}.suggestions h2,.wallet-summary h2,.governance-promo h2{font-size:0.9375rem;line-height:1.25}.suggestion{display:flex;gap:7px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.suggestion:last-child{border:0}.suggestion .fruit-avatar{border-radius:11px;width:38px;height:38px}.suggestion-name{flex:1;min-width:0;padding:0;text-align:left}.suggestion-name strong{font-size:0.75rem;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.suggestion-name small{font-size:0.6875rem;display:block}.suggestion .pill{font-size:0.6875rem;padding:5px 9px;min-height:30px}.suggestion-art{display:block;width:100%;height:95px;object-fit:cover;object-position:50% 72%;border-radius:12px;margin:10px 0}.suggestions>p{font-size:0.75rem;line-height:1.4;margin-bottom:8px}.suggestions>.pill{min-height:32px;padding:5px 10px;font-size:0.75rem}.balance-card{position:relative;display:flex;align-items:center;gap:10px;margin-top:10px;padding:12px;border:1px solid #aee3ff;border-radius:16px;overflow:hidden;background:linear-gradient(120deg,#a8e1ff,#e5f8ff);min-height:100px}.balance-card>.icon{width:32px;height:32px;color:#0463ad}.balance-card>div{min-width:0;z-index:1}.balance-card strong{font-size:1.3125rem;display:block;overflow-wrap:anywhere;line-height:1.2;letter-spacing:-.6px}.balance-card small{display:block;line-height:1.4;font-size:0.6875rem}.balance-card img{position:absolute;right:0;bottom:-7px;width:65px;opacity:.65}.wallet-shortcuts{display:flex;justify-content:space-around;margin-top:9px;gap:8px}.wallet-shortcuts button{flex:1;display:grid;gap:3px;text-align:center;font-size:0.75rem;padding:3px;min-height:48px}.wallet-shortcuts span{border-radius:25px;background:linear-gradient(#e9faff,#c3edff);color:#087bf0;font-size:1.4375rem;line-height:1.3}.governance-promo{display:flex;align-items:flex-start;gap:10px;position:relative;overflow:hidden;min-height:145px;background:linear-gradient(#f4fbff,#d6f1ff 65%,#c2ed94)}.governance-promo>div{z-index:1;max-width:200px}.governance-promo p{font-size:0.75rem;line-height:1.35;margin:6px 0 9px;max-width:165px}.governance-promo .pill{font-size:0.75rem;padding:6px 10px;min-height:32px}.governance-promo img{position:absolute;right:-6px;bottom:-9px;width:90px;transform:rotate(12deg)}.mobile-tabs{display:none}.friend-actions{display:flex;gap:6px;flex-wrap:wrap}.friend-actions button{font-size:0.75rem;min-height:34px;padding:6px 10px}.person{padding:12px;gap:9px}.person>h2,.person h2{font-size:0.875rem}.person .pill{font-size:0.75rem;min-height:34px;padding:6px 10px}.group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}.group-card{overflow:hidden;padding:0 12px 12px;display:grid;gap:7px;align-content:start}.group-cover{height:82px;margin:0 -12px 3px;background:linear-gradient(120deg,#b0e5ff,#def5ff);display:flex;align-items:center;justify-content:center}.group-cover .fruit-avatar{width:62px;height:62px}.group-card p{font-size:0.8125rem;line-height:1.4}.group-title{padding:0;text-align:left;min-height:24px}.group-title h2{font-size:1rem}.group-card>.pill{margin-top:6px;justify-self:start}.group-heading{overflow:hidden}.group-heading>img{width:100%;height:160px;object-fit:cover;object-position:50% 72%}.group-heading>div{padding:12px}.group-heading p{font-size:0.8125rem;line-height:1.45;margin:4px 0}.group-heading small{margin-right:10px}.notification-row{padding:12px;text-align:left;display:flex;align-items:center;gap:10px;font-weight:400}.notification-row.unread{background:#d5efff}.notification-row>span:nth-child(2){flex:1;font-size:0.8125rem}.notification-row .unread-dot{flex-shrink:0}.proposal{padding:16px}.proposal>p{white-space:pre-wrap;font-size:0.875rem;margin:8px 0;line-height:1.45}.vote-options{display:flex;gap:8px;margin-top:10px}.vote-options button{flex:1;background:var(--field);border:1px solid var(--line);border-radius:12px}.vote-options button[aria-pressed=true]{background:#0a7cd8;color:white}.proposal-create{margin-top:12px}.proposal-create summary{cursor:pointer;font-weight:700;padding:8px;border:1px solid var(--line);border-radius:10px}.story-viewer{position:relative;padding:20px;width:480px;max-width:100%;max-height:90dvh;overflow:auto;background:var(--surface)}.story-viewer>header{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding-right:30px}.story-viewer>p{white-space:pre-wrap;line-height:1.45;margin:12px 0}.story-viewer>textarea{width:100%;min-height:100px;margin:12px 0}.story-viewer .upload-label{margin:12px 0}.story-viewer .close{z-index:2}.story-viewer video{max-height:60vh}
html[data-theme=dark] .masthead,html[data-theme=dark] .sidebar{background:linear-gradient(120deg,#193851,#102b43)}html[data-theme=dark] .profile-link,html[data-theme=dark] .balance-card,html[data-theme=dark] .community-promo,html[data-theme=dark] .governance-promo{background:linear-gradient(120deg,#163c59,#21587b);border-color:#416e90}html[data-theme=dark] .notification-button,html[data-theme=dark] .story-add,html[data-theme=dark] .story-empty,html[data-theme=dark] .group-cover{background:#193a55}html[data-theme=dark] .story-add-icon,html[data-theme=dark] .wallet-shortcuts span{background:#244b6b;color:#b3e6ff}html[data-theme=dark] .notification-row.unread{background:#225176}html[data-theme=dark] .text-link{color:#96d4ff}
@media(min-width:1500px){.layout{grid-template-columns:236px minmax(0,1fr) 324px}.story-add,.story-item{flex-basis:88px}.story-ring .fruit-avatar{width:58px;height:58px}.story-item strong{width:88px}.story-strip{gap:18px}}
@media(max-width:1150px){.layout{grid-template-columns:180px minmax(0,1fr) 256px}.sidebar{padding:8px}.sidebar nav button{font-size:0.875rem;gap:7px}.profile-link strong{max-width:105px;font-size:0.75rem}.community-promo h2{font-size:1.0625rem}.account span{display:none}.account{max-width:40px}.suggestions,.wallet-summary,.governance-promo{padding:11px}.balance-card{padding:10px}.balance-card strong{font-size:1.1875rem}.composer-options{padding-left:0}.story-empty p{font-size:0.75rem}.story-empty img{width:110px}}
@media(max-width:950px){.layout{grid-template-columns:175px minmax(0,1fr)}.right-column{display:none}.brand{font-size:1.3125rem}}
@media(max-width:620px){.layout{display:block}.sidebar{position:static;padding:0;background:none;border:0;box-shadow:none;backdrop-filter:none;margin:0}.sidebar .profile-link,.sidebar .community-promo{display:none}.sidebar nav{display:flex;flex-wrap:nowrap;overflow:auto;gap:4px;margin-bottom:7px}.sidebar nav>button[data-testid=feed],.sidebar nav>button[data-testid=people],.sidebar nav>button[data-testid=friends],.sidebar nav>button[data-testid=groups],.sidebar nav>button[data-testid=wallet]{display:none}.sidebar nav .nav-secondary{border:0;margin:0;padding:0;display:flex}.sidebar nav button,.sidebar .nav-secondary button{font-size:0.6875rem;padding:4px 8px;min-height:29px;white-space:nowrap;background:#e7f7ff;border:1px solid var(--line)}.sidebar nav button .icon{width:15px;height:15px}.masthead{border-radius:20px 20px 14px 14px}.header-line{gap:5px}.brand{font-size:1.0625rem;padding:0;gap:5px;flex:1}.brand img{width:32px;height:32px}.global-search{display:none}.messenger-link{font-size:0!important;min-height:34px;width:34px;padding:6px!important}.messenger-link .icon{width:21px;height:21px}.notification-button{width:32px;height:32px;padding:5px}.notification-button .icon{width:20px;height:20px}.account{display:none}.logout-button{font-size:0.6875rem;padding:3px;min-height:30px}.preferences{gap:6px;margin-top:7px;padding-top:7px}.preferences-title{font-size:0.75rem}.theme-picker button{font-size:0.6875rem;min-height:30px;padding:5px 9px}.font-picker{font-size:0.75rem}.font-picker select{font-size:0.75rem;height:32px}.stories{padding:8px 10px}.stories h2{font-size:0.9375rem}.stories .section-title>.muted{font-size:0.625rem}.story-strip{gap:7px}.story-add,.story-item{flex-basis:65px;gap:3px}.story-ring .fruit-avatar{width:45px;height:45px}.story-add-icon{width:42px;height:42px;font-size:1.6875rem}.story-item strong{width:65px;font-size:0.625rem}.story-empty img{height:70px;width:100px}.story-empty p{font-size:0.6875rem}.composer-input .fruit-avatar{width:34px;height:34px}.composer textarea{font-size:0.8125rem}.composer-options{gap:5px!important}.composer-options label{font-size:0.625rem;gap:3px}.composer-options select{max-width:110px;font-size:0.6875rem;min-height:27px}.composer-options label:nth-child(3){display:none}.composer footer .character-count{font-size:0.625rem}.upload-label{font-size:0.6875rem;min-width:100px;min-height:32px}.feed-filters{gap:2px}.feed-filters button{font-size:0.6875rem;padding:5px;min-height:30px}.feed-heading h1{font-size:0.75rem}.post-actions button{font-size:0.6875rem;gap:4px}.post-actions .icon{width:16px;height:16px}.post>header .fruit-avatar{width:35px;height:35px}.post .author{font-size:0.8125rem}.post-body{font-size:0.8125rem}.post-counts{font-size:0.625rem}.welcome-art{max-height:170px}.mobile-tabs{position:fixed;display:flex;bottom:0;left:0;right:0;z-index:40;padding:6px 8px max(8px,env(safe-area-inset-bottom));background:#edf8fff0;backdrop-filter:blur(16px);border:1px solid #fff;box-shadow:0 -2px 14px #296aa323;border-radius:22px 22px 0 0;justify-content:space-around}.mobile-tabs button{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:44px;padding:4px 12px;font-size:0.625rem;border-radius:12px}.mobile-tabs button .icon{width:22px;height:22px}.mobile-tabs button.active{color:#0576ef;background:#d6efff}.person{flex-wrap:wrap}.person>div{min-width:90px}.group-grid{grid-template-columns:1fr}.group-heading>img{height:120px}.vote-options{gap:4px}.vote-options button{font-size:0.75rem;padding:7px}.story-viewer{padding:16px}.story-viewer h1{font-size:1.1875rem}html[data-theme=dark] .mobile-tabs{background:#16304aed}html[data-theme=dark] .sidebar nav button{background:#163852}}

.carousel{position:relative}.carousel-controls{display:flex;justify-content:center;align-items:center;gap:18px;margin:0 0 8px}.carousel-controls button{border:1px solid var(--line);background:var(--field);min-width:36px;min-height:32px;font-size:1.375rem}.carousel-controls span{font-size:0.75rem}.reaction-picker{margin-top:6px;font-size:0.6875rem;color:var(--muted)}.reaction-picker summary{cursor:pointer;display:inline-block;padding:4px 0}.reaction-picker>div{display:flex;flex-wrap:wrap;gap:4px;padding:6px 0}.reaction-picker button{font-size:0.75rem;min-height:34px;background:var(--field);border:1px solid var(--line);padding:5px 8px}.hashtag{display:inline;padding:0;min-height:0;color:var(--blue);font:inherit;font-weight:700}.explore-search{display:flex;gap:8px;margin:12px 0}.explore-search input{min-width:0;flex:1}.explore-search button{white-space:nowrap}.thread-navigation{display:flex;gap:10px;font-size:0.75rem}.brand strong{font-weight:900}.post-body{white-space:pre-wrap}.feed-heading{margin:0}.post-photo{height:auto}.community-promo h2{word-break:keep-all;overflow-wrap:normal}.community-promo p{width:100%;padding-right:52px}.community-promo img{width:72px}.community-promo button{margin-top:42px}

.right-column,.right-column>section,.sidebar{min-width:0;width:100%}.suggestion-name{overflow:hidden}.post>header>div{min-width:0}.post .author{max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.post-actions button{white-space:nowrap}.skip:not(:focus){clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.sidebar nav button:focus-visible{outline-offset:0}

/* The layout preference changes navigation placement without remounting content. */
.layout-setting { display:flex; align-items:center; gap:8px; font-weight:600; white-space:nowrap; }
.layout-picker { display:flex; gap:2px; padding:3px; border:1px solid var(--line); border-radius:12px; background:var(--field); }
.layout-picker button { display:flex; align-items:center; justify-content:center; gap:5px; min-height:34px; padding:6px 12px; line-height:1.2; border-radius:9px; }
.layout-picker button[aria-pressed=true] { background:linear-gradient(#2299fb,#0871d6); color:#fff; box-shadow:0 2px 5px #0871d630; }
.layout-picker svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6; }
html[data-layout=horizontal] .layout { grid-template-columns:minmax(0,1fr) 296px; }
html[data-layout=horizontal] .sidebar { grid-column:1 / -1; position:static; padding:6px 8px; }
html[data-layout=horizontal] .sidebar .profile-link,
html[data-layout=horizontal] .sidebar .community-promo { display:none; }
html[data-layout=horizontal] .sidebar nav { display:flex; flex-wrap:wrap; align-items:center; gap:4px; padding:0; margin:0; border:0; }
html[data-layout=horizontal] .sidebar .nav-secondary { display:contents; }
html[data-layout=horizontal] .sidebar nav button { flex-shrink:0; white-space:nowrap; font-size:0.8125rem; min-height:36px; padding:6px 9px; }
html[data-layout=horizontal] .sidebar nav .icon { width:19px; height:19px; }
@media(min-width:1500px) {
  html[data-layout=horizontal] .layout { grid-template-columns:minmax(0,1fr) 324px; }
}
@media(max-width:1150px) {
  html[data-layout=horizontal] .layout { grid-template-columns:minmax(0,1fr) 256px; }
}
@media(max-width:950px) {
  html[data-layout=horizontal] .layout { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:620px) {
  .layout-setting { flex:1 1 100%; justify-content:space-between; font-size:0.75rem; }
  .layout-picker { flex:1; max-width:calc(100% - 66px); }
  .layout-picker button { flex:1; min-height:32px; padding:5px 9px; font-size:0.75rem; }
  html[data-layout=horizontal] body { padding-bottom:max(12px,env(safe-area-inset-bottom)); }
  html[data-layout=horizontal] .sidebar { padding:0; margin-bottom:8px; }
  html[data-layout=horizontal] .sidebar nav { flex-wrap:nowrap; overflow-x:auto; }
  html[data-layout=horizontal] .sidebar nav>button { display:flex; }
  html[data-layout=horizontal] .sidebar nav button { font-size:0.75rem; min-height:36px; }
  html[data-layout=horizontal] .mobile-tabs { display:none; }
}

.agent-panel { padding:16px; min-width:0; }
.agent-panel>p { font-size:0.8125rem; line-height:1.45; margin:10px 0; }
.agent-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:14px 0; }
.agent-summary>div { border:1px solid var(--line); border-radius:12px; background:var(--field); padding:10px; }
.agent-summary dt { font-size:0.75rem; color:var(--muted); }
.agent-summary dd { margin:4px 0 0; font-weight:700; overflow-wrap:anywhere; }
.agent-controls { display:flex; gap:8px; flex-wrap:wrap; }
.agent-generation { display:grid; gap:10px; margin:12px 0; }
.agent-generation label { display:grid; gap:5px; min-width:0; margin:0; font-size:0.8125rem; font-weight:700; }
.agent-generation :is(input,select,textarea) { width:100%; min-width:0; margin:0; }
.agent-generation select { padding:10px 13px; min-height:40px; border:1px solid var(--line); border-radius:12px; background:var(--field); color:var(--ink); }
.agent-generation select:focus-visible { outline:3px solid #1262ad; outline-offset:3px; }
.agent-generation p { margin:0; font-size:0.75rem; overflow-wrap:anywhere; }
.agent-credentials { display:grid; gap:8px; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--field); }
.agent-panel .agent-credentials h2 { margin:0; font-size:0.875rem; }
.agent-credentials .secret-field { min-width:0; }
.agent-credentials .secret-field input { flex:1; width:0; }
.agent-credentials .secret-field button { flex:none; }
.agent-credentials [data-testid=credential-notice]:empty { display:none; }
.agent-preview { padding:12px; margin-top:12px; border:1px solid var(--line); border-radius:12px; background:var(--field); }
.agent-preview h2 { margin:0 0 8px; font-size:0.875rem; }
.agent-preview p { white-space:pre-wrap; overflow-wrap:anywhere; }
.agent-panel h2 { margin-top:20px; }
.agent-run { padding:12px 0; border-bottom:1px solid var(--line); display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.agent-run>div { flex:1; min-width:150px; }
.agent-run small { display:block; }
.agent-run>p { width:100%; color:var(--muted); font-size:0.75rem; }
.agent-run>p:empty { display:none; }
.agent-badge { display:inline-block; margin-left:6px; padding:2px 6px; border:1px solid var(--line); border-radius:7px; background:var(--field); color:var(--ink); font-size:0.625rem; }
@media(max-width:620px) { .agent-panel { padding:12px; } .agent-summary { font-size:0.75rem; } .agent-controls button { font-size:0.75rem; padding:7px 9px; } }

.agent-workspace { display:grid; gap:10px; min-width:0; }
.agent-roster { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:10px; }
.agent-card { display:flex; align-items:center; gap:8px; min-width:0; text-align:left; padding:9px; border:1px solid var(--line); background:var(--field); color:var(--ink); border-radius:14px; }
.agent-card[aria-pressed=true] { border-color:#0077dd; box-shadow:inset 0 0 0 1px #0077dd; background:var(--field); }
.agent-card img { width:38px; height:38px; border-radius:50%; flex:none; }
.agent-card span { min-width:0; overflow-wrap:anywhere; }
.agent-card strong { display:block; font-size:0.8125rem; }
.agent-card small { display:block; font-size:0.75rem; color:var(--muted); }
@media(max-width:620px) { .agent-card { flex-direction:column; text-align:center; padding:7px 3px; gap:4px; } .agent-roster { gap:6px; padding:8px; } }

.agent-personality { padding:12px; border:1px solid var(--line); border-radius:14px; }
.personality-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.agent-personality .section-title { flex-wrap:wrap; gap:8px; }
@media(max-width:620px) { .personality-fields { grid-template-columns:1fr; } }

.ai-post-note,.ai-conversation-note,.ai-reply-status { font-size:0.75rem; line-height:1.5; color:var(--ink); background:var(--field); padding:8px 10px; border:1px solid var(--line); border-radius:10px; }

/* Text scaling preserves viewport geometry. */
:root[data-font-size="80"]{font-size:80%}:root[data-font-size="90"]{font-size:90%}:root[data-font-size="100"]{font-size:100%}:root[data-font-size="110"]{font-size:110%}:root[data-font-size="120"]{font-size:120%}:root[data-font-size="130"]{font-size:130%}:root[data-font-size="140"]{font-size:140%}:root[data-font-size="150"]{font-size:150%}
.preferences{flex-wrap:wrap}.language-picker,.font-size-picker{display:flex;align-items:center;gap:6px}.language-picker select{min-width:110px;max-width:100%}.font-size-picker button{min-width:40px}.font-size-value{min-width:3.5em;text-align:center}.preferences label{flex-wrap:wrap}h1,h2,h3,button,label{overflow-wrap:anywhere}

/* Native-feeling feedback: compositor-only movement, no animated layout/blur. */
.fruit-mark{position:relative;width:48px;height:48px;display:inline-block;flex:none;contain:layout paint}
.fruit-mark img,.fruit-mark canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.fruit-mark canvas[data-backend="static"]{opacity:0}
.fruit-mark:has(canvas:not([data-backend="static"])) img{visibility:hidden}
button,.pill{transition:transform 150ms cubic-bezier(.16,1,.3,1),opacity 120ms ease;-webkit-tap-highlight-color:transparent}
button:active:not(:disabled),.pill:active{transform:scale(.97)}
.glass{backdrop-filter:none}
.masthead,.mobile-tabs,.login-dialog{backdrop-filter:blur(14px)}
main{min-width:0}
.post{contain:layout style}
@media(pointer:coarse){button,.pill{min-height:44px}.preferences button{min-height:44px}.preferences select{min-height:44px}input,select,textarea{font-size:max(1rem,16px)}}
@media(max-width:620px){body{padding-top:max(6px,env(safe-area-inset-top));padding-bottom:calc(76px + env(safe-area-inset-bottom))}.mobile-tabs{padding-bottom:env(safe-area-inset-bottom)}.fruit-mark{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){button,.pill{transition:none!important}button:active:not(:disabled),.pill:active{transform:none}}
/* Text scaling and translations must grow within the viewport, including posts. */
main{grid-template-columns:minmax(0,1fr)}
.layout-setting{min-width:0;max-width:100%;flex-wrap:wrap;white-space:normal}
.layout-picker{min-width:0}
.layout-picker button{min-width:0;white-space:normal}
.layout-picker svg,.post-actions .icon{flex-shrink:0}
.section-title{flex-wrap:wrap}
.story-empty{min-width:0}
.story-empty p{min-width:0;overflow-wrap:anywhere}
.feed-filters button,.post-actions button{min-width:0;white-space:normal;overflow-wrap:anywhere}
.post-counts{flex-wrap:wrap;gap:4px}
@media(max-width:620px){.layout-setting{display:grid;grid-template-columns:minmax(0,1fr)}.layout-setting>span{font-size:.6875rem}.layout-picker{max-width:none}.post-actions button{flex-direction:column;gap:3px;padding:6px 2px}.preferences-title{white-space:normal}.font-size-picker{gap:0}.font-size-picker button{white-space:nowrap}}
@media(max-width:620px){
 .layout-setting>span,.language-picker>.preference-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .preferences .font-picker{flex-wrap:nowrap}
 .preferences .font-picker select{flex:1;min-width:0}
 .font-size-picker{flex:1 1 120px}
 .language-picker{flex:1 1 100px;justify-content:flex-end}
 .language-picker select{width:100%;min-width:80px;max-width:145px}
}
.preferences{gap:8px 10px}
.language-picker select{background:var(--field);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:7px 10px;font-size:.8125rem;min-height:36px}
.layout-picker button[aria-pressed=true],.theme-picker button[aria-pressed=true],.feed-filters button.active{background:linear-gradient(#0876cf,#075faf);color:#fff}
@media(pointer:coarse){.language-picker select{min-height:44px;font-size:1rem}}
@media(max-width:620px){html[data-theme=dark] .sidebar nav button{background:#193a55;color:#e7f3ff}html[data-theme=dark] .sidebar nav button.active{background:#145b8d;color:#fff}}
.preferences label{margin:0}

/* Orchard finish: crisp reading surfaces, restrained depth and clear controls. */
:root {
 --ink:#172a43; --muted:#47617a; --surface:#f8fcff; --field:#f5faff;
 --line:#bfd9ea; --blue:#0767bd;
 --glass:linear-gradient(145deg,#fffffffa,#f0f9fff5);
}
body {
 color:var(--ink); background:radial-gradient(ellipse at 16% 0%,#f1fbff 0%,transparent 52%),linear-gradient(125deg,#d8efff,#cbe8fa 60%,#e5f5ff);
 background-attachment:scroll; padding:12px 14px 24px; -webkit-font-smoothing:antialiased;
}
.glass { border:1px solid #faffff; box-shadow:0 2px 3px #21558108,0 7px 22px #2155810b,inset 0 0 0 1px #b7d9ee70; border-radius:20px; }
.masthead { padding:10px 14px; background:linear-gradient(112deg,#f0fafff5,#d3edfff2); }
.header-line { gap:12px; min-height:44px; }
.brand { font-size:1.375rem; gap:8px; }
.brand strong { letter-spacing:-.65px; font-weight:900; }
.fruit-mark { width:44px; height:44px; }
.global-search { background:#ffffffde; border-color:#b4d3ed; min-height:42px; margin:0 6px; padding-left:18px; }
input::placeholder,textarea::placeholder { color:var(--muted); opacity:.85; }
.primary { background:linear-gradient(180deg,#087acf,#0664b7); border-color:#fff; box-shadow:0 3px 7px #096bb126,inset 0 1px 0 #ffffff30; border-radius:12px; }
.primary:hover { background:linear-gradient(180deg,#076cbe,#0555a1); }
.pill { background:linear-gradient(#fff,#eaf6ff); border-color:#bad9ee; box-shadow:0 1px 2px #1a5f8f08; }
.notification-button { background:#f7fcff; border-color:#bad9ee; }
.logout-button { border:1px solid var(--line); border-radius:10px; padding:7px 10px; }
.layout { gap:14px; margin-top:12px; }
.sidebar { padding:10px; background:linear-gradient(155deg,#f2fbfff5,#dfefffde); }
.profile-link { padding:10px 8px; margin-bottom:12px; background:linear-gradient(110deg,#e2f6ff,#b9e8ff); border-color:#b4dcf3; }
.sidebar nav { gap:4px; }
.sidebar nav button { min-height:42px; padding:9px 10px; }
.sidebar nav button.active { background:linear-gradient(110deg,#b0e7ff,#8bd3f7); box-shadow:inset 0 1px 0 #ffffffa0,0 2px 4px #1665920a; }
.nav-secondary { margin-top:12px; padding-top:10px; gap:4px; }
.sidebar .nav-secondary button { color:var(--muted); text-align:left; }
.sidebar .nav-secondary button.active { color:var(--ink); }
.community-promo { background:linear-gradient(160deg,#e0f5ff,#c4eaff 70%,#d0ef99); border-color:#c5e1ed; }
.community-promo img { bottom:52px; right:8px; }
.preferences { gap:8px; margin-top:9px; padding-top:8px; border-color:#bbdbee; }
.preferences-toggle { display:flex; align-items:center; gap:6px; padding:6px; min-height:38px; border-radius:10px; font-size:.75rem; }
.preferences-toggle>.icon { width:18px; height:18px; }
.preferences-title>span { font-size:inherit; color:inherit; }
.settings-chevron { width:14px; height:14px; flex:none; transition:transform 180ms cubic-bezier(.16,1,.3,1); }
.preferences-toggle[aria-expanded=true] .settings-chevron { transform:rotate(180deg); }
.preferences-toggle[aria-expanded=true] { background:#e2f3ff; color:#075a9d; }
.preferences-panel { display:flex; flex:1; align-items:center; flex-wrap:wrap; gap:8px 12px; min-width:0; }
.layout-setting { font-size:.75rem; gap:6px; }
.theme-picker,.layout-picker { background:#f3faff; padding:3px; border-color:#b8d7eb; border-radius:12px; }
.theme-picker button,.layout-picker button { font-size:.75rem; min-height:32px; padding:6px 10px; }
.font-picker { font-size:.75rem; gap:6px; flex:1; max-width:245px; }
.font-picker select { width:175px; flex:1; height:38px; }
.language-picker { font-size:.75rem; }
.language-picker select { min-width:100px; min-height:38px; }
.font-size-picker { border:1px solid var(--line); border-radius:11px; background:var(--field); gap:0; }
.font-size-picker button { min-width:32px; min-height:36px; padding:5px 7px; font-size:.75rem; }
.font-size-picker .font-size-value { min-width:50px; font-variant-numeric:tabular-nums; color:var(--muted); }
.stories { padding:12px; }
.stories .section-title { margin-bottom:10px; }
.story-add { border-radius:16px; background:linear-gradient(#f4fcff,#dcefff); border-color:#c2e1f4; }
.story-add-icon { box-shadow:0 2px 6px #388bd11a; border:1px solid #c1e6ff; }
.story-empty { background:linear-gradient(110deg,#e8f7ff,#f5fbff); border-radius:16px; }
.story-empty img { object-fit:cover; border-radius:14px; }
.feed-heading { background:transparent; box-shadow:none; border:0; padding:0 4px; }
.feed-heading h1 { font-size:.875rem; color:var(--muted); letter-spacing:.01em; }
.feed-refresh { min-height:32px; width:32px; padding:7px; border-radius:50%; }
.feed-refresh .icon { width:18px; height:18px; }
.feed-refresh[aria-busy=true] .icon { animation:refresh-turn 1.1s linear infinite; }
.guest-composer { padding:12px; gap:10px; }
.guest-composer .fruit-avatar { width:38px; height:38px; }
.guest-composer>span { flex:1; min-width:0; }
.guest-composer .primary { font-size:.8125rem; }
.feed-filters { padding:4px; background:#f4fbffe6; gap:4px; border-radius:15px; }
.feed-filters button { min-height:34px; font-size:.75rem; border-radius:11px; color:var(--muted); }
.post { padding:14px; background:var(--surface); border-color:#faffff; }
.post>header { gap:10px; }
.post .author { font-size:.875rem; font-weight:800; letter-spacing:-.1px; }
.post-meta { font-size:.6875rem; margin-top:2px; line-height:1.45; }
.post-body { font-size:.9375rem; line-height:1.5; margin:12px 0; }
.post-photo { background:#e9f3fa; border-radius:14px; }
.post-menu summary { min-width:36px; min-height:36px; display:flex; align-items:center; justify-content:center; padding:4px; border-radius:50%; letter-spacing:1px; }
.post-menu summary:hover { background:var(--field); }
.post-menu[open] summary { color:var(--blue); background:var(--field); }
.post-menu>div { min-width:156px; border:1px solid var(--line); padding:5px; box-shadow:0 12px 32px #16395726; }
.post-menu>div button { text-align:left; border-radius:8px; }
.post-counts { padding:8px 0; font-size:.75rem; }
.post-counts>span:first-child { color:#a72c50; font-variant-numeric:tabular-nums; }
.post-actions { gap:4px; padding-top:6px; }
.post-actions button { min-height:38px; font-size:.8125rem; gap:6px; border-radius:10px; color:var(--muted); }
.post-actions button[aria-pressed=true] { color:#075faf; background:#e3f2ff; }
.post-actions .icon { width:19px; height:19px; }
.post-actions button[data-testid=save][aria-pressed=true] .icon { fill:currentColor; }
.reaction-picker { margin-top:8px; }
.reaction-picker summary { padding:4px 8px; border-radius:20px; border:1px solid var(--line); background:var(--field); font-size:.6875rem; }
.reaction-picker button { border-radius:20px; }
.composer { padding:12px; }
.composer textarea { min-height:62px; background:var(--field); font-size:.875rem; border-color:#c3dbeb; }
.composer footer { padding-top:9px; margin-top:9px; }
.ai-post-note,.ai-conversation-note { background:#edf7ff; border:0; border-left:3px solid #a5d5f4; color:var(--muted); font-size:.6875rem; padding:8px 10px; margin-bottom:10px; }
.balance-card { border:1px solid #bfe3f7; background:linear-gradient(120deg,#caedff,#e8f8ff); border-radius:17px; }
.balance-card strong { letter-spacing:-.6px; font-variant-numeric:tabular-nums; }
.suggestions,.wallet-summary,.governance-promo { padding:14px; }
.suggestions h2,.wallet-summary h2,.governance-promo h2 { font-size:.9375rem; }
.wallet-shortcuts { gap:6px; }
.wallet-shortcuts button { border-radius:12px; }
.governance-promo { background:linear-gradient(145deg,#f5fbff 35%,#e7f7ed); }
.empty { padding:28px 18px; }
.empty>.icon { width:32px; height:32px; margin-bottom:12px; color:var(--blue); }
.empty h2 { font-size:1.0625rem; }
.empty .welcome-art { max-width:480px; border-radius:16px; margin:0 auto 18px; }
.empty>button { border:1px solid var(--line); background:var(--field); margin-top:4px; }
.empty>button.primary { background:#0767bd; color:white; }
.modal-backdrop { background:#142b454f; backdrop-filter:blur(7px); overscroll-behavior:contain; }
.login-dialog { border-radius:24px; padding:28px; background:var(--surface); box-shadow:0 24px 90px #102c4d40,inset 0 1px 0 #fff; }
.login-dialog h1 { font-size:1.375rem; letter-spacing:-.4px; }
.login-dialog .login-mascot { width:68px; height:68px; margin-bottom:14px; }
.login-dialog .close { width:36px; min-height:36px; padding:0; border-radius:50%; background:var(--field); color:var(--muted); }
.login-dialog>p { margin-top:14px; }
.login-dialog label { margin-top:16px; font-size:.8125rem; }
.login-dialog input { min-height:44px; }
.login-error:empty { display:none; }
.login-dialog .login-error { color:#a52a43; }
.login-preview { font-size:.75rem; padding:8px 10px; background:var(--field); border-radius:10px; }
.login-dialog .wide { min-height:44px; margin-top:18px; }
:focus-visible { scroll-margin:20px; }
select:focus-visible { outline:3px solid #1262ad; outline-offset:3px; }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.feed-skeleton { padding:16px; overflow:hidden; }
.feed-skeleton i,.skeleton-media { display:block; background:#d7e9f5; border-radius:8px; }
.skeleton-header { display:flex; gap:10px; align-items:center; margin-bottom:20px; }
.skeleton-header .skeleton-avatar { width:40px; height:40px; border-radius:50%; }
.skeleton-header span { display:grid; gap:8px; width:150px; }
.skeleton-header span i { height:10px; }
.skeleton-header span i:last-child { width:65%; }
.skeleton-line { width:90%; height:12px; margin:10px 0; }
.skeleton-line.short { width:65%; }
.skeleton-media { height:110px; margin-top:20px; }
.feed-skeleton>div { animation:skeleton-breathe 1.4s ease-in-out infinite alternate; }
@keyframes skeleton-breathe { from{opacity:.45} to{opacity:.9} }
@keyframes refresh-turn { to{transform:rotate(360deg)} }
html[data-theme=dark] { --ink:#e7f1fc; --muted:#abc0d5; --surface:#172d43; --field:#10263b; --line:#395671; --glass:linear-gradient(145deg,#1b334bf5,#152a40f5); }
html[data-theme=dark] body { background:radial-gradient(ellipse at 0 0,#1e415d,transparent 65%),#0c2033; }
html[data-theme=dark] .glass { border-color:#3a566e; box-shadow:0 4px 18px #06142124,inset 0 1px 0 #ffffff08; }
html[data-theme=dark] .masthead,html[data-theme=dark] .sidebar { background:linear-gradient(120deg,#1d3c55,#152d44); }
html[data-theme=dark] .global-search { background:#10283e; border-color:#3d607e; }
html[data-theme=dark] .preferences-toggle[aria-expanded=true] { color:#d4ecff; background:#254764; }
html[data-theme=dark] .theme-picker,html[data-theme=dark] .layout-picker,html[data-theme=dark] .feed-filters { background:#10283d; border-color:#3a5873; }
html[data-theme=dark] .preferences { border-color:var(--line); }
html[data-theme=dark] .story-empty { background:linear-gradient(110deg,#1d3b55,#17314a); }
html[data-theme=dark] .post-counts>span:first-child { color:#ffa9bf; }
html[data-theme=dark] .post-actions button[aria-pressed=true] { background:#20496d; color:#b0dfff; }
html[data-theme=dark] .ai-post-note,html[data-theme=dark] .ai-conversation-note { background:#142f47; border-color:#3e769f; }
html[data-theme=dark] .feed-heading { background:transparent; border:0; box-shadow:none; }
html[data-theme=dark] .feed-skeleton i,html[data-theme=dark] .skeleton-media { background:#345570; }
html[data-theme=dark] .login-dialog .login-error { color:#ffb3c2; }
@media(hover:hover) {
 .story-item:hover .story-ring { transform:translateY(-2px); }
 .story-ring { transition:transform 180ms cubic-bezier(.16,1,.3,1); }
 .sidebar nav button:hover:not(.active),.post-actions button:hover { background:#e4f3fd; color:#075fa7; }
 html[data-theme=dark] .sidebar nav button:hover:not(.active),html[data-theme=dark] .post-actions button:hover { background:#284d6d; color:#e7f3ff; }
}
@media(min-width:1700px) { .layout { grid-template-columns:248px minmax(0,1fr) 340px; } .post-body { max-width:90ch; } }
@media(max-width:1250px) { .preferences-panel { flex-basis:100%; padding-top:6px; border-top:1px solid var(--line); } .brand { font-size:1.25rem; } }
@media(max-width:950px) { .global-search { margin:0; } .preferences-panel { gap:10px; } .font-picker { max-width:none; } }
@media(max-width:620px) {
 body { padding:6px 6px calc(80px + env(safe-area-inset-bottom)); padding-top:max(6px,env(safe-area-inset-top)); }
 .masthead { padding:9px 10px; border-radius:20px; }
 .header-line { min-height:40px; gap:6px; }
 .brand { gap:4px; font-size:1.0625rem; min-width:0; }
 .brand strong { letter-spacing:-.45px; }
 .fruit-mark { width:30px; height:34px; }
 .notification-button { width:34px; min-width:34px; }
 .header-line>.primary { padding:7px 10px; font-size:.75rem; min-height:38px; flex-shrink:0; }
 .logout-button { padding:6px; border:0; }
 .preferences { display:flex; align-items:stretch; gap:7px; margin-top:8px; padding-top:7px; }
 .preferences-toggle { flex:0 1 100px; margin:0; min-width:0; font-size:.6875rem; gap:4px; padding:4px; white-space:normal; text-align:left; }
 .preferences-toggle>.icon { width:16px; height:16px; }
 .settings-chevron { width:10px; }
 .layout-setting { flex:1; display:flex; margin:0; max-width:none; }
 .layout-picker { flex:1; max-width:none; }
 .layout-picker button { font-size:.6875rem; gap:4px; padding:5px 4px; min-height:36px; }
 .layout-picker svg { width:15px; height:15px; }
 .preferences-panel { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px 8px; padding:10px 0 2px; }
 .theme-picker { grid-column:1 / -1; justify-content:stretch; }
 .theme-picker button { flex:1; font-size:.8125rem; }
 .font-picker { grid-column:1 / -1; display:flex; font-size:.8125rem; }
 .font-picker select { height:44px; width:100%; }
 .font-size-picker { flex:none; justify-content:space-between; min-width:0; }
 .font-size-picker button { min-width:30px; padding:5px; font-size:.8125rem; }
 .language-picker { min-width:0; }
 .language-picker select { max-width:none; }
 .layout { gap:10px; margin-top:10px; }
 .sidebar { margin-bottom:8px; padding:0; background:none; }
 html[data-theme=dark] .sidebar { background:none; border:0; box-shadow:none; }
 .sidebar nav { gap:5px; margin:0; }
 .sidebar nav button,.sidebar .nav-secondary button { min-height:34px; padding:6px 9px; border-radius:10px; background:#f1faff; font-size:.6875rem; }
 .nav-secondary { gap:5px; }
 .stories { padding:10px; }
 .stories .section-title { margin-bottom:8px; }
 .stories h2 { font-size:1rem; }
 .story-empty p { font-size:.75rem; line-height:1.45; }
 .story-empty img { width:82px; height:76px; }
 .guest-composer { flex-wrap:nowrap; padding:12px 10px; gap:8px; font-size:.8125rem; }
 .guest-composer .fruit-avatar { width:32px; height:32px; }
 .guest-composer .primary { width:auto; max-width:110px; font-size:.75rem; padding:7px 10px; }
 .feed-filters { padding:4px; gap:2px; border-radius:14px; }
 .feed-filters button { font-size:.6875rem; padding:6px 3px; min-height:36px; }
 .post { padding:12px; }
 .post .author { font-size:.875rem; }
 .post-body { font-size:.875rem; line-height:1.5; }
 .post-meta { font-size:.625rem; }
 .post-actions button { font-size:.6875rem; min-height:44px; gap:4px; padding:5px 2px; }
 .post-counts { font-size:.6875rem; }
 .mobile-tabs { left:6px; right:6px; bottom:max(6px,env(safe-area-inset-bottom)); padding:6px 4px; border:1px solid #fff; border-radius:22px; background:#f6fcfff5; box-shadow:0 4px 24px #204d7426; }
 .mobile-tabs button { flex:1; min-width:0; padding:5px 2px; font-size:.625rem; }
 .mobile-tabs button.active { background:#e1f2ff; color:#0062b8; }
 .login-dialog { padding:24px 18px; }
 html[data-theme=dark] .mobile-tabs { border-color:#3b5872; background:#172e45f5; }
 html[data-theme=dark] .mobile-tabs button.active { background:#254c6f; color:#c0e5ff; }
}
@media(pointer:coarse) { .preferences button,.preferences select,.sidebar nav button,.sidebar .nav-secondary button,.feed-filters button { min-height:44px; } .reaction-picker summary { min-height:32px; padding:7px 10px; } }
@media(prefers-reduced-motion:reduce) { .feed-skeleton>div,.feed-refresh .icon,.story-ring,.settings-chevron { animation:none!important; transition:none!important; } }
body:has(.modal-backdrop) { overflow:hidden; }
html[data-layout=horizontal] .sidebar { border-radius:15px; }
@media(max-width:620px) { html[data-layout=horizontal] .sidebar { padding:0; } }
/* Keep iOS inputs at 16px or more so focus does not zoom the viewport. */
@media(pointer:coarse) {
 .preferences select,.composer textarea,.explore-search input,.login-dialog input,
 .secret-field input,.wallet input,.wallet select,.agent-generation :is(input,textarea,select),
 .profile-editor :is(input,textarea),.composer-options select,.story-viewer textarea {
  font-size:max(1rem,16px);
 }
 .header-line>.primary,.header-line>.messenger-link,.header-line>.notification-button { min-height:44px; min-width:44px; }
}
/* Fade the decorative scrim, keeping dialog text readable during motion. */
.modal-backdrop { background:transparent; isolation:isolate; }
.modal-backdrop::before { content:""; position:fixed; inset:0; z-index:-1; background:#142b454f; pointer-events:none; animation:scrim-in 180ms ease-out both; }
.modal-backdrop[data-leaving=true]::before { animation:scrim-out 120ms ease-in both; }
@keyframes scrim-in { from{opacity:0} to{opacity:1} }
@keyframes scrim-out { from{opacity:1} to{opacity:0} }
@media(prefers-reduced-motion:reduce) { .modal-backdrop::before { animation:none!important; } }