/* Shared application components for secondary community pages. */
body[data-ui-shell="community"]{--white:#fffdf8;--line:#e7ddcf;--muted:#948479;--red:#bd657b}
body[data-ui-shell="community"] .main>.app-page-heading{max-width:1260px;margin-inline:auto;margin-bottom:24px;align-items:center}
body[data-ui-shell="community"] .app-page-heading>div:first-child{display:flex;align-items:center;gap:14px;flex-basis:240px}
.page-icon{display:grid;place-items:center;flex-shrink:0;width:48px;height:48px;border:1px solid #f7efe3;background:#f4e5d6;color:#bc8965;border-radius:14px}.page-icon svg{width:23px;height:23px}
body[data-ui-shell="community"] .app-page-heading h1{font-size:27px;line-height:1.4;font-weight:700}
body[data-ui-shell="community"] .app-page-heading p{font-size:13px;line-height:1.6;color:#98887c;margin:5px 0 0}
body[data-ui-shell="community"] .heading-tools .button{min-height:40px;padding:9px 14px;font-size:13px}
body[data-ui-shell="community"] :is(.card,.job-card,.food-card,.timeline-row,.ledger-row,.coupon,.service-tile){transition:transform 200ms var(--ease),border-color 200ms,background-color 200ms,box-shadow 200ms}
body[data-ui-shell="community"] .card{background:#fffdf8;border:1px solid #e7ddcf;border-radius:17px;padding:22px;box-shadow:0 3px 12px #57382103}
body[data-ui-shell="community"] .grid{gap:18px;align-items:stretch}
body[data-ui-shell="community"] .card h3{font-size:17px;font-weight:600;color:#543e30;line-height:1.55}
body[data-ui-shell="community"] :is(.vendor-card p,.side-card p,.social-card p,.creator-card p,.reward-card p){font-size:13px;line-height:1.8;color:#97877c}
body[data-ui-shell="community"] :is(.badge,.badge.warm,.badge.neutral){background:#f9f6f1;color:#a08978;font-size:11px;padding:4px 8px;border-radius:6px;line-height:1.6}
body[data-ui-shell="community"] :is(.muted,.prose){color:#978476}
body[data-ui-shell="community"] .note{background:#f8f5f0;border:1px solid #f2ede7;color:#aa8f7b;font-size:12px;line-height:1.8;padding:12px 15px}
body[data-ui-shell="community"] .chipbar{gap:7px;flex-wrap:wrap;margin-bottom:22px}
body[data-ui-shell="community"] .chipbar .chip{border:1px solid #f0eae1;background:transparent;color:#9b887b;border-radius:10px;padding:8px 15px;font-size:13px;min-height:38px;white-space:nowrap}
body[data-ui-shell="community"] .chipbar .chip.active{background:#f4e5d6;border-color:#f2e5d3;color:#a84935;font-weight:500}
body[data-ui-shell="community"] .service-grid{background:#fffdf8;border:1px solid #e7ddcf;padding:13px;border-radius:17px;gap:8px;margin-bottom:22px}
body[data-ui-shell="community"] .service-tile{border:1px solid transparent;border-radius:12px;padding:17px 8px;background:transparent;color:#9c8677;gap:10px;font-size:13px}
body[data-ui-shell="community"] .service-tile svg{width:24px;height:24px}
body[data-ui-shell="community"] .service-tile.active{color:#a84935;background:#f4e5d6;border-color:#f7efe3}
body[data-ui-shell="community"] .vendor-symbol{width:54px;height:54px;border-radius:13px;background:#faf5ef;color:#b49279}
body[data-ui-shell="community"] .vendor-symbol svg{width:25px;height:25px}
body[data-ui-shell="community"] .vendor-card{gap:15px;align-items:flex-start}
body[data-ui-shell="community"] .vendor-card .body{display:flex;flex-direction:column;align-self:stretch}
body[data-ui-shell="community"] .vendor-meta{gap:10px;padding-top:16px;margin-top:auto;flex-wrap:wrap}
body[data-ui-shell="community"] .vendor-meta a{display:flex;gap:5px;align-items:center;min-height:36px;font-size:12px;color:#b57d55}
body[data-ui-shell="community"] .vendor-meta a svg{width:14px;height:14px}
body[data-ui-shell="community"] .vendor-meta strong{color:#8e6649;font-size:15px}
body[data-ui-shell="community"] .search-filter{background:#fffdf8;border:1px solid #e7ddcf;border-radius:14px;padding:10px;margin-bottom:22px;gap:10px}
body[data-ui-shell="community"] .search-filter input{max-width:none;flex:1;background:#fbf9f6;border:1px solid #f5f1ec;font-size:14px;min-width:100px}
body[data-ui-shell="community"] .search-filter select{font-size:13px;background:#fbf9f6;width:140px}
body[data-ui-shell="community"] .search-filter .button{min-height:44px}
body[data-ui-shell="community"] .job-card{background:#fffdf8;border:1px solid #e7ddcf;border-radius:15px;padding:22px;gap:16px;align-items:center}
body[data-ui-shell="community"] .job-card:first-child{border:1px solid #e7ddcf}
body[data-ui-shell="community"] .job-card h3{font-size:17px;color:#543e30;line-height:1.5;margin-bottom:10px}
body[data-ui-shell="community"] .job-meta{gap:8px;color:#af9481;align-items:center;font-size:12px}
body[data-ui-shell="community"] .job-card .job-company{font-size:12px;color:#ae9380;margin-top:12px}
body[data-ui-shell="community"] .salary{font-size:21px;color:#b0774e;font-weight:650}
body[data-ui-shell="community"] .job-right{gap:12px;flex-shrink:0}
body[data-ui-shell="community"] .side-card{padding:23px;background:#fffdf8}
body[data-ui-shell="community"] .side-card h3{font-size:17px}
body[data-ui-shell="community"] .event-card{display:flex;flex-direction:column;align-items:flex-start}
body[data-ui-shell="community"] .event-art{height:180px;width:100%;background:#f5f2ed;border-radius:12px;margin-bottom:17px}
body[data-ui-shell="community"] .event-art img{width:100%;height:100%;inset:0;object-fit:cover;opacity:1;transition:transform 550ms var(--ease)}
body[data-ui-shell="community"] .event-art:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#3e281855);pointer-events:none}
body[data-ui-shell="community"] .event-art .event-number{position:absolute;bottom:12px;left:12px;font:600 16px -apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;background:#fffdf8ed;color:#9c7254;text-shadow:none;border:1px solid #fffdf8b0;border-radius:8px;padding:6px 10px}
body[data-ui-shell="community"] .event-card h3{font-size:18px;margin:12px 0 8px}
body[data-ui-shell="community"] .event-card .event-meta{font-size:12px;color:#ad9380;line-height:1.85}
body[data-ui-shell="community"] .event-bottom{width:100%;padding-top:17px;margin-top:auto;border-top:1px solid #f7f4f0}
body[data-ui-shell="community"] .event-bottom small{font-size:11px;color:#b19886}
body[data-ui-shell="community"] .calendar-square{color:#bb8c6a;background:#fbf7f1;border:1px solid #f6eee2;border-radius:11px}
body[data-ui-shell="community"] .timeline-row{background:#fffdf8;border:1px solid #e7ddcf;border-radius:13px;padding:17px;margin-bottom:10px}
body[data-ui-shell="community"] .timeline-row h3{font-size:14px;color:#7c6250;line-height:1.5}
body[data-ui-shell="community"] .timeline-row p{font-size:12px;color:#af9582;line-height:1.7}
body[data-ui-shell="community"] .map-canvas{background:#eff3ee;min-height:500px;border-radius:17px;border-color:#efebe5;isolation:isolate}
body[data-ui-shell="community"] .map-canvas:before{display:none}
body[data-ui-shell="community"] .map-canvas>img{inset:0;width:100%;height:100%;object-fit:cover;opacity:1}
body[data-ui-shell="community"] :is(.map-caption,.map-legend){background:#fffdf8eb;color:#998374;border:1px solid #fffdf8b8;backdrop-filter:blur(16px);border-radius:10px;font-size:11px}
body[data-ui-shell="community"] .map-pin{background:#b78c6e;transition:width 240ms,height 240ms,background 180ms,box-shadow 180ms,transform 180ms}
body[data-ui-shell="community"] .map-pin.selected{background:#a84935;box-shadow:0 0 0 6px #a8493520,0 3px 12px #55362050}
body[data-ui-shell="community"] .map-pin:active{transform:rotate(-45deg) scale(.92)}
body[data-ui-shell="community"] .food-card{border-color:#e7ddcf;background:#fffdf8;border-radius:14px;padding:18px;min-width:0}
body[data-ui-shell="community"] .food-card.selected{border-color:#ebd6b9;background:#fcf9f5;box-shadow:0 0 0 3px #a8493506}
body[data-ui-shell="community"] .food-card .food-icon{width:47px;height:47px;background:#faf4ec;color:#b2896b;border-radius:12px}
body[data-ui-shell="community"] .food-icon svg{width:23px;height:23px}
body[data-ui-shell="community"] .food-card p{font-size:12px;color:#ad927f}
body[data-ui-shell="community"] .food-card small{font-size:11px;color:#b18c71;line-height:1.7}
body[data-ui-shell="community"] .merchant-hero{background:#fffdf8;border:1px solid #e7ddcf;border-radius:17px;padding:25px;grid-template-columns:minmax(0,1fr) 43%;gap:24px}
body[data-ui-shell="community"] .merchant-hero img{width:100%;height:230px;max-height:none;object-fit:cover;border-radius:12px;opacity:1}
body[data-ui-shell="community"] .merchant-hero h1{font-size:30px;margin:12px 0}
body[data-ui-shell="community"] .merchant-hero p{color:#aa8f7b;font-size:14px}
body[data-ui-shell="community"] .info-row{font-size:13px;color:#9a8677;line-height:1.9}
body[data-ui-shell="community"] .social-card,body[data-ui-shell="community"] .creator-card{display:flex;flex-direction:column;align-items:flex-start}
body[data-ui-shell="community"] :is(.social-card,.creator-card) .avatar{background:#faf6ef;color:#b99276;border:1px solid #f6ede0;border-radius:17px;width:54px;height:54px;font-size:21px}
body[data-ui-shell="community"] .social-card>div:last-child,body[data-ui-shell="community"] .creator-card>.button{margin-top:auto;padding-top:14px}
body[data-ui-shell="community"] .creator-card>.button{padding:10px 14px}
body[data-ui-shell="community"] .circle-row{width:100%;padding:10px;border-radius:10px;min-height:50px;text-align:left;color:#9a8474;transition:background 200ms,transform 200ms}
body[data-ui-shell="community"] .circle-row .circle-icon{color:#b5947d;background:#faf6f0;border-radius:10px}
body[data-ui-shell="community"] .circle-row small{color:#baa393;font-size:11px}
body[data-ui-shell="community"] .wallet{border:1px solid #f6ecde;background:linear-gradient(125deg,#fffdf8,#fcf8f3);border-radius:18px;padding:28px;color:#584334}
body[data-ui-shell="community"] .wallet:after{border-color:#a849350c}
body[data-ui-shell="community"] .wallet small{font-size:13px;color:#ad927f}
body[data-ui-shell="community"] .wallet .balance{font-size:48px;color:#a56b42;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-1px;line-height:1.6}
body[data-ui-shell="community"] .wallet p{font-size:12px;color:#af9583}
body[data-ui-shell="community"] .wallet .button{background:#a84935;color:white}
body[data-ui-shell="community"] .wallet-rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border:0;padding:0;margin:17px 0 24px}
body[data-ui-shell="community"] .wallet-rules>div{background:#fffdf8;border:1px solid #efebe5;border-radius:13px;padding:17px}
body[data-ui-shell="community"] .wallet-rules strong{font-size:20px;color:#b48564}
body[data-ui-shell="community"] .wallet-rules p{font-size:12px;line-height:1.8;color:#b09683}
body[data-ui-shell="community"] .reward-card .reward-icon{background:#fbf7f2;color:#bc9a81;border-radius:12px}
body[data-ui-shell="community"] .reward-bottom strong{color:#b47e58}
body[data-ui-shell="community"] .ledger-row{background:#fffdf8;border:1px solid #e7ddcf;border-radius:12px;padding:17px;margin-bottom:9px;font-size:13px}
body[data-ui-shell="community"] .ledger-row small{font-size:11px;color:#b59d8b}
body[data-ui-shell="community"] .coupon{background:#fcf8f3;border:1px dashed #efe1ce;border-radius:13px;margin-bottom:12px}
body[data-ui-shell="community"] .coupon .coupon-value{font-family:inherit;color:#b48564;font-weight:600}
body[data-ui-shell="community"] .steps{gap:12px;padding:16px;background:#fffdf8;border:1px solid #efebe5;border-radius:14px;margin-bottom:20px;align-items:center}
body[data-ui-shell="community"] .step{font-size:12px;color:#b49b89}body[data-ui-shell="community"] .step span{background:#faf6f1;color:#b69d8b}
body[data-ui-shell="community"] .step.active{color:#bf8257}
body[data-ui-shell="community"] .step.active span{background:#f4e5d6;color:#bf8257}
body[data-ui-shell="community"] .field{color:#856b58;font-size:13px;gap:9px}
body[data-ui-shell="community"] :is(input,select,textarea){border-color:#f1ebe3;color:#6d5544;background:#fdfcfa;transition:border-color 180ms,box-shadow 180ms,background 180ms}
body[data-ui-shell="community"] :is(input,select,textarea):focus{background:#fffdf8;border-color:#ead5b8;box-shadow:0 0 0 4px #a8493509}
body[data-ui-shell="community"] .profile-header{padding-bottom:23px;border-bottom:1px solid #f6f2ed;gap:17px}
body[data-ui-shell="community"] .profile-header .avatar{background:#faf6f0;color:#bc9478;border:1px solid #f7efe3;border-radius:18px;width:64px;height:64px}
body[data-ui-shell="community"] .profile-header .avatar svg{width:29px;height:29px}
body[data-ui-shell="community"] .profile-header h2{font-size:21px;margin-bottom:5px}
body[data-ui-shell="community"] .profile-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 0}
body[data-ui-shell="community"] .profile-stats>*{text-align:left;background:#fcfaf6;border:1px solid #f6f3ee;border-radius:12px;padding:17px;transition:background 200ms,transform 200ms}
body[data-ui-shell="community"] .profile-stats strong{font-size:26px;color:#b68664;font-variant-numeric:tabular-nums}
body[data-ui-shell="community"] .profile-stats span{font-size:12px;color:#b19886;margin-top:4px}
body[data-ui-shell="community"] .profile-tabs{gap:4px;background:#f8f5f0;padding:5px;border:0;border-radius:11px;width:max-content;max-width:100%;margin-bottom:22px;overflow:auto;scrollbar-width:none}
body[data-ui-shell="community"] .profile-tabs button{border:0;border-radius:8px;padding:9px 18px;color:#ac907c;font-size:13px;min-height:39px;white-space:nowrap}
body[data-ui-shell="community"] .profile-tabs button.active{background:#fffdf8;color:#ae744a;box-shadow:0 2px 6px #714e3510}
body[data-ui-shell="community"] .profile-tabs~.post-card{margin-bottom:16px}
body[data-ui-shell="community"] .empty{border:1px dashed #f0e9df;border-radius:15px;background:#fefefd;padding:45px 20px}
body[data-ui-shell="community"] .empty>svg{width:34px;height:34px;color:#cbb09c}
body[data-ui-shell="community"] .empty h3{font-size:16px;color:#8b7260}body[data-ui-shell="community"] .empty .muted{font-size:13px!important}
body[data-ui-shell="community"] .game-tile{background:#fbf6f0;border:1px solid #f5ebdd;color:#c09a7f;display:grid;place-items:center;border-radius:14px;perspective:500px}
body[data-ui-shell="community"] .game-tile svg{width:29px;height:29px;transition:transform 240ms}
body[data-ui-shell="community"] .game-tile.flipped{background:#fffdf8;border-color:#ebd7bc;box-shadow:0 5px 14px #b0704315}
body[data-ui-shell="community"] .game-tile.flipped svg{transform:scale(1.15)}
body[data-ui-shell="community"] .game-tile.matched{background:#eaf3f2;color:#779d97;border-color:#d3e6e3;opacity:.8}
@media(hover:hover){body[data-ui-shell="community"] .card:hover{border-color:#ede1d1}body[data-ui-shell="community"] .service-tile:hover{background:#fbf7f1;transform:translateY(-2px)}body[data-ui-shell="community"] .event-card:hover .event-art img{transform:scale(1.035)}body[data-ui-shell="community"] .job-card:hover{border-color:#f0e1cc;box-shadow:0 6px 17px #744f3410}body[data-ui-shell="community"] .circle-row:hover,body[data-ui-shell="community"] .profile-stats>*:hover{background:#faf5ef}body[data-ui-shell="community"] .chipbar .chip:hover{background:#faf5ef;color:#b07a54}}
@media(max-width:1020px){body[data-ui-shell="community"] .grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-ui-shell="community"] .application-layout{grid-template-columns:minmax(0,1fr)}body[data-ui-shell="community"] .application-layout>aside{display:none}}
@media(max-width:760px){body[data-ui-shell="community"] .app-page-heading>div:first-child{gap:11px;align-items:center}.page-icon{width:41px;height:41px;border-radius:12px}.page-icon svg{width:20px;height:20px}body[data-ui-shell="community"] .app-page-heading h1{font-size:24px}body[data-ui-shell="community"] .app-page-heading p{font-size:12px;line-height:1.7}body[data-ui-shell="community"] .main>.app-page-heading{margin-bottom:20px}body[data-ui-shell="community"] .heading-tools{margin-top:13px;justify-content:flex-end}body[data-ui-shell="community"] .heading-tools .button{min-height:38px;font-size:12px}body[data-ui-shell="community"] .grid.two,body[data-ui-shell="community"] .grid.three{grid-template-columns:minmax(0,1fr);gap:14px}body[data-ui-shell="community"] .card{padding:19px;border-radius:15px}body[data-ui-shell="community"] .chipbar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:3px 1px 7px;gap:6px;max-width:100%}body[data-ui-shell="community"] .chipbar .chip{flex-shrink:0;padding:8px 13px;min-height:38px;font-size:12px}body[data-ui-shell="community"] .service-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:8px;border-radius:15px}body[data-ui-shell="community"] .service-tile{padding:13px 3px;font-size:12px;gap:9px}body[data-ui-shell="community"] .service-tile svg{width:21px;height:21px}body[data-ui-shell="community"] .vendor-card{gap:12px}body[data-ui-shell="community"] .vendor-symbol{width:43px;height:43px;border-radius:11px}body[data-ui-shell="community"] .vendor-symbol svg{width:21px;height:21px}body[data-ui-shell="community"] .vendor-card h3{font-size:16px}body[data-ui-shell="community"] .vendor-card p{font-size:13px}body[data-ui-shell="community"] .search-filter{display:flex;flex-wrap:wrap;padding:9px;gap:8px}body[data-ui-shell="community"] .search-filter input{flex-basis:100%;width:100%}body[data-ui-shell="community"] .search-filter select{flex:1}body[data-ui-shell="community"] .search-filter .button{margin-left:auto;min-height:42px;padding:9px 16px}body[data-ui-shell="community"] .job-card{padding:18px;flex-direction:column;align-items:stretch;gap:16px}body[data-ui-shell="community"] .job-right{flex-direction:row;align-items:center;justify-content:space-between;border-top:1px solid #f7f4f0;padding-top:13px}body[data-ui-shell="community"] .job-card h3{font-size:17px}body[data-ui-shell="community"] .salary{font-size:20px}body[data-ui-shell="community"] .job-company{font-size:12px!important}body[data-ui-shell="community"] .event-art{height:190px}body[data-ui-shell="community"] .event-bottom{margin-top:16px}body[data-ui-shell="community"] .map-canvas{min-height:360px}body[data-ui-shell="community"] .food-list{grid-template-columns:1fr}body[data-ui-shell="community"] .merchant-hero{grid-template-columns:1fr;padding:19px;gap:17px}body[data-ui-shell="community"] .merchant-hero img{grid-column:1;grid-row:2;height:170px;max-height:none}body[data-ui-shell="community"] .merchant-hero .hero-copy{grid-column:1;grid-row:1}body[data-ui-shell="community"] .merchant-hero h1{font-size:27px}body[data-ui-shell="community"] .formgrid{grid-template-columns:minmax(0,1fr);gap:17px}body[data-ui-shell="community"] .field.full{grid-column:auto}body[data-ui-shell="community"] .wallet{padding:22px;gap:16px}body[data-ui-shell="community"] .wallet .balance{font-size:43px}body[data-ui-shell="community"] .wallet-rules{gap:8px}body[data-ui-shell="community"] .wallet-rules>div{padding:12px 10px}body[data-ui-shell="community"] .wallet-rules strong{font-size:18px}body[data-ui-shell="community"] .wallet-rules p{font-size:11px}body[data-ui-shell="community"] .reward-card{display:grid;grid-template-columns:64px minmax(0,1fr);gap:0 14px}body[data-ui-shell="community"] .reward-card .reward-icon{height:72px;grid-row:1/4;margin:0}body[data-ui-shell="community"] .reward-card :is(h3,p,.reward-bottom){grid-column:2}body[data-ui-shell="community"] .reward-card p{font-size:12px}body[data-ui-shell="community"] .profile-stats{gap:8px}body[data-ui-shell="community"] .profile-stats>*{padding:13px 10px}body[data-ui-shell="community"] .profile-stats strong{font-size:24px}body[data-ui-shell="community"] .profile-stats span{font-size:11px}body[data-ui-shell="community"] .profile-tabs{width:100%;gap:3px;padding:4px}body[data-ui-shell="community"] .profile-tabs button{flex:1;padding:8px 9px;font-size:12px}body[data-ui-shell="community"] .steps{gap:8px;padding:13px 10px}body[data-ui-shell="community"] .step{gap:5px;font-size:11px}body[data-ui-shell="community"] .steps>svg{width:11px;height:11px}body[data-ui-shell="community"] .timeline-row{padding:15px 12px;gap:10px}body[data-ui-shell="community"] .timeline-row h3{font-size:13px}.game-grid{gap:10px}}
@media(prefers-reduced-motion:reduce){body[data-ui-shell="community"] :is(.card,.job-card,.food-card,.timeline-row,.ledger-row,.coupon,.service-tile,.game-tile svg){transition:none!important}}

/* Shared touch and keyboard feedback on every community screen. */
body[data-ui-shell="community"] :is(button,a){touch-action:manipulation;transition:transform 180ms cubic-bezier(.2,.8,.2,1),background-color 180ms,color 180ms,border-color 180ms,box-shadow 200ms}
body[data-ui-shell="community"] :is(button,a):active{transform:scale(.97)}
body[data-ui-shell="community"] .map-pin:active{transform:rotate(-45deg) scale(.92)}
body[data-ui-shell="community"] :is(button,a):focus-visible{outline:2px solid #a84935;outline-offset:3px}
body[data-ui-shell="community"] button:disabled{cursor:not-allowed;opacity:.5;transform:none}
@media(max-width:760px){body[data-ui-shell="community"] :is(input,select,textarea),body[data-ui-shell="community"] .search-filter :is(input,select){font-size:16px}}
@media(prefers-reduced-motion:reduce){body[data-ui-shell="community"] :is(button,a,input,select,textarea){transition:none!important}}
