:root{font-family:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;color:#f6f4ff;background:#0b0a12;font-synthesis:none}*{box-sizing:border-box}body{margin:0}.shell{max-width:640px;margin:auto;min-height:100dvh;background:radial-gradient(circle at 0 0,#251735 0,transparent 34%),#11101a;padding-bottom:calc(87px + env(safe-area-inset-bottom))}.top{height:76px;padding:18px 19px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12}.brand{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:800;letter-spacing:-.8px}.mark{background:linear-gradient(140deg,#a96dff,#5838ad);border:1px solid #bb8dff;box-shadow:0 0 20px #8c5de655;width:36px;height:36px;border-radius:12px;text-align:center;line-height:32px;font-style:italic}.brand small{font-size:8px;letter-spacing:2px;display:block;color:#958aa9;margin-top:-2px}.accent{color:#ad83ff}.header-right{display:flex;align-items:center;gap:9px}.pill{color:#dfc7ff;background:#412b5e;font-size:9px;font-weight:800;letter-spacing:.7px;border:1px solid #8863ae;border-radius:30px;padding:7px 9px}.avatar{width:35px;height:35px;display:grid;place-items:center;background:#403050;border:1px solid #8a70b2;border-radius:50%;font-weight:800}main{padding:22px 17px 30px}.eyebrow{font-size:10px;color:#a580f2;letter-spacing:2.5px;font-weight:800;text-transform:uppercase}.h1{margin:5px 0 5px;font-size:29px;letter-spacing:-1px}.sub{font-size:13px;color:#a7a1b7;line-height:1.6;margin:0 0 20px}.card{background:linear-gradient(155deg,#24202f,#191823);border:1px solid #ffffff13;border-radius:18px;padding:17px;margin-bottom:13px;box-shadow:0 11px 30px #00000020}.card h2,.card h3{margin:0}.card h2{font-size:19px}.card h3{font-size:15px}.muted{color:#a7a1b7}.tiny{font-size:11px}.row{display:flex;justify-content:space-between;align-items:center;gap:12px}.teamhero{background:linear-gradient(125deg,#302046,#171520);border-color:#7952a75a}.biglogo{width:54px;height:54px;border-radius:15px;background:#14111f;border:1px solid #8058b5;display:grid;place-items:center;font-weight:900;color:#b38bff;letter-spacing:-2px}.divider{border-top:1px solid #ffffff14;margin:15px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.stat{text-align:center;background:#14131d;border:1px solid #ffffff0c;border-radius:12px;padding:13px 7px}.stat strong{display:block;font-size:23px}.stat span{font-size:10px;color:#aca5be}.section{display:flex;justify-content:space-between;align-items:center;margin:23px 0 11px}.section h2{font-size:17px;margin:0}.tag{font-size:10px;white-space:nowrap;background:#30263e;color:#c7aaff;padding:6px 8px;border-radius:7px}.driver{display:flex;gap:11px;align-items:center;padding:11px 0;border-bottom:1px solid #ffffff10}.driver:last-child{border:0}.circle{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#3c2a55;color:#ebdbff;font-weight:700}.grow{flex:1;min-width:0}.grow strong{display:block;font-size:13px}.grow small{font-size:11px;color:#aaa3b7}.button{background:#9862ec;color:#fff;border:0;border-radius:11px;padding:10px 13px;font-weight:700;cursor:pointer}.button.secondary{background:#30273f;border:1px solid #6b4b93}.button:disabled{opacity:.5;cursor:not-allowed}.button:focus-visible,nav button:focus-visible{outline:2px solid #d8bdff;outline-offset:2px}.feedhead{display:flex;align-items:center;gap:10px;margin-bottom:12px}.feedhead strong{display:block;font-size:13px}.feedhead small{color:#9e97b0;font-size:10px}.post{line-height:1.55;font-size:13px;color:#e4ddec}.postactions{display:flex;gap:20px;margin-top:12px;color:#b5a9c8;font-size:12px}.event-date{border:1px solid #865dba66;border-radius:12px;min-width:56px;text-align:center;padding:9px;background:#261b39}.event-date strong{font-size:23px;display:block}.event-date span{font-size:10px;color:#bb9df0}.eventline{display:flex;gap:13px;align-items:center}.eventline .grow strong{font-size:15px}.eventline .grow small{display:block;margin-top:5px;line-height:1.4}.notice{background:#181520;border:1px dashed #795a9866;border-radius:13px;padding:14px;color:#b8afc7;font-size:12px;line-height:1.6}.bottom{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,640px);height:calc(72px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(3,1fr);background:#16131feF;border-top:1px solid #5239676b;backdrop-filter:blur(16px);z-index:4}.bottom button{background:transparent;color:#9690a4;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;cursor:pointer}.bottom button.selected{color:#bd8dff;font-weight:800}.navicon{font-size:25px;line-height:28px}@media(min-width:700px){.shell{border-left:1px solid #ffffff12;border-right:1px solid #ffffff12}}

.clickable{font:inherit;color:inherit;border:0;background:transparent;text-align:left;width:100%;cursor:pointer}.clickable:focus-visible,.event-button:focus-visible{outline:2px solid #ba91ff}.driver{width:100%}.chevron{font-size:24px;color:#af7ceb}.feedhead{padding:0}.big-number{font-size:30px}.integration,.detail-row{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid #ffffff13;font-size:13px}.integration:last-child,.detail-row:last-child{border:0}.detail-row span{color:#aaa1b9}.detail-row strong{text-align:right;max-width:60%;overflow-wrap:anywhere}.status{margin-bottom:14px}.field{width:100%;padding:13px;margin:7px 0 12px;border:1px solid #75569f;background:#201a2c;color:white;border-radius:10px}.event-button{color:inherit;font:inherit;cursor:pointer;display:block;width:100%;text-align:left}.external{color:#be91ff;font-weight:700}.modal-backdrop{position:fixed;inset:0;z-index:10;background:#05030bca;display:flex;align-items:flex-end;justify-content:center}.modal{background:#211b2b;border:1px solid #8061a5;border-radius:22px 22px 0 0;padding:22px;max-height:85dvh;overflow:auto;width:min(100%,640px);padding-bottom:calc(24px + env(safe-area-inset-bottom))}.modal h2{margin:0;font-size:21px}.modal-open{overflow:hidden}a:focus-visible{outline:2px solid #d8bdff}

/* Official iTeamHQ artwork */
.brand{position:relative;gap:0;flex-shrink:0;min-width:0}.brand-art{display:block;width:145px;height:52px;object-fit:contain;object-position:center}.mobile-label{position:absolute;left:36px;bottom:-2px;color:#a59aac;letter-spacing:2px;font-size:8px;font-weight:800}.top{gap:6px}.header-right{flex-shrink:0}@media(max-width:390px){.brand-art{width:119px;height:46px}.mobile-label{left:28px}.pill{font-size:8px;padding:6px}}

/* Transparent logo artwork fitted tightly inside header */
.brand-art{object-fit:contain}
/* v0.8: responsive shared driver / Community profile sheets */
.avatar-frame{overflow:hidden}.avatar-frame img{width:100%;height:100%;object-fit:cover;display:block}.driver small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:330px}.directory .driver{min-height:60px}.directory .driver strong{font-size:13px}.expand{width:100%;margin:0 0 6px}.online-sample{max-height:176px;overflow-y:auto;overscroll-behavior:contain;border-top:1px solid #ffffff18;margin-top:11px;padding:3px 0;scrollbar-color:#604585 transparent}.online-sample .driver{min-height:47px;padding:5px 1px}.online-sample .circle{width:32px;height:32px;font-size:11px}.modal-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:18px}.modal-top button{font-size:17px;padding:5px 12px}.profile-hero{display:flex;align-items:center;gap:14px;margin-bottom:18px}.profile-hero h2{font-size:21px;line-height:1.2;margin:3px 0 6px}.profile-hero p{margin:0}.profile-avatar{display:grid;place-items:center;width:70px;height:70px;flex:0 0 70px;border-radius:18px;border:1px solid #8861ae;background:#3c2a55;color:#fff;font-size:19px;font-weight:800}.profile-banner{height:110px;background-size:cover;background-position:center;border-radius:14px;margin-bottom:14px}.profile-fields{border-top:1px solid #ffffff19;margin:8px 0}.activity{background:#1a1625;border:1px solid #ffffff12;border-radius:14px;padding:12px;margin-top:12px}.activity h3{font-size:13px;margin:0 0 7px;color:#b999ed}.activity p{font-size:12px;line-height:1.6;margin:0 0 7px;overflow-wrap:anywhere}.activity p:last-child{margin-bottom:0}.postactions{display:flex;gap:12px;margin-top:10px;color:#aa9cbb;font-size:11px}.modal .tiny{line-height:1.6}.modal{outline:0}.modal-backdrop{padding-top:env(safe-area-inset-top)}

/* v0.9: shared and official special event feed */
.event-button{transition:background .15s,border-color .15s}.event-button:active{background:#322641;border-color:#8b65bf}.eventline .grow strong{line-height:1.3}.eventline .grow small{white-space:normal}.external{display:inline-block;margin-top:8px}.section .tag{max-width:120px;overflow:hidden;text-overflow:ellipsis}.modal .profile-fields{margin-top:18px}


/* v0.10 — Navigation belongs to page flow, never fixed over mobile content. */
.shell{display:flex;flex-direction:column;padding-bottom:0;min-height:100vh;min-height:100dvh}
.shell > main{flex:1 0 auto;min-width:0}
.bottom{
  position:static;left:auto;bottom:auto;transform:none;
  flex:0 0 auto;width:100%;height:calc(76px + env(safe-area-inset-bottom));
  margin-top:auto;padding-bottom:env(safe-area-inset-bottom);
  background:#171321;border-top:1px solid #67468470;
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
.bottom button{position:relative;min-height:65px;-webkit-tap-highlight-color:transparent;
  transition:color .20s ease,background-color .20s ease}
.bottom button::before{content:'';position:absolute;top:0;left:32%;right:32%;height:2px;
  background:#bc8aff;border-radius:0 0 6px 6px;opacity:0;transform:scaleX(.25);
  transition:opacity .22s ease,transform .24s cubic-bezier(.2,.85,.3,1)}
.bottom button.selected::before{opacity:1;transform:scaleX(1)}
.bottom button .navicon{transition:transform .22s cubic-bezier(.18,.85,.3,1.2),filter .22s ease}
.bottom button.selected .navicon{transform:translateY(-2px) scale(1.11);filter:drop-shadow(0 0 7px #9b58e66b)}
.bottom button:active{background:#3725488c}
.bottom button:active .navicon{transform:scale(.88)}

/* Deliberate, restrained UI motion on both iPhone and Android. */
#app.tab-animate{animation:tabReveal .26s cubic-bezier(.2,.7,.25,1) both}
@keyframes tabReveal{from{opacity:.32;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
#app.tab-animate > .card,#app.tab-animate > .section + .card{
  animation:cardReveal .32s cubic-bezier(.18,.8,.25,1) both;
}
@keyframes cardReveal{from{opacity:.65;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.button,.clickable,.event-button,.card.event-button,.field{
  -webkit-tap-highlight-color:transparent;
  transition:background-color .18s ease,border-color .18s ease,
    box-shadow .2s ease,transform .2s cubic-bezier(.2,.8,.25,1);
}
.button:active,.clickable:active,.event-button:active{transform:scale(.985)}
.driver.clickable{border-radius:10px;padding-left:6px;padding-right:6px}
.driver.clickable:active,.feedhead.clickable:active{background:#67418a26}
.clickable .chevron,.event-button .chevron{transition:transform .2s ease,color .2s ease}
.clickable:active .chevron,.event-button:active .chevron{transform:translateX(4px);color:#d6b8ff}
.field:focus-visible,.button:focus-visible,.clickable:focus-visible,.event-button:focus-visible,
.bottom button:focus-visible{outline:2px solid #d8bdff;outline-offset:2px}
.modal-backdrop{animation:modalFade .20s ease-out both}
.modal{animation:modalRise .30s cubic-bezier(.2,.8,.25,1) both;overscroll-behavior:contain}
.modal-backdrop.modal-stable,.modal-backdrop.modal-stable .modal{animation:none}
.modal-backdrop.is-closing{animation:modalFadeOut .16s ease-in both;pointer-events:none}
.modal-backdrop.is-closing .modal{animation:modalSink .16s ease-in both}
@keyframes modalFade{from{opacity:0}to{opacity:1}}
@keyframes modalRise{from{opacity:.82;transform:translateY(34px)}to{opacity:1;transform:translateY(0)}}
@keyframes modalFadeOut{to{opacity:0}}
@keyframes modalSink{to{opacity:.85;transform:translateY(22px)}}
@media (hover:hover){
  .button:hover{box-shadow:0 4px 15px #9e63e448}
  .driver.clickable:hover{background:#67418a20}
  .event-button:hover{border-color:#8b65bf;transform:translateY(-2px);box-shadow:0 14px 32px #00000038}
  .bottom button:hover:not(.selected){color:#cbb5e9;background:#34274440}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
   transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* v0.12: shared team RSVP / assignment controls */
.signup-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.signup-actions .button{flex:1 1 130px;min-width:0}
.signup-row,.assignment-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #ffffff16}
.signup-row:last-child,.assignment-row:last-child{border-bottom:0}
.signup-row .tag.yes{color:#8de6b3;border-color:#3c9c70}
.signup-row .tag.no{color:#e6b5b5;border-color:#a16a6a}
.assignment-label{flex:1 1 auto;min-width:95px;overflow:hidden}
.assignment-label strong,.assignment-label small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.assignment-label small{font-size:11px;color:#aba0b7;margin-top:4px}
.button.small{padding:9px 10px;font-size:11px;flex:0 0 auto}
.signup-actions button:disabled,.assignment-row button:disabled{opacity:.45;cursor:wait}
@media(max-width:370px){.assignment-row{flex-wrap:wrap}.assignment-label{flex-basis:100%}}

/* v0.13 — event responses console (mobile-only) */
.next-event-cta{display:flex;width:100%;align-items:center;gap:14px;text-align:left;color:inherit;font:inherit;cursor:pointer;border-color:#8050bc80;background:linear-gradient(135deg,#302042,#181522)}
.next-event-cta .grow strong{display:block;font-size:16px;margin:7px 0 4px}
.next-event-cta .grow small{display:block;font-size:12px;color:#bcb4ca}
.next-event-link{display:block;margin-top:10px;font-size:12px;font-weight:700;color:#c29aff}
.event-operations{background:linear-gradient(155deg,#271c39,#191522)}
.response-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:14px 0}
.response-summary>div{text-align:center;background:#14111d;border:1px solid #ffffff12;padding:11px 4px;border-radius:10px}
.response-summary strong{display:block;font-size:22px;line-height:1.25}
.response-summary span{display:block;font-size:9px;color:#aca4ba;margin-top:5px;overflow-wrap:break-word}
.response-summary>div:nth-child(1) strong{color:#8ee0b4}
.response-summary>div:nth-child(2) strong{color:#e6aaaa}
.response-summary>div:nth-child(3) strong{color:#e5c69b}
.response-progress{height:6px;overflow:hidden;border-radius:99px;background:#403249;margin:12px 0 9px}
.response-progress>span{display:block;height:100%;background:linear-gradient(90deg,#9760df,#b98ef6);border-radius:99px;transition:width .26s ease}
.roster-search{font-size:16px;margin:7px 0 12px}
.roster-filters{display:flex;gap:6px;overflow-x:auto;margin:0 0 10px;padding-bottom:6px;scrollbar-width:thin}
.roster-filter{white-space:nowrap;background:#2a2235;border:1px solid #745a84;color:#d2c2ea;padding:8px 10px;border-radius:99px;font-size:11px;cursor:pointer}
.roster-filter.selected{background:#533778;border-color:#b17bea;color:#fff;font-weight:700}
.response-roster-row[hidden],.roster-empty[hidden]{display:none!important}
.roster-status.yes{color:#8de6b3}.roster-status.no{color:#e6b5b5}.roster-status.waiting{color:#e5c69b}
.roster-actions{display:flex;gap:5px;flex-shrink:0}
.roster-actions .button{min-width:42px}
.choice-active{box-shadow:0 0 0 1px #c4a2ec inset!important;opacity:.72}
@media(max-width:370px){.response-summary span{font-size:8px}.roster-actions{width:100%}.roster-actions .button{flex:1}}

/* v0.14: product-first, minimal screen headings */
main{padding-top:19px}.h1{margin-bottom:17px}.h1:has(+ .sub){margin-bottom:5px}.section{margin-top:18px}.teamhero .row h2{line-height:1.3}.section:has(+.card){margin-bottom:9px}


/* v0.15 — Community publishing and interactions */
.community-toolbar{display:flex;gap:8px;align-items:center;margin:3px 0 15px}
.community-toolbar .button{flex:1;min-height:42px}
.activity-button{position:relative}.activity-badge{display:inline-grid;min-width:19px;height:19px;place-items:center;border-radius:99px;background:#b98bfd;color:#201326;font-size:10px;margin-left:4px}
.text-action{border:0;background:transparent;color:#c89eff;cursor:pointer;font:inherit;font-size:12px;padding:7px;text-decoration:none}
.feed-card{overflow:hidden}.feed-card .feedhead{width:100%}.post-title{font-size:15px;margin:0 0 8px}
.post-body{white-space:pre-wrap;overflow-wrap:anywhere}.feed-image{display:block;width:100%;max-height:360px;object-fit:cover;border-radius:12px;margin-top:12px}
.feed-buttons{display:flex;gap:6px;margin-top:14px;padding-top:10px;border-top:1px solid #ffffff1b;align-items:center;justify-content:space-between}
.feed-action{flex:1;border:1px solid transparent;border-radius:9px;background:transparent;color:#b9aecb;font-size:12px;padding:9px 4px;cursor:pointer;min-width:0;white-space:nowrap}
.feed-action.active{color:#d0a0ff;background:#6d4aa329}.feed-action:active{background:#65478b60;transform:scale(.97)}.feed-action:disabled{opacity:.48}
.community-form label{display:block;font-size:12px;color:#dbc8f3;font-weight:650;margin-top:6px}.post-textarea,.community-form textarea{resize:vertical;min-height:110px;line-height:1.6}
.form-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px}.inline-error{font-size:11px;color:#ffbaba;flex:1;overflow-wrap:anywhere}
.comment-post{padding:12px;background:#181420;border-radius:12px;border:1px solid #ffffff18;overflow-wrap:anywhere}.comment-post p{font-size:13px;white-space:pre-wrap;line-height:1.55}
.comments-list{max-height:36vh;overflow-y:auto;overscroll-behavior:contain}.comment-entry{display:flex;gap:9px;padding:12px 0;border-bottom:1px solid #ffffff14;align-items:flex-start}.comment-entry .circle{width:31px;height:31px;flex:0 0 31px;font-size:10px}
.comment-entry .row{align-items:baseline}.comment-entry .row strong{font-size:12px}.comment-entry p{font-size:12px;line-height:1.5;margin:5px 0;white-space:pre-wrap;overflow-wrap:anywhere}
.comment-tools{display:flex;gap:9px}.comment-tools .text-action{padding:3px 0}.activity-line{padding:12px 0;border-bottom:1px solid #ffffff17;font-size:13px}
#mobile-toast{position:fixed;top:calc(18px + env(safe-area-inset-top));left:50%;transform:translate(-50%,-16px);width:max-content;max-width:min(90vw,500px);padding:12px 18px;border-radius:12px;background:#473168;color:#fff;border:1px solid #a783cd;box-shadow:0 10px 40px #0008;z-index:15;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
#mobile-toast.visible{opacity:1;transform:translate(-50%,0)}#mobile-toast.error{background:#623448;border-color:#b36b81}
@media (prefers-reduced-motion:reduce){#mobile-toast{transition:none}}

/* v0.16: Community direct and team inbox */
.community-switch{display:flex;gap:8px;margin:18px 0 14px}.switch-button{flex:1;min-width:0;border:1px solid #5f437e;background:#241b33;border-radius:12px;padding:12px 8px;color:#cfb7e4;font-size:13px;font-weight:700;cursor:pointer;transition:background .16s,transform .16s}.switch-button.active{background:#513574;color:#fff;border-color:#9f72c9}.switch-button:active{transform:scale(.97)}.inbox-switch{margin:2px 0 12px}.unread-badge{display:inline-block;min-width:19px;border-radius:20px;padding:2px 5px;margin-left:4px;background:#b47bf1;color:#170b25;font-size:11px}.inbox-list{padding:4px 14px}.inbox-row{display:flex;width:100%;gap:12px;align-items:center;text-align:left;color:inherit;background:transparent;border:0;border-bottom:1px solid #ffffff17;padding:16px 3px;cursor:pointer}.inbox-row:last-child{border-bottom:0}.inbox-row strong{font-size:14px}.inbox-row small{display:block;color:#a59db5;margin-top:7px;font-size:11px}.message-snippet{display:block;color:#c6b9d2;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:64vw;font-size:12px}.inbox-row.unread .message-snippet{color:#fff}.unread-dot{display:inline-block;background:#c49aff;border-radius:50%;height:7px;width:7px;margin-left:7px;vertical-align:middle}.recipient-list{max-height:65vh;overflow-y:auto}.message-to{font-size:13px;color:#cbb7dd;margin:5px 0 12px}.profile-message{margin:14px 0;width:100%}
@media (prefers-reduced-motion:reduce){.switch-button{transition:none}}

/* v0.17 Notification centre: quiet, mobile-first */
.notification-bell{position:relative;min-width:36px;min-height:36px;border-radius:50%;border:1px solid #6e518f;background:#251938;color:#e0b8ff;font-size:24px;cursor:pointer;display:grid;place-items:center;line-height:1}
.notification-bell[hidden]{display:none}.bell-count{position:absolute;right:-5px;top:-5px;background:#a97bee;color:#160921;min-width:17px;padding:2px 4px;border-radius:12px;font-size:10px;font-weight:800;border:2px solid #150f21}
.notification-list{max-height:66vh;overflow:auto}.notification-row{text-align:left;display:flex;flex-direction:column;gap:6px;width:100%;background:transparent;color:#f8f3ff;border:0;border-bottom:1px solid #ffffff17;padding:14px 4px;cursor:pointer}
.notification-row:last-child{border:0}.notification-row strong{font-size:14px}.notification-row small{color:#bbb0ce;font-size:12px;line-height:1.45}.notification-row .notification-date{font-size:11px;color:#9986b4}.notification-row.is-unread{border-left:3px solid #a67aef;padding-left:11px;background:linear-gradient(90deg,#a478ee18,transparent)}
@media (prefers-reduced-motion:reduce){.notification-row{transition:none}}

/* v0.17.2 — Top-level navigation sits directly below the brand, in document flow.
   It scrolls away with content on iPhone/Android and never overlays a post. */
.top-nav{
  position:static;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  width:100%;min-height:62px;flex:0 0 auto;
  background:#171321;border-bottom:1px solid #67468470;
  padding:0 8px;gap:4px;z-index:auto;
}
.top-nav button{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  color:#a7a0b4;background:transparent;border:0;border-radius:10px 10px 0 0;
  min-width:0;min-height:60px;font-size:11px;font-weight:650;cursor:pointer;
  position:relative;transition:color .2s ease,background-color .2s ease;
  -webkit-tap-highlight-color:transparent;
}
.top-nav button.selected{color:#c997ff;background:#74469b20}
.top-nav button.selected::after{
 content:'';position:absolute;bottom:0;left:26%;right:26%;height:3px;
 background:#b885f6;border-radius:3px 3px 0 0;
}
.top-nav button .navicon{font-size:21px;line-height:23px}
.top-nav button:active{background:#5f3c834a;transform:scale(.97)}
.top-nav button:focus-visible{outline:2px solid #d8bdff;outline-offset:-2px}
/* Empty slot is invisible; a Community image is attached only when it loads. */
.feed-image-anchor{display:none!important}
.feed-image{display:block;width:100%;max-height:360px;object-fit:cover;border-radius:12px;margin-top:12px}
.biglogo.avatar-frame{overflow:hidden;flex:0 0 54px;letter-spacing:0}
.biglogo.avatar-frame img{display:block;width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion:reduce){.top-nav button{transition:none}}

/* v0.19 — user profile, meaningful quick access, and live team presence */
.header-right .pill[hidden]{display:none!important}
.account-avatar{flex:0 0 39px;width:39px;height:39px;padding:0;overflow:hidden;border-radius:50%;border:1.5px solid #ac7ee9;background:#2d203a;display:grid;place-items:center;cursor:pointer;color:#efddff;transition:box-shadow .2s ease,transform .2s ease}
.account-avatar:active{transform:scale(.94)}.account-avatar:focus-visible{outline:2px solid #e2c8ff;outline-offset:3px}
.account-avatar-icon{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:800}
.account-avatar-icon.avatar-frame img{width:100%;height:100%;object-fit:cover}
.quick-panel{margin:8px 0 20px}.quick-panel .section{margin-top:18px}
.quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.quick-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:81px;padding:11px 4px;border:1px solid #7953aa75;border-radius:13px;background:linear-gradient(160deg,#241b33,#181522);color:#e9dcff;font-weight:700;font-size:12px;cursor:pointer}
.quick-tile span{font-size:20px;color:#bd94ff}.quick-tile small{font-size:10px;color:#ba8bff}.quick-tile:active{transform:scale(.97)}
.account-menu-extra{display:flex;flex-wrap:wrap;gap:9px;justify-content:space-between;margin-top:20px;padding-top:15px;border-top:1px solid #ffffff19}
#my-profile-form .field[type=file]{font-size:12px;padding:10px}#my-profile-form .inline-error{display:block;min-height:18px;color:#f5aaaa;font-size:12px}
#my-profile-form>.button{width:100%}
.driver .is-online{outline:2px solid #57c995}

.quick-community-post{padding:13px 16px;margin-bottom:8px}.quick-community-post strong{font-size:12px}.quick-community-post small{float:right;color:#a699b4;font-size:10px}.quick-community-post p{margin:8px 0 0;color:#d9d0df;font-size:12px;line-height:1.5;overflow-wrap:anywhere}

/* v0.20 - purpose-built Discover + Leagues; no endless profile lists on Feed */
.community-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.community-four .switch-button{min-width:0;padding:11px 2px;font-size:11px;white-space:nowrap}
.community-four .unread-badge{font-size:9px;min-width:14px;margin-left:1px;padding:1px 3px}
.league-card{display:flex;align-items:center;width:100%;gap:12px;text-align:left;color:inherit;cursor:pointer;padding:13px 14px}
.league-card .league-avatar{width:46px;height:46px;flex:0 0 46px;display:grid;place-items:center;background:#37254f;border:1px solid #8858bf;border-radius:13px;font-weight:750;color:#e8c5ff;overflow:hidden}
.league-card .league-avatar img{width:100%;height:100%;object-fit:cover}
.league-card strong{font-size:14px}.league-card small{display:block;color:#aea4bf;line-height:1.5;margin-top:5px}
.league-status{display:inline-block;color:#d8b3ff;font-size:11px;margin-top:7px}
.league-compact{padding:12px}.league-compact .league-avatar{width:40px;height:40px;flex-basis:40px}
.league-empty p{margin:0 0 13px;font-size:13px;color:#b9accc}
.community-discover-prompt{display:flex;align-items:center;gap:13px;justify-content:space-between;margin:20px 0 8px;border:1px solid #7051955c;border-radius:14px;background:linear-gradient(120deg,#332042,#1b1726);padding:16px}
.community-discover-prompt strong{font-size:14px}.community-discover-prompt p{font-size:11px;color:#afa4bd;margin:5px 0 0;line-height:1.5}
.community-discover-prompt .button{flex:0 0 auto}
.league-toolbar .button{flex:1}.directory-search{margin:4px 0 14px}.discover-switch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:12px 0 14px}
.league-description{white-space:pre-wrap;font-size:13px;line-height:1.6;color:#d9d0e7;overflow-wrap:anywhere}.league-detail-name{margin:4px 0 10px}.league-hero-image{width:92px;height:92px;object-fit:cover;border-radius:14px;margin-bottom:16px}
.league-detail-actions{display:flex;gap:9px;margin:14px 0}.league-detail-actions .button{flex:1}.league-links{margin:12px 0;display:flex;gap:18px;flex-wrap:wrap;font-size:13px}
.league-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:10px}.league-grid .field{min-width:0}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:365px){.community-four .switch-button{font-size:10px}.community-discover-prompt{flex-wrap:wrap}.league-grid{grid-template-columns:1fr}}

/* v0.21 — release notification; appears only when a newer version is deployed */
.update-toast{position:fixed;z-index:250;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));max-width:550px;margin:auto;padding:14px 16px;display:flex;align-items:center;gap:12px;background:linear-gradient(140deg,#292037,#171321);border:1px solid #a56bdf;border-radius:16px;box-shadow:0 15px 40px #000a;color:#f8f0ff;font:inherit;animation:update-appear .23s ease-out;}
.update-toast-info{flex:1;min-width:0}.update-toast-info strong{display:block;font-size:14px}.update-toast-info span{display:block;font-size:12px;line-height:1.45;color:#cab9db;margin-top:4px}
.update-toast-actions{display:flex;gap:8px;align-items:center}.update-toast button{border-radius:10px;padding:9px 12px;font:inherit;font-weight:700;font-size:12px;cursor:pointer;border:1px solid #8660a8;color:#f8ecff;background:#33213f}.update-toast button.update-now{background:#a665e9;color:#170d22;border-color:#a665e9}.update-toast button:focus-visible{outline:2px solid #fff;outline-offset:2px}.update-toast button:disabled{opacity:.6;cursor:wait}
@keyframes update-appear{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:390px){.update-toast{flex-wrap:wrap}.update-toast-actions{width:100%;justify-content:flex-end}}
@media(prefers-reduced-motion:reduce){.update-toast{animation:none}}

/* iTeamHQ Mobile v0.21.1: iOS safe-area header fix */
/* With viewport-fit=cover, the iOS status bar can overlay a standalone PWA. */
.top {
  height: calc(76px + env(safe-area-inset-top, 0px));
  padding-top: calc(18px + env(safe-area-inset-top, 0px));
  padding-left: max(17px, env(safe-area-inset-left, 0px));
  padding-right: max(17px, env(safe-area-inset-right, 0px));
}
/* Some iOS Home Screen versions report a zero top inset; keep controls below status bar. */
@supports (-webkit-touch-callout: none) {
  @media (display-mode: standalone) and (max-width: 700px) {
    .top {
      --iteamhq-top-safe: max(54px, env(safe-area-inset-top, 0px));
      height: calc(76px + var(--iteamhq-top-safe));
      padding-top: calc(18px + var(--iteamhq-top-safe));
    }
  }
}
.header-right { position: relative; z-index: 1; align-items: center; }
.notification-bell, .account-avatar {
  min-width: 44px;
  min-height: 44px;
  width: 44px;
  height: 44px;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.account-avatar { flex: 0 0 44px; }
.notification-bell:focus-visible, .account-avatar:focus-visible {
  outline: 2px solid #e2c8ff;
  outline-offset: 3px;
}

/* iTeamHQ Mobile threaded conversations: mobile-first compact chat UI */
.chat-panel{display:flex;flex-direction:column;min-height:400px;height:min(70dvh,740px);border:1px solid #6b5186;background:linear-gradient(145deg,#20192f,#15121f);border-radius:16px;overflow:hidden;margin:6px 0 24px}
.chat-header{display:flex;align-items:center;gap:12px;background:#342543;padding:11px 12px;border-bottom:1px solid #ffffff21}.chat-header strong{font-size:14px;display:block}.chat-header small{display:block;color:#c5b2d5;font-size:11px;margin-top:3px}.chat-header .button{padding:9px 12px}.chat-back{border:0;color:#fff;background:transparent;font-size:31px;cursor:pointer;min-width:36px;line-height:1.1}.chat-history{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:18px 12px;display:flex;flex-direction:column;gap:12px}.chat-line{display:flex}.chat-line.mine{justify-content:flex-end}.chat-line.theirs{justify-content:flex-start}.chat-bubble{max-width:85%;border-radius:16px 16px 16px 4px;background:#362846;border:1px solid #6d5385;padding:10px 13px;overflow-wrap:anywhere}.chat-line.mine .chat-bubble{border-radius:16px 16px 4px 16px;background:#664084;border-color:#9566b7}.chat-bubble p{margin:0;color:#fff;font-size:14px;white-space:pre-wrap;line-height:1.4}.chat-time{display:block;color:#e3d4ee;font-size:10px;margin-top:7px;opacity:.82;text-align:right}.chat-compose{background:#231a31;border-top:1px solid #ffffff24;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;padding:11px;align-items:end}.chat-compose textarea{max-height:140px;min-height:50px;resize:vertical;margin:0}.chat-compose .button{height:50px;padding:10px 17px}.chat-compose .inline-error{grid-column:1/-1}.chat-empty{text-align:center;color:#b1a3c1;margin:auto}.chat-unread-count{background:#aa7deb;color:#140b20;border-radius:30px;padding:4px 8px;font-size:12px;font-weight:800}.inbox-row>.circle,.inbox-row>.avatar-frame{flex-shrink:0}.inbox-row .grow{min-width:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* iTeamHQ Mobile v0.21.4 — long-press post actions and league artwork */
.feed-card.feed-owned{position:relative;touch-action:pan-y;}
.feed-card.feed-owned .feedhead{padding-right:58px;}
.feed-owned .post-more{position:absolute;right:13px;top:14px;width:43px;height:42px;display:grid;place-items:center;border:1px solid rgba(179,123,255,.40);border-radius:13px;background:rgba(129,78,183,.16);color:#d5b1ff;font-size:27px;line-height:1;z-index:2;cursor:pointer;}
.feed-owned .post-more:focus-visible{outline:2px solid #bf91ff;outline-offset:2px;}
.post-action-menu{display:grid;grid-template-columns:1fr;gap:12px;margin-top:22px;}
.post-action-menu .button{width:100%;min-height:55px;text-align:center;}
.post-action-menu .post-delete-action{background:rgba(192,43,74,.15);color:#ffb5bf;border:1px solid rgba(250,92,118,.48);}
.league-poster-image{display:block;width:100%;max-height:390px;aspect-ratio:16/9;object-fit:contain;border-radius:18px;background:#151020;margin-bottom:22px;border:1px solid rgba(169,117,228,.24);}
.league-calendar-section{margin:24px 0 18px;}
.league-calendar-section h3{font-size:1.1rem;margin:0 0 14px;}
.league-calendar-image{display:block;width:100%;max-height:580px;object-fit:contain;background:#150f21;border-radius:16px;border:1px solid rgba(169,117,228,.25);}
.league-detail-actions a.button.league-enter-button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;text-decoration:none;flex:1;}
@media (hover:hover){.feed-owned .post-more:hover{background:rgba(155,96,211,.34)}}