.friends-overlay{background:var(--paper);min-height:calc(100dvh - 150px);padding-top:0!important}.connections-page{min-height:100%;padding-bottom:var(--space-8)}.connections-page>.page-topbar{margin-bottom:0}.connection-tabs{border-bottom:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr));margin:0;display:grid}.connection-tabs button{min-height:52px;color:var(--sub);font-size:var(--fs-body);font-variant-numeric:tabular-nums;font-weight:700;position:relative}.connection-tabs button:after{content:"";background:0 0;border-radius:2px;height:2px;transition:background .2s,transform .2s cubic-bezier(.16,1,.3,1);position:absolute;bottom:-1px;left:18%;right:18%;transform:scaleX(.35)}.connection-tabs button.active{color:var(--ink);font-weight:800}.connection-tabs button.active:after{background:var(--ink);transform:scaleX(1)}.connection-tabs span{color:inherit;font-variant-numeric:tabular-nums;margin-left:3px}.connection-search{margin:var(--space-4) 0 var(--space-2);align-items:center;display:flex;position:relative}.connection-search>svg{fill:none;width:18px;height:18px;stroke:var(--sub);stroke-width:1.8px;stroke-linecap:round;pointer-events:none;position:absolute;left:13px}.connection-search input{border-radius:var(--radius-md);background:var(--surface-muted);width:100%;height:42px;color:var(--ink);font-size:var(--fs-body);border:1px solid #0000;outline:0;padding:0 92px 0 40px}.connection-search.can-search input{padding-right:128px}.connection-search input:focus{border-color:var(--line);background:var(--surface);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.09)}.connection-search-clear{background:var(--handle);width:28px;height:28px;color:var(--surface);border-radius:50%;place-items:center;font-size:18px;line-height:1;display:grid;position:absolute;right:9px}.connection-search-submit{border-radius:var(--radius-sm);background:var(--surface);min-height:32px;color:var(--accent-text);font-size:var(--fs-caption);padding:0 9px;font-weight:800;position:absolute;right:7px}.connection-search-submit+.connection-search-clear{right:78px}.connection-notice{margin:var(--space-2) 0}.connection-result-head{padding:var(--space-4) 0 var(--space-2);font-size:var(--fs-small);align-items:center;gap:6px;display:flex}.connection-result-head span{color:var(--sub);font-variant-numeric:tabular-nums}.connection-list{margin-top:0;display:grid}.connection-person{gap:var(--space-3);border-bottom:0;min-height:68px;padding:9px 0}.connection-person .person-open{gap:var(--space-3)}.connection-person .social-avatar{border:1px solid var(--line);background:var(--surface-muted);flex-basis:48px;width:48px;height:48px}.connection-person .person-copy strong{font-size:var(--fs-label);font-weight:800}.connection-person .person-copy small{color:var(--sub);font-size:var(--fs-small);margin-top:2px}.connection-person .person-copy em{color:var(--sub);font-size:var(--fs-caption);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-style:normal;display:block;overflow:hidden}.connection-person .small-action{border-radius:var(--radius-sm);background:var(--accent);min-width:82px;min-height:36px;color:var(--on-accent);font-size:var(--fs-small);padding:0 13px;font-weight:800;transition:background .2s,color .2s,transform .15s cubic-bezier(.16,1,.3,1)}.connection-person .small-action.following{border:1px solid var(--line);background:var(--surface);color:var(--ink)}.connection-person .small-action:disabled{opacity:.58}.connection-person .small-action:focus-visible,.connection-tabs button:focus-visible{outline:2px solid var(--accent-text);outline-offset:2px}.connection-empty{min-height:260px;padding:var(--space-8) var(--space-5);text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}.connection-empty>span{width:62px;height:62px;margin-bottom:var(--space-4);border:1.5px solid var(--ink);font-size:var(--fs-page);border-radius:50%;place-items:center;display:grid}.connection-empty strong{font-size:var(--fs-card);letter-spacing:-.25px}.connection-empty p{max-width:240px;margin:var(--space-2) 0 0;color:var(--sub);font-size:var(--fs-small);text-wrap:pretty;line-height:1.55}.connections-page .skeleton-people{padding-top:var(--space-2);gap:0}.connections-page .skeleton-people>div{gap:var(--space-3);grid-template-columns:48px minmax(0,1fr);min-height:68px}.connections-page .skeleton-people .sk-avatar{width:48px;height:48px}@media (max-width:390px){.connection-person .small-action{min-width:74px}.connection-search{margin-top:var(--space-3)}}
.loading{isolation:isolate;background:var(--paper);place-items:center;width:min(100%,430px);min-height:100dvh;margin:auto;display:grid;position:relative;overflow:hidden}.loading:before,.loading:after{z-index:-1;content:"";filter:blur(2px);border-radius:50%;position:absolute}.loading:before{background:radial-gradient(circle,rgba(var(--accent-rgb),.11),transparent 68%);width:230px;height:230px;top:22%;left:-18%}.loading:after{background:radial-gradient(circle,rgba(var(--ink-rgb),.065),transparent 68%);width:260px;height:260px;bottom:14%;right:-22%}.loading-scene{flex-direction:column;align-items:center;width:184px;animation:.7s cubic-bezier(.16,1,.3,1) both loading-arrive;display:flex;transform:translateY(-8px)}.loading-mark{width:76px;height:72px;filter:drop-shadow(0 13px 18px rgba(var(--ink-rgb),.16));margin-bottom:24px;position:relative}.loading-clap{z-index:2;background:var(--surface-strong);transform-origin:7px 100%;border-radius:5px 5px 3px 3px;justify-content:space-around;align-items:center;width:74px;height:17px;animation:1.65s cubic-bezier(.4,0,.2,1) infinite loading-clap;display:flex;position:absolute;top:0;left:1px;overflow:hidden}.loading-clap i{background:var(--paper);width:16px;height:30px;transform:rotate(31deg)}.loading-slate{background:var(--surface-strong);color:#fff;border-radius:4px 4px 16px 16px;place-items:center;height:57px;display:grid;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.loading-slate:after{content:"";border:1px solid #ffffff1a;border-radius:3px 3px 15px 15px;position:absolute;inset:1px}.loading-slate strong{font-size:var(--fs-display-sm);letter-spacing:-1px;font-weight:900;line-height:1;animation:1.65s ease-in-out infinite loading-letter}.loading-slate>span{gap:3px;display:flex;position:absolute;bottom:7px;right:8px}.loading-slate>span i{background:#ffffff61;border-radius:50%;width:3px;height:3px}.loading-copy{text-align:center}.loading-copy strong{color:var(--ink);font-size:var(--fs-caption);letter-spacing:2.8px;font-weight:900;display:block}.loading-copy span{color:var(--sub);font-size:var(--fs-small);letter-spacing:-.15px;margin-top:8px;font-weight:600;display:block}.loading-track{border-radius:var(--radius-pill);background:var(--line);width:100%;height:2px;margin-top:18px;overflow:hidden}.loading-track i{border-radius:inherit;background:var(--accent);width:42%;height:100%;animation:1.3s cubic-bezier(.65,0,.35,1) infinite loading-track;display:block}@keyframes loading-arrive{0%{opacity:0;transform:translateY(4px)scale(.96)}to{opacity:1;transform:translateY(-8px)scale(1)}}@keyframes loading-clap{0%,16%,to{transform:rotate(0)}42%,68%{transform:rotate(-16deg)}}@keyframes loading-letter{0%,to{opacity:.74;transform:scale(.96)}50%{opacity:1;transform:scale(1)}}@keyframes loading-track{0%{transform:translate(-110%)}55%{transform:translate(80%)}to{transform:translate(245%)}}@media (prefers-reduced-motion:reduce){.loading-scene,.loading-clap,.loading-slate strong,.loading-track i{animation:none}.loading-track i{opacity:.65;width:100%}}
.app-topbar{height:calc(62px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 16px 0;background:rgba(var(--surface-rgb),.96);border-bottom:1px solid var(--line);box-shadow:none;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);grid-template-columns:minmax(88px,1fr) auto minmax(88px,1fr);align-items:center;display:grid}.app-topbar-placeholder{display:block}.app-topbar>h1{font-size:var(--fs-card);letter-spacing:-.35px;text-align:center;white-space:nowrap;margin:0;font-weight:850}.app-topbar .header-actions{justify-self:end}.app-topbar-leading{grid-template-columns:minmax(0,1fr) 0 48px}.app-topbar-leading>h1{text-align:left;text-overflow:ellipsis;overflow:hidden}.app-topbar-brand>h1{letter-spacing:.4px;font-weight:950}.content{padding-top:calc(78px + env(safe-area-inset-top))}.content.content-no-header{padding-top:0!important}.page-topbar{z-index:12;height:calc(56px + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left));border-bottom:1px solid var(--line);background:rgba(var(--surface-rgb),.96);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;margin:0 -16px 18px;display:grid;position:sticky;top:0}.page-topbar h1{font-size:var(--fs-card);letter-spacing:-.35px;text-align:center;text-overflow:ellipsis;white-space:nowrap;margin:0;font-weight:850;overflow:hidden}.page-topbar-back{width:44px;height:44px;color:var(--ink);border-radius:50%;place-items:center;display:grid}.page-topbar-back svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:27px;height:27px}.page-topbar-actions{justify-content:flex-end;align-items:center;gap:4px;display:flex}.notification-page,.record-detail-page,.record-edit-page,.media-detail,.media-collection-detail,.scene-user-profile,.official-collection-detail,.collection-detail{padding-top:0!important}.language-page>.page-topbar{width:100%;margin:0}.notification-page>.page-topbar,.record-detail-page>.page-topbar,.record-edit-page>.page-topbar,.media-detail>.page-topbar,.media-collection-detail>.page-topbar,.scene-user-profile>.page-topbar,.official-collection-detail>.page-topbar,.collection-detail>.page-topbar{margin-bottom:18px}.media-detail>.page-topbar{margin:0}.media-collection-detail>header{position:static}.record-detail-page>.back-button,.record-edit-page>.back-button,.media-detail>.back-button,.media-collection-detail>.back-button{width:44px;height:calc(56px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);color:var(--ink);filter:none;justify-content:center;align-items:center;margin:0 0 18px -12px;display:flex;position:sticky;top:0;left:auto}.record-detail-page>.back-button:after,.record-edit-page>.back-button:after,.media-detail>.back-button:after,.media-collection-detail>.back-button:after{z-index:-1;box-sizing:border-box;width:min(100vw,430px);height:100%;padding-top:env(safe-area-inset-top);border-bottom:1px solid var(--line);background:rgba(var(--surface-rgb),.96);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);content:"상세";font-size:var(--fs-card);letter-spacing:-.35px;pointer-events:none;place-items:center;font-weight:850;display:grid;position:absolute;top:0;left:-16px}.record-detail-page>.back-button:after{content:"감상 기록"}.record-edit-page>.back-button:after{content:"기록 수정"}.media-detail>.back-button:after{content:"작품 정보"}.media-collection-detail>.back-button:after{content:"컬렉션"}.page-slide-in{will-change:transform,opacity;backface-visibility:hidden}.page-slide-in.is-enter{opacity:0;transition:none}.page-slide-in.from-right.is-enter{transform:translate3d(var(--motion-distance-page),0,0)}.page-slide-in.from-left.is-enter{transform:translate3d(calc(var(--motion-distance-page) * -1),0,0)}.page-slide-in.is-open{opacity:1;transition:transform var(--dur-page) var(--motion-ease-emphasized),opacity var(--dur-base) ease-out;transform:translate(0,0)}.page-exit-right{animation:page-exit-right var(--dur-page) var(--motion-ease-standard) both;pointer-events:none}@keyframes page-exit-right{to{opacity:0;transform:translate3d(var(--motion-distance-page),0,0)}}.page-auto-enter{opacity:0;transform:translate3d(var(--motion-distance-page),0,0);will-change:transform,opacity;backface-visibility:hidden}.page-auto-enter.is-open{opacity:1;transition:transform var(--dur-page) var(--motion-ease-emphasized),opacity var(--dur-base) ease-out;transform:translate(0,0)}.page-auto-exit{animation:page-exit-right var(--dur-page) var(--motion-ease-standard) both;pointer-events:none}.tab-page-enter{animation:tab-page-slide-in var(--dur-page) var(--motion-ease-emphasized) both;will-change:transform,opacity}@keyframes tab-page-slide-in{0%{opacity:.35;transform:translate3d(var(--motion-distance-page),0,0)}to{opacity:1;transform:translate(0,0)}}@media (prefers-reduced-motion:reduce){.page-slide-in,.page-auto-enter,.page-auto-exit,.tab-page-enter{opacity:1!important;transition:none!important;animation:none!important;transform:none!important}}@media (max-width:340px){.page-topbar{margin-left:-14px;margin-right:-14px}.app-topbar{grid-template-columns:minmax(72px,1fr) auto minmax(72px,1fr);padding-inline:12px}}.record-row:active,.feed-work:active,.feed-author-link:active,.profile-poster-card:active,.collection-card-unified-main:active,.official-item-open:active,.person-open:active,.settings-row:active,.notification-list button:active,.question-result-row:active,.question-answer-movie:active,.explore-person:active,.explore-result-list button:active,.explore-discovery-grid button:active,.collection-pick-row:active{transform:none}.record-row:active,.person-open:active,.settings-row:active,.notification-list button:active,.explore-result-list button:active,.explore-person:active{background:var(--surface-muted)}
.primary,.detail-record,.scene-follow,.explore-search button,.explore-search-submit,.question-invite button,.question-submit,.onboarding-primary,.profile-empty button,.social-empty button{background:var(--accent);color:var(--on-accent)}.primary:hover,.detail-record:hover,.scene-follow:hover,.explore-search button:hover,.explore-search-submit:hover,.question-invite button:hover,.question-submit:hover,.onboarding-primary:hover,.profile-empty button:hover,.social-empty button:hover{background:var(--accent-hover)}.primary:active,.detail-record:active,.scene-follow:active,.explore-search button:active,.explore-search-submit:active,.question-invite button:active,.question-submit:active,.onboarding-primary:active,.profile-empty button:active,.social-empty button:active{background:var(--accent-pressed)}nav button.active{color:var(--accent-text)}.tabs-pill button.active{background:var(--accent);color:var(--on-accent)}.tabs-underline button.active{border-color:var(--accent);color:var(--accent-text)}.library-filter-section-tabs button.active{color:var(--accent-text)}.library-filter-section-tabs button.active:after{background:var(--accent)}.daily-question-head{border-bottom:1px solid var(--line);background:var(--accent-soft);color:var(--ink)}.daily-question-head small,.question-detail-prompt small{color:var(--accent-text)}.daily-question-head p{color:var(--sub)}.question-selected{background:var(--surface-muted)}.question-answer-author img,.question-answer-author button>span{background:var(--accent-soft)}.question-detail-prompt{border:1px solid var(--line);background:var(--accent-soft);color:var(--ink)}.header-bell em,.library-filter-open em,.video-list a>span{color:var(--on-accent)}.connection-search-clear,.explore-search-clear{width:var(--tap);height:var(--tap);min-width:var(--tap);min-height:var(--tap)}.selected-collection-records article>div button{width:var(--tap);height:var(--tap)}.genre-option,.connection-person .small-action,.onboarding-genres button,.onboarding-skip,.question-selected>button,.question-cancel,.question-like,.question-section-head>button,.question-home-summary>div button,.question-answer-author>button,.explore-search-submit,.search-sort select,.library-sort select{min-height:var(--tap)}.login-prompt-close{width:var(--tap);height:var(--tap)}.onboarding-sheet{border-radius:var(--radius-xl) var(--radius-xl) 0 0}.onboarding-progress,.onboarding-genres button{border-radius:var(--radius-pill)}.onboarding-sheet h2{font-size:var(--fs-section)}.daily-question-head h2{font-size:var(--fs-page)}.feed-memo{font-size:var(--fs-body)}.question-selected>div,.question-selected img{border-radius:var(--radius-sm)}@media (max-width:360px){.daily-question-head h2{font-size:var(--fs-section)}}
