@layer components{@layer reset{.comments-page input,.comments-page textarea,.comments-page button,.comments-page select{font-family:inherit;font-size:inherit;color:inherit;box-shadow:none;border:none;outline:none}}@layer layout{.comments-page{padding:var(--space-xl) 0 120px;margin:0 auto}.comments-section{margin-top:var(--space-xl);flex-direction:column;display:flex}#comment-input-container{order:1;margin-bottom:0}#comments-list-container{order:2}.comments-page__header{gap:var(--space-lg);margin-bottom:var(--space-lg);text-align:left;flex-direction:column;display:flex}.comments-page__header-top{justify-content:space-between;align-items:center;gap:var(--space-sm);display:flex}.comments-page__back-link{color:var(--color-muted);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);transition:transform var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:6px;text-decoration:none;display:inline-flex}.comments-page__back-link:active{transform:scale(.98)}.comments-page__back-icon{transition:transform var(--dur-fast) var(--ease-standard);justify-content:center;align-items:center;display:inline-flex}.comments-page__back-icon svg,.comments-page__back-text{color:inherit}@media (hover:hover){.comments-page__back-link:hover{color:var(--color-link-hover)}.comments-page__back-link:hover .comments-page__back-icon{transform:translate(-3px)}}.comments-page__title{font-family:var(--font-display);font-size:var(--text-h2);line-height:var(--leading-tight);color:var(--color-text);margin:0}.day-nav{align-items:center;gap:4px;display:inline-flex}.day-nav__btn{border-radius:var(--radius-full);background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-muted);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);transition:all var(--dur-fast) var(--ease-standard);cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;gap:6px;padding:6px 12px;text-decoration:none;display:inline-flex}.day-nav__btn:hover{border-color:var(--color-border-hover);color:var(--color-text)}.day-nav__btn:active{transform:scale(.98)}@media (width<=600px){.day-nav__btn{width:32px;height:32px;padding:0}.day-nav__btn-text{display:none}}.comments-section-title{align-items:center;gap:var(--space-md);margin-bottom:var(--space-md);display:flex}.comments-section-title h2{font-family:var(--font-display);font-size:var(--text-h3);color:var(--color-text);margin:0}.comments-section-title svg{color:var(--color-accent-primary)}.focus-return-btn{background:rgba(var(--color-accent-primary-rgb), .05);border:1px solid var(--color-accent-primary);font-weight:var(--font-weight-bold);color:var(--color-accent-text);border-radius:var(--radius-full);transition:all var(--dur-fast) var(--ease-standard);align-items:center;gap:8px;padding:8px 16px;text-decoration:none;display:flex}@media (hover:hover){.focus-return-btn:hover{background:rgba(var(--color-accent-primary-rgb), .1)}}@media (width<=600px){.comments-page{padding-bottom:var(--bottom-bar-offset)}.comments-section-title{margin-bottom:var(--space-md)}}}@layer elements,capsule,thread,card,legacy;}
