@media(min-width:1500px){.feed-scroll{max-width:700px}.feed-screen:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,#34314a33,transparent 70%);pointer-events:none}}
@media(max-width:900px){.app-header{gap:18px;padding:0 24px}.header-link{padding:9px 10px;font-size:13px}.header-nav{gap:0}.panel-screen{padding:34px 26px 65px}.topic-entry-grid{gap:14px}.topic-entry{gap:16px;padding:20px}.entry-icon{width:46px;height:46px}.topic-entry strong{font-size:17px}.topic-matches{grid-template-columns:1fr}}
@media(max-width:760px){:root{--header:58px;--nav:calc(64px + env(safe-area-inset-bottom))}.app-header{padding:0 18px;justify-content:space-between}.brand{font-size:21px}.header-nav{display:none}.header-search{font-size:23px;padding:2px 12px;background:none;border:0}.header-search span{font-size:12px}.mobile-nav{position:fixed;left:0;right:0;bottom:0;z-index:40;height:var(--nav);display:flex;align-items:stretch;justify-content:space-around;background:#0c0d14f5;border-top:1px solid #ffffff10;padding:4px 8px calc(4px + env(safe-area-inset-bottom));backdrop-filter:blur(16px)}.mobile-link{display:flex;flex:1;align-items:center;justify-content:center;flex-direction:column;gap:0;font-size:10px;padding:2px 0;background:none;border:0;color:#7c7f92;line-height:1.7}.mobile-link span{font-size:23px;line-height:1.35}.mobile-link.active{color:white}.mobile-link:hover{background:none}.mobile-create span{background:linear-gradient(105deg,#d33282,#8155da);border-radius:9px;padding:0 14px;color:white;font-size:24px;margin:1px 0 2px}.panel-screen{padding:30px 20px calc(30px + var(--nav));min-height:calc(100dvh - var(--header))}.panel-heading{margin-bottom:26px}h1{font-size:28px}h2{font-size:19px}.topic-entry-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.topic-entry{gap:18px;border-radius:19px}.entry-icon{width:50px;height:50px}.topic-entry strong{font-size:18px}.topic-overview-grid{grid-template-columns:1fr}.discussion-card{padding:21px 18px}.discussion-card strong{font-size:17px}.topic-video-grid,.search-video-grid{grid-template-columns:1fr}.topic-video-card,.search-video-card{display:grid;grid-template-columns:85px minmax(0,1fr)}.topic-video-scene,.search-video-scene{height:100%;min-height:135px}.topic-video-card>div:last-child,.search-video-card>div:last-child{padding:14px}.topic-video-card h3,.search-video-card h3{font-size:15px}.match-card{padding:20px}.segment-row{gap:6px}.segment{font-size:12px;padding:9px 10px;border-radius:9px}.rank-row{grid-template-columns:22px minmax(0,1fr) 64px;gap:12px;padding:22px 0}.rank-row h3{font-size:15px}.rank-index{font-size:21px}.rank-value>b{font-size:21px}.rank-value button{font-size:11px;padding:5px 8px}.rank-value>span{max-width:64px}.range-row{gap:26px}.feed-toolbar{top:9px}.feed-entry{font-size:18px}.feed-entries{gap:25px}.video-content{left:18px;right:80px;bottom:28px}.video-content h1{font-size:21px}.video-meta{font-size:12px}.feed-actions{right:15px;bottom:34px;gap:15px}.action-icon{font-size:31px}.feed-match-row{gap:12px;margin-top:14px}.watch-more{font-size:11px}.sound-toggle,.report-trigger{right:14px;top:66px}.report-trigger{top:106px}.match-feed-slide{padding:18px}.upload-card{padding:24px 18px}.submission-fields{grid-template-columns:1fr}.auth-card{padding:22px 18px}.profile-actions button{padding:10px 13px;font-size:12px}.review-card{padding:20px}.review-summary{gap:20px}.review-summary span{gap:7px}.review-summary b{font-size:23px}dialog{padding:24px 20px;border-radius:20px}.comment-dialog{margin:auto 0 0;width:100%;max-width:100%;border-radius:24px 24px 0 0}.search-form{gap:8px}.search-form .primary-button{padding:12px 16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:761px){.header-nav{justify-content:space-between}}

@media(max-width:760px){
  .mobile-nav{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:stretch;justify-content:initial;gap:0;width:100vw;max-width:100vw;padding:4px 6px calc(4px + env(safe-area-inset-bottom));background:#111216f7;border-top-color:#ffffff18}
  .mobile-link{min-width:0;width:100%;padding:2px 0;gap:1px}
  .mobile-link .nav-icon{font-size:0;line-height:1}
  .mobile-link .nav-label{font-size:10px;white-space:nowrap}
  .mobile-create .nav-icon{padding:0;margin:0 auto}
  .mobile-link .nav-label{font-size:clamp(8px,2.55vw,10px);letter-spacing:-.2px}
  .mobile-create .nav-icon{width:34px;height:34px;flex:none}
  .mobile-create .nav-icon svg{width:22px;height:22px}
  .upload-card{padding:28px 18px}
  .upload-card-copy{justify-items:center}
  .upload-icon{margin-inline:auto}
  .submission-category-picker,.topic-picker{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .submission-category-chip,.submission-topic-chip{min-height:48px;padding:10px 8px}
  .submit-user-note{align-items:stretch;flex-direction:column;gap:10px}
}

/* Topic detail ranking uses a separate score and a compact, tappable row. */
.category-detail-head>div{min-width:0;flex:1}
.category-detail-head>.compact-action{flex:0 0 auto;white-space:nowrap}
.topic-video-ranking-heading{display:grid;gap:14px;margin-top:26px}
.topic-video-ranking-heading>div:first-child>p{margin-top:4px;color:var(--muted);font-size:12px}
.topic-video-ranges{display:flex;gap:7px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}
.topic-video-ranges::-webkit-scrollbar{display:none}
.topic-video-range{min-height:44px;flex:0 0 auto;padding:8px 14px;border-radius:999px;background:#ffffff08;color:var(--muted);font-size:12px}
.topic-video-range.active{color:#fff;border-color:#ff375f;background:#351c24}
.topic-video-ranking-list{display:grid;gap:10px;margin-top:10px}
.topic-video-rank-row{display:grid;grid-template-columns:32px minmax(78px,112px) minmax(0,1fr) auto;align-items:center;gap:14px;padding:12px;border:1px solid var(--line);border-radius:15px;background:var(--surface)}
.topic-video-rank-index{font-size:20px;font-weight:800;color:#ffbf65;text-align:center}
.topic-rank-cover{position:relative;display:grid;place-items:center;aspect-ratio:16/10;min-width:0;overflow:hidden;border-radius:10px;background:linear-gradient(135deg,#343640,#17191d);color:#fff;font-size:11px}
.topic-rank-cover:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#ff375f44,transparent 60%)}
.topic-rank-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.topic-rank-cover span{position:relative;padding:4px 7px;border-radius:5px;background:#0008}
.topic-video-rank-copy{min-width:0}
.topic-video-rank-copy h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px}
.topic-video-rank-copy p{margin-top:3px;color:#d8d9dd;font-size:12px}
.topic-video-rank-copy small,.topic-video-rank-score small{display:block;margin-top:4px;color:var(--muted);font-size:10px;line-height:1.45}
.topic-video-rank-score{display:grid;justify-items:end;gap:2px;white-space:nowrap}
.topic-video-rank-score b{font-size:18px;color:#ffbf65}
.topic-video-rank-score button{min-width:52px;min-height:40px;margin-top:4px;padding:6px 9px;border-color:#ff375f66;background:#351c24;font-size:11px}
.topic-video-more-wrap{display:flex;justify-content:center;padding:10px}
.topic-video-more{min-height:44px;padding-inline:24px}
.topic-video-empty{display:grid;justify-items:center;gap:12px;padding:36px 18px}
.topic-video-empty button{min-height:44px}
.category-skeleton-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.skeleton-block,.skeleton-line{position:relative;overflow:hidden;border-radius:14px;background:#ffffff0d}
.skeleton-block:after,.skeleton-line:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,#ffffff12,transparent);animation:skeleton-shimmer 1.35s infinite}
.category-skeleton{min-height:190px}
.skeleton-line{height:12px;margin:12px 0}
.skeleton-short{width:28%}
.skeleton-topic-heading{height:92px;margin:18px 0}
.skeleton-topic-rank{height:72px;margin:12px 0}
.topic-video-rank-skeleton{height:88px}
@keyframes skeleton-shimmer{to{transform:translateX(100%)}}
@media(max-width:760px){
  .category-skeleton-grid{gap:11px}
  .category-skeleton{min-height:145px}
  .topic-video-rank-row{grid-template-columns:24px 78px minmax(0,1fr) auto;gap:8px;padding:9px}
  .topic-video-rank-index{font-size:17px}
  .topic-video-rank-copy h3{font-size:13px}
  .topic-video-rank-copy p{font-size:11px}
  .topic-video-rank-copy small{font-size:9px}
  .topic-video-rank-score b{font-size:15px}
  .topic-video-rank-score button{min-width:44px;min-height:44px;padding:5px}
}
@media(max-width:360px){
  .mobile-nav{padding-inline:2px}
  .mobile-link .nav-label{font-size:8px}
  .mobile-link .nav-icon svg{width:20px;height:20px}
  .mobile-create .nav-icon{width:30px;height:30px}
  .topic-video-rank-row{grid-template-columns:20px 64px minmax(0,1fr) 48px;gap:6px;padding:7px}
  .topic-video-rank-copy small{font-size:8px}
}

/* Viewport, safe-area and keyboard behavior for phones and small tablets. */
:root{--safe-area-top:env(safe-area-inset-top,0px);--safe-area-right:env(safe-area-inset-right,0px);--safe-area-bottom:env(safe-area-inset-bottom,0px);--safe-area-left:env(safe-area-inset-left,0px)}
html{scroll-padding-block-start:calc(var(--header) + 10px);scroll-padding-block-end:calc(var(--nav) + 12px)}
main,.screen,.panel-screen,.panel-screen>*{min-width:0}
button,a,input,textarea,select{touch-action:manipulation}
dialog{width:min(620px,calc(100vw - 28px - var(--safe-area-left) - var(--safe-area-right)));max-height:min(90dvh,calc(100dvh - var(--safe-area-top) - var(--safe-area-bottom) - 16px));overscroll-behavior:contain;scrollbar-gutter:stable}
.dialog-close{width:44px;height:44px;min-width:44px;min-height:44px}
.watch-dialog{max-height:min(90dvh,calc(100dvh - var(--safe-area-top) - var(--safe-area-bottom) - 16px))}
.watch-video,.watch-stage{max-height:min(65dvh,65svh)}
.watch-stage{height:auto;min-height:min(220px,38svh);aspect-ratio:16/9}
.panel-screen{scroll-margin-block-start:calc(var(--header) + 10px);scroll-padding-block-end:calc(var(--nav) + 16px)}
input:not([type=checkbox]),textarea,select{min-width:0;max-width:100%;scroll-margin-block:calc(var(--header) + var(--safe-area-top) + 12px) calc(var(--nav) + 16px)}
.mobile-link,.header-search,.primary-button,.upload-button,.friends-tab,.challenge-target-tab,.range,.segment,.review-tab{min-height:44px}
.feed-actions .action-button{min-width:44px;min-height:48px}

@media(max-width:760px){
  :root{--header:calc(58px + var(--safe-area-top));--nav:calc(64px + var(--safe-area-bottom))}
  body{overflow-x:clip}
  .app-header{height:var(--header);padding-top:var(--safe-area-top)}
  .mobile-nav{inset-inline:0;width:auto;max-width:none;padding-inline:max(6px,var(--safe-area-left)) max(6px,var(--safe-area-right));padding-bottom:calc(4px + var(--safe-area-bottom))}
  .mobile-link{min-width:0;min-height:56px;touch-action:manipulation}
  .feed-screen{height:calc(100vh - var(--header) - var(--nav));height:calc(100svh - var(--header) - var(--nav))}
  .panel-screen{padding-bottom:calc(24px + var(--nav));scroll-padding-block-end:calc(var(--nav) + 18px)}
  dialog[open]{position:fixed;inset-block-start:calc(var(--bimatch-visual-top,0px) + var(--safe-area-top) + 8px);inset-block-end:calc(var(--bimatch-visual-bottom,0px) + var(--safe-area-bottom) + 8px);inset-inline-start:max(12px,var(--safe-area-left));inset-inline-end:max(12px,var(--safe-area-right));width:auto;height:fit-content;max-width:none;max-height:calc(var(--bimatch-visual-height,100dvh) - var(--safe-area-top) - var(--safe-area-bottom) - 16px);margin:auto;overflow:auto}
  .comment-dialog[open]{inset-block-start:auto;inset-block-end:calc(var(--bimatch-visual-bottom,0px) + var(--safe-area-bottom));max-height:calc(var(--bimatch-visual-height,100dvh) - var(--safe-area-top) - var(--safe-area-bottom) - 8px);margin-block:auto 0;padding-bottom:calc(16px + var(--safe-area-bottom));border-radius:24px 24px 0 0}
  dialog[open]>.dialog-close{position:sticky;top:8px;float:right;margin:8px 8px -44px 0}
  .watch-dialog[open]{inset-inline-start:max(0px,var(--safe-area-left));inset-inline-end:max(0px,var(--safe-area-right));padding-bottom:var(--safe-area-bottom)}
  .search-screen .search-form{min-width:0;scroll-margin-block:calc(var(--header) + 12px) calc(var(--nav) + 16px)}
  .search-form .primary-button{min-width:76px}
  .comment-sheet-form button{min-width:64px;min-height:44px}
}

@media(max-width:360px){
  .panel-screen{padding-inline:16px}
  .ranking-layer-tabs,.range-row{gap:5px}
  .range,.segment{padding-inline:8px}
  .review-summary{gap:10px}
  .review-summary b{font-size:20px}
}

@media(max-width:760px) and (orientation:landscape){
  :root{--header:calc(46px + var(--safe-area-top));--nav:calc(52px + var(--safe-area-bottom))}
  .app-header{height:var(--header);padding-inline:16px;padding-top:var(--safe-area-top)}
  .mobile-nav{padding-top:2px;padding-bottom:calc(2px + var(--safe-area-bottom))}
  .mobile-link{min-height:48px}
  .mobile-link .nav-icon{height:20px}
  .feed-screen{height:calc(100vh - var(--header) - var(--nav));height:calc(100svh - var(--header) - var(--nav))}
  .panel-screen{padding-block-start:clamp(14px,4dvh,24px)}
  .watch-video,.watch-stage{max-height:52dvh}
}

/* Keep the design layer in sync with the final responsive overrides above. */
@media(max-width:760px){
  .mobile-nav{background:rgb(17 19 27 / 96%);border-top-color:var(--color-border)}
  .mobile-link.active{color:var(--color-brand)}
  .feed-entry{font-size:var(--font-size-sm)}
  .feed-entries{gap:clamp(16px,5vw,22px)}
  .video-content{left:16px;right:82px;bottom:40px}
  .video-content h1{font-size:clamp(16px,4.8vw,20px);line-height:1.35}
  .video-action-rail--feed{right:max(10px,env(safe-area-inset-right,0px))}
  .comment-dialog[open]{border-radius:18px 18px 0 0}
}
@media(max-width:760px){
.watch-dialog{padding:0}
.comment-heading{padding:20px 52px 14px 20px}.comment-list{padding:0 20px}.comment-composer{padding:14px 16px calc(14px + env(safe-area-inset-bottom))}
.friend-upload-card{align-items:flex-start;flex-direction:column}
}

/* Module 03: preserve a three-column icon grid without horizontal overflow on phones. */
@media(max-width:760px){
  .ranking-category-picker{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding-block:6px 10px}
  .ranking-category-option{min-height:68px;padding:7px 4px;gap:6px}
  .ranking-category-option>span{font-size:11px;white-space:nowrap;letter-spacing:-.01em}
  .category-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2);max-width:none}
  .category-card{min-height:108px;padding:var(--space-2);gap:4px}
  .category-card strong{font-size:12px}
  .category-card small,.category-card em{font-size:9px}
  .category-card .card-arrow{width:22px;height:22px}
  .category-card .category-card-icon,.category-card .category-icon .bimatch-icon{width:22px;height:22px;flex-basis:22px}
}

@media(max-width:360px){
  .ranking-category-picker{gap:6px}
  .ranking-category-option>span{font-size:10px}
  .category-grid{gap:6px}
  .category-card{padding:6px}
  .category-card strong{font-size:11px}
}

@media(max-width:760px){
  .ranking-result-row.has-rank-preview{grid-template-columns:22px 104px minmax(0,1fr);gap:6px 10px;padding:18px 0}
  .ranking-result-row.has-rank-preview>.rank-index,.ranking-result-row.has-rank-preview>.rank-preview{grid-row:1 / span 2;align-self:center}
  .ranking-result-row.has-rank-preview>.rank-copy{grid-column:3;grid-row:1}
  .ranking-result-row.has-rank-preview .rank-copy h3{font-size:13px;line-height:1.45;margin:3px 0}
  .ranking-result-row.has-rank-preview .rank-copy p{font-size:10px}
  .ranking-result-row.has-rank-preview>.rank-value{grid-column:3;grid-row:2;display:flex;align-items:center;justify-content:flex-start;gap:7px;text-align:left}
  .ranking-result-row.has-rank-preview .rank-value>b{font-size:17px}
  .ranking-result-row.has-rank-preview .rank-open{margin-left:auto;padding:2px 0;white-space:nowrap}
  .rank-preview-label{font-size:9px;padding:12px 5px 4px}
  .champion-card.has-rank-preview{grid-template-columns:minmax(0,1fr);gap:5px;min-height:0;padding:20px}
  .champion-card.has-rank-preview>.rank-preview{grid-column:1;grid-row:1;width:100%;margin-bottom:8px}
  .champion-card.has-rank-preview>.champion-crown{display:none}
  .champion-card.has-rank-preview>strong{font-size:18px}
  .champion-card.has-rank-preview>b{font-size:23px}
  .champion-card>b{position:static;grid-column:1}
}

/* Five primary destinations; topic discovery stays under Rankings. */
.mobile-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));justify-content:stretch}
.mobile-link{min-width:0;flex:initial}
.mobile-create .nav-icon{display:grid;place-items:center;width:38px;height:30px;padding:0;border-radius:9px;background:var(--color-brand);color:#fff}
.mobile-create .nav-icon svg{width:23px;height:23px}
.mobile-create .nav-label{margin:0;padding:0;background:none;color:inherit;font-size:inherit}
.feed-battle[hidden]{display:none!important}
.feed-battle{position:absolute;inset:54px 0 0;z-index:2;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;background:#07080d}
.feed-battle-toolbar{position:sticky;top:0;z-index:5;display:grid;gap:8px;padding:9px clamp(12px,3vw,24px);border-bottom:1px solid rgb(255 255 255 / 8%);background:rgb(10 11 16 / 94%);backdrop-filter:blur(12px)}
.feed-battle .battle-toolbar{justify-content:center;align-items:center;gap:12px;margin:0;font-size:12px}
.battle-default-label{justify-self:center;color:var(--muted);font-size:11px}
.battle-channel-filters{display:flex;justify-content:center;gap:6px}
.battle-channel-filters .segment{min-width:76px;min-height:36px;padding:7px 12px}
.feed-battle .battle-list{width:min(1000px,100%);margin:0 auto;padding:12px clamp(12px,3vw,24px) calc(24px + var(--nav) + var(--safe-area-bottom))}
@media(max-width:760px){
  .mobile-nav{grid-template-columns:repeat(5,minmax(0,1fr));padding-inline:max(3px,var(--safe-area-left)) max(3px,var(--safe-area-right))}
  .mobile-link{gap:1px;padding-inline:0}
  .mobile-link .nav-icon{width:24px;height:24px}
  .mobile-link .nav-icon svg{width:22px;height:22px}
  .mobile-create .nav-icon{width:34px;height:28px}
  .mobile-link .nav-label{font-size:10px;white-space:nowrap}
  .mobile-create .nav-label{font-size:10px}
  .feed-battle{inset-block-start:52px}
  .feed-battle .battle-toolbar{justify-content:space-between;gap:7px;font-size:10px}
  .battle-default-label{font-size:10px}
  .battle-channel-filters .segment{flex:1;min-width:0;min-height:40px;padding-inline:7px}
  .feed-battle .battle-list{padding-inline:10px}
}
@media(max-width:360px){
  .mobile-link .nav-label,.mobile-create .nav-label{font-size:9px}
  .mobile-link .nav-icon svg{width:20px;height:20px}
  .feed-battle .battle-toolbar{font-size:9px}
}

/* Creator Profile V2: shared presentation for the owner and public route. */
body .user-screen,body .profile-screen{width:100%;max-width:min(1320px,100%);padding-inline:clamp(16px,3.2vw,44px)}
body .user-screen.has-profile .panel-heading{display:none}
.creator-profile-overview{display:grid;gap:18px;min-width:0}
.creator-profile-hero{position:relative;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-panel);background:var(--color-surface)}
.creator-profile-cover{position:relative;height:184px;overflow:hidden;border-bottom:1px solid var(--color-border);background:radial-gradient(ellipse at 18% 0%,rgb(242 70 131 / 11%),transparent 42%),linear-gradient(112deg,#11131b 0%,#171923 52%,#10121a 100%)}
.creator-profile-cover::before{position:absolute;inset:-55% 24% -75% -16%;border:1px solid rgb(255 255 255 / 5%);border-radius:50%;content:"";transform:rotate(-14deg)}
.creator-profile-cover::after{position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 47px,rgb(255 255 255 / 2.2%) 48px 49px,transparent 50px 96px);content:"";mask-image:linear-gradient(90deg,#000,transparent 76%)}
.creator-profile-cover>span{position:absolute;z-index:1;top:24px;left:30px;color:rgb(245 246 248 / 47%);font-size:10px;font-weight:600;letter-spacing:.16em}
.creator-profile-hero-body{position:relative;display:grid;grid-template-columns:128px minmax(0,1fr) auto;align-items:center;gap:22px;padding:0 30px 26px}
.creator-profile-avatar{width:128px;height:128px;margin-top:-64px;border:4px solid var(--color-surface);border-radius:27px;background:#302338;font-size:42px;box-shadow:0 0 0 1px var(--color-border)}
.creator-profile-identity{min-width:0;padding-top:12px}
.creator-profile-label{margin:0 0 5px;color:var(--color-text-muted);font-size:var(--font-size-xs);font-weight:var(--weight-medium)}
.creator-profile-identity h2{margin:0;font-size:clamp(28px,3vw,38px);line-height:1.15;letter-spacing:-.035em;overflow-wrap:anywhere}
.creator-profile-bio{max-width:66ch;margin:9px 0 0;color:var(--color-text-secondary);font-size:var(--font-size-sm);line-height:1.65;overflow-wrap:anywhere}
.creator-profile-social{display:flex;gap:20px;margin-top:14px;color:var(--color-text-muted);font-size:var(--font-size-xs)}
.creator-profile-social span{display:inline-flex;gap:5px;align-items:baseline}
.creator-profile-social strong{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-variant-numeric:tabular-nums}
.creator-profile-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;max-width:420px}
.profile-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:88px;min-height:44px;padding:9px 13px;border:1px solid var(--color-border);border-radius:var(--radius-control);font-size:var(--font-size-sm);font-weight:var(--weight-medium);white-space:nowrap;transition:background var(--motion-base),border-color var(--motion-base),color var(--motion-base),transform var(--motion-fast)}
.profile-action:active{transform:scale(.98)}
.profile-action-primary{border-color:transparent;background:var(--color-brand);color:#fff}
.profile-action-primary:hover{background:var(--color-brand-hover)}
.profile-action-secondary{background:var(--color-surface-raised);color:var(--color-text)}
.profile-action-secondary:hover,.profile-action-tertiary:hover{border-color:var(--color-brand-border);background:var(--color-brand-soft)}
.profile-action-tertiary{min-width:auto;background:transparent;color:var(--color-text-secondary)}
.profile-action-icon{width:18px;height:18px;flex:0 0 18px}
.profile-friend-state{display:inline-flex;align-items:center;min-height:44px;padding-inline:12px;border:1px solid var(--color-border);border-radius:var(--radius-control);color:var(--color-text-secondary);font-size:var(--font-size-sm)}
.creator-profile-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;margin:0;border:1px solid var(--color-border);border-radius:var(--radius-panel);background:var(--color-surface)}
.creator-profile-stat{display:grid;align-content:center;gap:7px;min-height:96px;padding:18px clamp(14px,2vw,26px);border-right:1px solid var(--color-border)}
.creator-profile-stat:last-child{border-right:0}
.creator-profile-stat strong{font-size:clamp(23px,2.4vw,30px);font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums;line-height:1.1}
.creator-profile-stat span{color:var(--color-text-muted);font-size:var(--font-size-xs)}
.creator-profile-stat.is-primary strong{font-size:clamp(27px,2.8vw,34px)}
.creator-profile-stat.is-primary span{color:var(--color-text-secondary)}
.creator-profile-stat.is-highlighted strong{color:var(--color-brand-text)}
.profile-content-area{min-width:0;margin-top:4px}
.profile-content-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;border-bottom:1px solid var(--color-border)}
.profile-content-kicker{margin-bottom:4px;color:var(--color-text-muted);font-size:10px;font-weight:var(--weight-semibold);letter-spacing:.12em}
.profile-content-heading h2{margin-bottom:14px;font-size:var(--font-size-lg)}
.profile-content-tabs{display:flex;align-items:stretch;gap:clamp(18px,3vw,38px)}
.profile-content-tabs>[role="tab"]{position:relative;display:inline-flex;align-items:center;gap:7px;min-width:68px;min-height:48px;padding:9px 2px 12px;border:0;border-radius:0;background:transparent;color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--weight-semibold)}
.profile-content-tabs>[role="tab"] span{color:var(--color-text-muted);font-size:var(--font-size-xs);font-variant-numeric:tabular-nums}
.profile-content-tabs>[role="tab"][aria-selected="true"]{color:var(--color-text)}
.profile-content-tabs>[role="tab"][aria-selected="true"]::after{position:absolute;right:0;bottom:-1px;left:0;height:2px;border-radius:2px;background:var(--color-brand);content:""}
.profile-content-tabs>[role="tab"]:focus-visible{outline-offset:-3px}
.profile-content-section{min-width:0;margin:0;padding:18px 0 0;border:0;border-radius:0;background:transparent}
.profile-work-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.profile-video-card{min-width:0;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);transition:border-color var(--motion-base),transform var(--motion-base)}
.profile-video-card:hover{border-color:rgb(255 255 255 / 15%);transform:translateY(-2px)}
.profile-video-cover{position:relative;display:grid;width:100%;aspect-ratio:16/9;place-items:center;overflow:hidden;padding:0;border:0;border-radius:0;background:var(--color-surface-raised)}
.profile-video-cover-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.profile-video-cover-fallback{display:grid;align-content:center;justify-items:center;gap:7px;width:100%;height:100%;background:radial-gradient(ellipse at 50% 120%,rgb(242 70 131 / 8%),transparent 58%),repeating-linear-gradient(135deg,transparent 0 30px,rgb(255 255 255 / 2%) 31px 32px,transparent 33px 64px),#151720;color:var(--color-text-secondary);font-size:var(--font-size-sm)}
.profile-video-cover-fallback small{color:var(--color-text-muted);font-size:10px}
.profile-video-play{position:absolute;right:12px;bottom:12px;display:grid;width:36px;height:36px;place-items:center;border:1px solid rgb(255 255 255 / 35%);border-radius:50%;background:rgb(9 10 15 / 78%);color:var(--color-text)}
.profile-video-play .bimatch-icon{width:17px;height:17px;flex-basis:17px}
.profile-video-card-body{display:grid;gap:7px;padding:13px 14px 12px}
.profile-video-card-body h3{overflow:hidden;margin:0;font-size:var(--font-size-md);line-height:1.4;text-overflow:ellipsis;white-space:nowrap}
.profile-video-description{overflow:hidden;margin:0;color:var(--color-text-muted);font-size:var(--font-size-xs);text-overflow:ellipsis;white-space:nowrap}
.profile-video-card-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px;padding-top:9px;border-top:1px solid var(--color-border)}
.profile-video-metrics,.profile-video-card-actions{display:flex;align-items:center;gap:12px;min-width:0;color:var(--color-text-muted);font-size:10px}
.profile-video-metrics>span{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.profile-video-metric-icon{width:13px;height:13px;flex:0 0 13px}
.profile-video-metrics-empty{font-size:10px}
.profile-video-text-action,.profile-owner-inline-action{min-height:44px;padding:7px;border:0;background:transparent;color:var(--color-text-secondary);font-size:var(--font-size-xs)}
.profile-video-text-action:hover,.profile-owner-inline-action:hover{background:transparent;color:var(--color-brand-text)}
.profile-match-list{display:grid;min-width:0}
.profile-match-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;min-height:72px;padding:12px 4px;border:0;border-bottom:1px solid var(--color-border);border-radius:0;background:transparent;color:var(--color-text);text-align:left}
.profile-match-row:hover{background:rgb(255 255 255 / 2%)}
.profile-match-mark{display:grid;place-items:center;color:var(--color-text-muted)}
.profile-match-mark .bimatch-icon{width:20px;height:20px;flex-basis:20px}
.profile-match-copy{display:grid;gap:4px;min-width:0}
.profile-match-copy strong{overflow:hidden;font-size:var(--font-size-sm);text-overflow:ellipsis;white-space:nowrap}
.profile-match-copy small{overflow:hidden;color:var(--color-text-muted);text-overflow:ellipsis;white-space:nowrap}
.profile-match-status{max-width:170px;color:var(--color-text-secondary);font-size:var(--font-size-xs);text-align:right}
.profile-empty-state{display:grid;justify-items:center;gap:10px;min-height:142px;align-content:center;padding:20px;border:1px dashed var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:1.6;text-align:center}
.profile-empty-state p{margin:0}
.profile-work-list>.profile-empty-state,.profile-match-list>.profile-empty-state{grid-column:1/-1}
.profile-empty-action{min-height:40px;padding:7px 12px;border:1px solid var(--color-border);border-radius:var(--radius-control);background:var(--color-surface-raised);color:var(--color-text)}
.profile-owner-dialog{width:min(600px,calc(100vw - 32px));max-width:600px;max-height:min(820px,calc(var(--bimatch-visual-height,100dvh) - 40px));overflow:auto;padding:0;border:1px solid var(--color-border);border-radius:var(--radius-panel);background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-panel)}
.profile-owner-dialog::backdrop{background:rgb(3 4 7 / 72%);backdrop-filter:blur(3px)}
.profile-owner-dialog-header{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;border-bottom:1px solid var(--color-border);background:var(--color-surface)}
.profile-owner-dialog-header .eyebrow{margin-bottom:2px}
.profile-owner-dialog-header h2{font-size:var(--font-size-lg)}
.profile-owner-dialog-header .dialog-close{display:grid;width:44px;height:44px;place-items:center;padding:0;border:1px solid var(--color-border);border-radius:var(--radius-control);background:var(--color-surface-raised)}
.profile-owner-dialog-header .dialog-close .bimatch-icon{width:20px;height:20px}
.profile-owner-dialog-body,.profile-owner-dialog #profileOwnerDialogBody{padding:18px 22px 22px}
.profile-owner-dialog .profile-edit-card,.profile-owner-dialog .profile-owner-section,.profile-owner-dialog .profile-settings{margin:0;padding:0;border:0;border-radius:0;background:transparent}
.profile-owner-dialog .profile-edit-form{gap:15px}
.profile-owner-dialog .profile-edit-form input,.profile-owner-dialog .profile-edit-form textarea{min-height:44px}
.profile-owner-dialog .profile-avatar-edit{min-height:58px}
.profile-owner-divider{height:1px;margin:20px 0;background:var(--color-border)}
.profile-owner-section .profile-section-heading{margin-bottom:12px}
.profile-owner-section .profile-settings{display:flex;flex-wrap:wrap;gap:10px}
.profile-owner-section .profile-settings h2{width:100%}
.profile-owner-section .profile-settings button{min-height:44px;border-color:var(--color-border);border-radius:var(--radius-control);background:var(--color-surface-raised)}
@media(min-width:761px) and (max-width:1100px){
  .creator-profile-cover{height:156px}
  .creator-profile-hero-body{grid-template-columns:100px minmax(0,1fr);gap:16px;padding:0 22px 20px}
  .creator-profile-avatar{width:100px;height:100px;margin-top:-50px;border-radius:22px;font-size:34px}
  .creator-profile-actions{grid-column:2;justify-content:flex-start;max-width:none}
  .creator-profile-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  .profile-work-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  body .user-screen,body .profile-screen{max-width:100%;padding-inline:max(14px,var(--safe-area-left)) max(14px,var(--safe-area-right))}
  body .user-screen.has-profile .panel-heading{display:none}
  .creator-profile-overview{gap:14px}
  .creator-profile-hero{border-radius:var(--radius-card)}
  .creator-profile-cover{height:118px}
  .creator-profile-cover>span{top:16px;left:17px;font-size:9px}
  .creator-profile-hero-body{grid-template-columns:76px minmax(0,1fr);align-items:start;gap:9px 13px;padding:0 16px 16px}
  .creator-profile-avatar{width:76px;height:76px;margin-top:-38px;border-width:3px;border-radius:19px;font-size:27px}
  .creator-profile-identity{padding-top:8px}
  .creator-profile-label{margin-bottom:3px;font-size:10px}
  .creator-profile-identity h2{font-size:clamp(22px,6vw,28px)}
  .creator-profile-bio{margin-top:6px;font-size:var(--font-size-xs);line-height:1.55}
  .creator-profile-social{grid-column:2;gap:14px;margin-top:8px;font-size:10px}
  .creator-profile-social strong{font-size:var(--font-size-xs)}
  .creator-profile-actions{grid-column:1/-1;justify-content:flex-start;gap:7px;max-width:none;margin-top:5px}
  .profile-action{min-height:44px;padding:8px 11px;font-size:var(--font-size-xs)}
  .profile-owner-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile-owner-actions .profile-action-primary{grid-column:1/-1}
  .profile-public-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile-friend-state{min-height:44px;font-size:var(--font-size-xs)}
  .creator-profile-stats{grid-template-columns:repeat(2,minmax(0,1fr));border-radius:var(--radius-card)}
  .creator-profile-stat{min-height:70px;padding:12px 15px;border-right:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
  .creator-profile-stat:nth-child(2n){border-right:0}
  .creator-profile-stat:nth-last-child(-n+2){border-bottom:0}
  .creator-profile-stat strong{font-size:23px}
  .profile-content-heading{display:grid;gap:0}
  .profile-content-heading h2{margin-bottom:8px}
  .profile-content-tabs{gap:clamp(18px,7vw,32px)}
  .profile-content-tabs>[role="tab"]{min-width:58px;min-height:46px;font-size:var(--font-size-xs)}
  .profile-work-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .profile-video-card-body{gap:5px;padding:10px}
  .profile-video-card-body h3{font-size:var(--font-size-sm)}
  .profile-video-card-footer{align-items:flex-start;flex-direction:column;gap:5px;padding-top:7px}
  .profile-video-card-actions{width:100%;justify-content:flex-end}
  .profile-video-metrics{font-size:9px}
  .profile-match-row{grid-template-columns:24px minmax(0,1fr);gap:8px;min-height:66px;padding-inline:0}
  .profile-match-status{grid-column:2;max-width:none;text-align:left}
  .profile-empty-state{min-height:116px;padding:16px}
  .profile-owner-dialog{position:fixed;inset:auto 0 0;width:100%;max-width:none;max-height:calc(var(--bimatch-visual-height,100dvh) - var(--safe-area-top));margin:auto 0 0;padding-bottom:var(--safe-area-bottom);border-radius:20px 20px 0 0}
  .profile-owner-dialog-header{padding:14px 16px}
  .profile-owner-dialog #profileOwnerDialogBody{padding:16px}
}
@media(max-width:420px){
  .profile-work-list{grid-template-columns:1fr}
  .profile-video-card{display:grid;grid-template-columns:minmax(112px,42%) minmax(0,1fr);align-items:stretch}
  .profile-video-cover{height:100%;min-height:110px;aspect-ratio:auto}
  .profile-video-card-body{align-content:center;padding:10px 11px}
  .profile-video-card-footer{gap:3px}
  .profile-video-metrics{flex-wrap:wrap;gap:8px}
}
@media(max-width:360px){
  .creator-profile-cover{height:108px}
  .creator-profile-hero-body{grid-template-columns:64px minmax(0,1fr);gap:8px 10px;padding-inline:12px}
  .creator-profile-avatar{width:64px;height:64px;margin-top:-32px;border-radius:16px;font-size:23px}
  .creator-profile-identity h2{font-size:22px}
  .profile-owner-actions{gap:6px}
  .profile-action{min-width:0;padding-inline:8px}
  .profile-content-tabs{gap:16px}
  .profile-video-card{grid-template-columns:minmax(104px,40%) minmax(0,1fr)}
  .profile-video-card-body{padding:8px}
  .profile-video-metrics{font-size:8px}
}