*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f3f1e8;color:#20251e;font:16px/1.6 system-ui,sans-serif}header{display:flex;justify-content:space-between;align-items:center;padding:24px 5%;border-bottom:1px solid #ccc}a{color:inherit}header a:first-child{font-size:24px;font-weight:800;text-decoration:none}header span{display:block;font-size:10px;letter-spacing:3px}main{max-width:1280px;margin:auto;padding:40px 5%}.hero{padding:32px 0 48px;max-width:800px}h1{font-size:clamp(42px,7vw,82px);line-height:1.02;letter-spacing:-4px;margin:20px 0}h2{line-height:1.2}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:800}.layout{display:grid;grid-template-columns:1.7fr 1fr;gap:24px}.panel{background:#fffefa;border:1px solid #d8d8ca;border-radius:18px;padding:28px;margin-bottom:24px}.panel h2{margin-top:0}nav{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-bottom:28px}label{display:block;margin:14px 0;font-weight:600}input,textarea,select{display:block;width:100%;font:inherit;padding:12px;border:1px solid #b6bdaf;border-radius:8px;background:white;color:#20251e;margin-top:6px}button{font:inherit;cursor:pointer;padding:12px 18px;border:1px solid #20251e;border-radius:8px;background:#20251e;color:white;min-height:46px}.primary{background:#d4f77a;color:#20251e}.check{display:flex;align-items:flex-start;gap:10px}.check input{width:20px;flex-shrink:0}.muted,small{color:#616857;font-size:13px}article{border-top:1px solid #d8d8ca;padding:24px 0;overflow-wrap:anywhere}article p{white-space:pre-wrap}article h3{margin:6px 0}.tag{display:inline-block;background:#edf0e5;padding:3px 9px;border-radius:30px;font-size:12px}.stats{font-size:20px;font-weight:700}#status:not(:empty){padding:12px;background:#e5edce;border-radius:8px}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #537b13;outline-offset:3px}@media(max-width:760px){.layout{grid-template-columns:1fr}main{padding:24px 5%}.panel{padding:20px}header{gap:20px;font-size:13px}h1{letter-spacing:-2px}aside{display:contents}}
/* Consistent controls across DJ setup and community. */
header{background:#f3f1e8}header a{min-height:44px;display:inline-flex;align-items:center}nav{position:sticky;top:0;z-index:2;background:#f3f1e8;padding:12px 0;border-bottom:1px solid #d8d8ca}nav a{min-height:44px;display:inline-flex;align-items:center}button,input,textarea,select{font-size:16px}button:hover{filter:brightness(.96)}button:disabled{opacity:.55;cursor:wait}input:focus,textarea:focus{border-color:#66833c}#feed article{scroll-margin-top:100px}#liveStatus{display:inline-block;background:#edf2df;padding:7px 12px;border-radius:30px;margin:0 0 12px}#status:empty{display:none}#setup{box-shadow:0 14px 40px #20251e08}#setup button{width:100%;margin-top:12px}#setup[hidden]{display:none}#conversation,#directory,#referrals{scroll-margin-top:95px}@media(max-width:760px){header{padding:16px 5%}header a:first-child{font-size:22px}header img{width:36px;height:36px}header a:last-child{font-size:12px}nav{gap:15px;justify-content:space-between}nav a{font-size:13px}nav button{font-size:12px;padding:8px 10px}.hero{padding:10px 0 25px}h1{font-size:46px}input,textarea,select{max-width:100%}.panel{border-radius:16px}main{padding-top:24px}.layout{gap:0}}
.section-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.section-row h2{margin-bottom:8px}.person-heading{display:flex;gap:12px;align-items:center}.person-heading small{display:block;margin-top:3px}.profile-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;flex-shrink:0;background:#e9eedf}.initials{display:inline-flex;align-items:center;justify-content:center;font-size:21px;font-weight:700;color:#496435}#avatarPreview .profile-avatar{width:90px;height:90px;margin:6px 0 14px}.feed-card{border:1px solid #dde1d5;border-radius:14px;margin-top:22px;padding:20px!important;background:white}.feed-card h3{margin-top:18px}.feed-photo{display:block;width:100%;max-height:520px;object-fit:contain;background:#f3f1e8;border-radius:10px}.media-link{display:block;padding:16px;background:#edf2df;border-radius:10px;margin-top:14px;font-weight:600;overflow-wrap:anywhere}.remove-post{display:block;background:transparent;color:#63715d;border:0;padding:7px 0;font-size:12px;margin-top:12px}.community-empty{text-align:center;padding:35px 15px;color:#63715d}.directory-controls{display:grid;grid-template-columns:1fr 140px;gap:16px}.member-links{display:flex;gap:18px;font-size:13px}#chatMessages{max-height:430px;overflow-y:auto;overscroll-behavior:contain;padding:4px 12px 4px 0}.chat-bubble{background:#eef2e5;border:0;border-radius:14px;padding:15px;margin:12px 0}.chat-bubble p{margin-bottom:0}.chat-bubble .profile-avatar{height:34px;width:34px}.chat-compose{display:flex;gap:10px;align-items:center;margin:12px 0}.chat-compose input{min-width:0;margin:0}.chat-compose button{flex-shrink:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#chat,#myprofile{scroll-margin-top:95px}@media(max-width:760px){.directory-controls{grid-template-columns:1fr}.layout>aside{display:block}.section-row .tag{font-size:10px}.feed-card{padding:15px!important}.chat-compose{gap:7px}nav{gap:8px}nav a{font-size:12px}nav button{font-size:11px}.hero p{font-size:15px}.panel{min-width:0}header span{letter-spacing:1px}.profile-avatar{height:42px;width:42px}}
#drinkQueue,#signatureMenu,#topDrinks,#recipes,#request,#menu,#tips{scroll-margin-top:100px}#drinkQueueItems button{margin:4px 4px 0 0}#myDrinks button{margin:4px 4px 0 0}#menuItems details summary,#communityRecipes details summary,#communityTopDrinks details summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:#476336;font-weight:600}#drinkQueueItems article p,#myDrinks article p{white-space:pre-wrap}.layout>section{min-width:0}#drinkEditor button{margin-bottom:8px}#drinkQueueItems:empty{display:none}#barContent nav{flex-wrap:wrap}#barContent nav a{font-size:13px}
[hidden]{display:none!important}

.brand-banner{max-width:320px;margin:16px auto 24px;background:#fff;border-radius:18px;overflow:hidden}.brand-banner img{display:block;width:100%;height:auto;object-fit:contain}@media(max-width:600px){.brand-banner{max-width:220px;margin:12px auto 18px}}

.brand-banner-wide{max-width:640px}.brand-banner-wide img+img{border-top:12px solid #fff}body:has(#hubBrand[data-role="bartender"]) .hero .eyebrow{font-size:0}body:has(#hubBrand[data-role="bartender"]) .hero .eyebrow:after{content:"BEHIND THE BAR. IN GOOD COMPANY.";font-size:12px}

.bot-source{display:block;color:#9eaca2;font-size:11px;line-height:1.5;margin-top:10px}.chat-bubble:has(.bot-source){border-left:3px solid #b8ef69}

/* Request journeys: readable progress, focused menus, accessible controls. */
.request-progress{display:flex;gap:8px;list-style:none;padding:0;margin:16px 0;flex-wrap:wrap}.request-progress li{flex:1;min-width:80px;border-top:4px solid #d6d9ce;padding:8px 0;font-size:13px;color:#63715d}.request-progress .complete{border-color:#57831a;color:#26440d;font-weight:700}.drink-choice button{width:100%}#myRequests,#shiftControls{scroll-margin-top:100px}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #547e1d;outline-offset:3px}#connectionStatus{font-size:13px}#queueSummary{min-height:26px}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}