:root{color-scheme:dark;--bg:#101114;--panel:#1c1d22;--stroke:#35363d;--text:#f4f4f5;--muted:#a9abb5;--red:#ff5275}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font:15px/1.45 system-ui,-apple-system,Segoe UI,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}a{color:inherit;text-decoration:none}.topbar{height:54px;position:sticky;top:0;z-index:20;background:#131419;display:flex;align-items:center;padding:0 14px;gap:14px}.brand{font-size:20px;font-weight:800;white-space:nowrap;letter-spacing:-.6px}.brand:first-letter{color:var(--red)}#search-form{display:flex;flex:1;max-width:470px;background:#26272d;height:35px;border-radius:7px;overflow:hidden}#search-form input{background:none;border:0;flex:1;width:0;color:white;padding:0 13px;outline:none}#search-form button{border:0;background:transparent;color:white;padding:0 13px;font-size:24px}nav{display:flex;gap:2px;margin-left:auto}nav button{background:transparent;color:#ddd;border:0;font-size:23px;width:39px;height:41px;border-radius:5px}nav button:hover,button:hover{filter:brightness(1.2)}.tagstrip{display:flex;gap:7px;overflow:auto;white-space:nowrap;padding:8px 10px;scrollbar-width:none;min-height:36px}.tagstrip:empty{display:none}.tagstrip button{flex-shrink:0;padding:4px 10px;background:#24252c;border:0;border-radius:30px;color:#ddd;font-size:12px}.masonry{columns:5;column-gap:0}.tile{position:relative;display:block;break-inside:avoid;overflow:hidden;background:#25262b;margin:0;padding:0;line-height:0}.tile>img{display:block;width:100%;height:auto}.tile .shade-bottom{position:absolute;inset:35% 0 0;pointer-events:none;background:linear-gradient(transparent,rgba(0,0,0,.85));opacity:0;transition:opacity .16s}.tile:hover .shade-bottom,.tile:focus-within .shade-bottom,.tile.show-controls .shade-bottom{opacity:1}.tile-controls{position:absolute;inset:auto 0 0;z-index:2;padding:30px 10px 9px;line-height:1.3;opacity:0;transition:opacity .16s;pointer-events:none}.tile:hover .tile-controls,.tile:focus-within .tile-controls,.tile.show-controls .tile-controls{opacity:1;pointer-events:auto}.tile-top{position:absolute;top:9px;right:9px;z-index:2;opacity:0;pointer-events:none}.tile:hover .tile-top,.tile:focus-within .tile-top,.tile.show-controls .tile-top{opacity:1;pointer-events:auto}.tile-actions{display:flex;align-items:center;gap:3px;margin-top:6px}.tile button,.play{color:white;border:0;background:rgba(0,0,0,.4);backdrop-filter:blur(6px);padding:5px 8px;border-radius:7px;font-weight:600}.tile button.active{color:var(--red)}.tile .tags{display:flex;gap:5px;flex-wrap:wrap}.tile .tags button{font-size:12px;padding:2px 4px;background:transparent;text-shadow:0 1px 5px black}.author{background:transparent!important;padding:3px 0!important;font-size:12px}.play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px;z-index:2;padding:4px 17px;background:rgba(0,0,0,.55)}.tile .play{opacity:1;pointer-events:auto}.feed-end{text-align:center;padding:18px;color:#bbb}.feed-end button,.primary{padding:10px 16px;border:0;background:#ef4166;color:white;border-radius:6px;font-weight:650}.modal[hidden]{display:none}.modal{position:fixed;inset:0;z-index:40;display:flex;justify-content:center;align-items:center;padding:12px}.shade{position:absolute;inset:0;background:rgba(0,0,0,.83)}.dialog{position:relative;width:min(100%,680px);max-height:94dvh;overflow:auto;background:#1b1c21;box-shadow:0 20px 90px #000a;border-radius:9px}.modal-head{height:55px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;position:sticky;top:0;background:#1b1c21;z-index:2}.modal-head h2{margin:0;font-size:19px}.close{border:0;background:none;color:white;font-size:29px}#modal-body{padding:16px}.stack{display:grid;gap:12px}.stack label{display:grid;gap:5px;color:#d3d3d6}.stack input,.stack textarea,.stack select,.message-input input{width:100%;background:#2a2b31;border:1px solid #42434a;color:#fff;padding:10px;border-radius:5px}.stack textarea{resize:vertical;min-height:75px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.muted{color:var(--muted)}.link-btn,.secondary{background:#33343b;color:white;border:0;border-radius:5px;padding:9px 12px}.profile-avatar{width:90px;height:90px;object-fit:cover;border-radius:100%}.avatar-fallback{width:90px;height:90px;background:#34343b;border-radius:50%;display:grid;place-items:center;font-size:42px}.profile-head{display:flex;gap:14px;align-items:center}.video{width:100%;aspect-ratio:16/9;border:0;background:#000}.video-label{font-size:12px;color:#aaa}.message-list{height:320px;overflow:auto;background:#131419;padding:12px;display:flex;flex-direction:column;gap:8px}.bubble{background:#32333a;max-width:85%;padding:8px 12px;border-radius:9px;align-self:flex-start;overflow-wrap:anywhere}.bubble.mine{align-self:flex-end;background:#553044}.message-input{display:flex;gap:7px;margin-top:9px}.message-input button{flex-shrink:0}.member-line{width:100%;text-align:left;padding:11px;background:#2b2c32;color:white;border:0;border-bottom:1px solid #444}.agenda-line{display:flex;justify-content:space-between;gap:6px;padding:9px 0;border-bottom:1px solid #35363c}.camera-view{width:100%;max-height:380px;object-fit:contain;background:#070707}#toast{position:fixed;z-index:100;bottom:25px;left:50%;transform:translateX(-50%);background:#34343c;padding:9px 15px;border-radius:7px;pointer-events:none;opacity:0;transition:opacity .2s}#toast.show{opacity:1}.empty{text-align:center;color:#a4a4b0;padding:70px 20px}.hidden{display:none!important}@media(max-width:1200px){.masonry{columns:4}}@media(max-width:800px){.masonry{columns:3}.brand span{display:none}.topbar{gap:7px;padding:0 7px}nav button{width:32px;font-size:19px}}@media(max-width:550px){.masonry{columns:2}.topbar{height:95px;flex-wrap:wrap;align-content:center}.brand{font-size:18px}#search-form{max-width:unset;flex:1}nav{order:3;width:100%;justify-content:space-between}.modal{padding:0}.dialog{border-radius:0;width:100%;height:100dvh;max-height:none}.tile-controls,.tile-top,.tile .shade-bottom{opacity:1;pointer-events:auto}.tile-actions{gap:0}.tile button{padding:4px 5px}.tile .tags button{font-size:11px}}

/* TikTok: portrait player, with no feed gutters */
.tiktok-video{display:block;width:100%;max-width:420px;height:min(74dvh,740px);min-height:360px;aspect-ratio:9/16;margin:0 auto;border:0;background:#000}
.tile .play{z-index:6;min-width:64px;min-height:64px;pointer-events:auto;touch-action:manipulation}
.tile-controls{pointer-events:none}
.tile-controls button{pointer-events:auto}
@media(max-width:550px){.tiktok-video{max-width:100%;height:min(76dvh,740px)}}


/* Familiar navigation icons and readable labels. */
.main-nav { align-items: center; gap: 2px; }
.main-nav button {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; width: auto; min-width: 56px; height: 49px; padding: 4px 6px;
  font-size: 12px; line-height: 1.1; color: #eee;
}
.main-nav .nav-icon { display: block; flex: none; }
.main-nav .nav-label { font-size: 10px; font-weight: 500; white-space: nowrap; }
.topbar { min-height: 60px; height: auto; }
@media (max-width: 1100px) {
  .main-nav { flex-wrap: nowrap; }
  .main-nav button { min-width: 42px; padding: 4px 3px; }
  .main-nav .nav-label { font-size: 9px; }
}
@media (max-width: 800px) {
  .topbar { padding: 6px 8px; flex-wrap: wrap; }
  .main-nav { order: 3; width: 100%; margin: 0; justify-content: space-between; }
  .main-nav button { width: 12.5%; min-width: 0; height: 48px; }
  .main-nav .nav-label { font-size: 9px; }
  .brand span { display: none; }
}
@media (max-width: 550px) {
  .topbar { height: auto; min-height: 98px; align-content: center; }
  .main-nav { order: 3; width: 100%; }
  .main-nav button { width: 12.5%; min-width: 0; height: 49px; padding: 3px 0; }
  .main-nav .nav-icon { width: 20px; height: 20px; }
  .main-nav .nav-label { font-size: 8.5px; letter-spacing: -.2px; }
}

/* Profile job title and clickable italic hobby hashtags */
.profile-job { font-size: 14px; font-weight: 600; color: var(--muted); margin-top: 3px; }
.profile-hobbies { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-bottom: 6px; }
.profile-hobbies button { padding: 2px 0; background: none; border: 0; color: #d5d5e3; font-size: 13px; font-style: italic; cursor: pointer; }
.profile-hobbies button:hover, .profile-hobbies button:focus-visible { color: #fff; text-decoration: underline; }