:root{--color-primary: #1e88e5;--color-primary-dark: #1565c0;--color-primary-light: #64b5f6;--color-primary-lighter: #e3f2fd;--color-secondary: #1976d2;--color-bg: #ffffff;--color-bg-light: #f5f5f5;--color-surface: #fafafa;--color-text: #212121;--color-text-secondary: #757575;--color-text-disabled: #bdbdbd;--color-border: #e0e0e0;--color-unread: #ef5350;--color-in-progress: #fdd835;--color-done: #66bb6a;--color-success: #4caf50;--color-error: #f44336;--color-warning: #ff9800;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);--shadow-md: 0 3px 6px rgba(0, 0, 0, .15), 0 2px 4px rgba(0, 0, 0, .12);--shadow-lg: 0 10px 20px rgba(0, 0, 0, .15), 0 3px 6px rgba(0, 0, 0, .1)}:root{--font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75}:root{--space-0: 0;--space-4: .25rem;--space-8: .5rem;--space-12: .75rem;--space-16: 1rem;--space-24: 1.5rem;--space-32: 2rem;--space-40: 2.5rem;--space-48: 3rem}:root{--breakpoint-sm: 640px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-bg-light);margin:0;padding:0}h1{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);margin-bottom:var(--space-24)}h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);margin-bottom:var(--space-16)}h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-12)}p{margin-bottom:var(--space-16)}a{color:var(--color-primary);text-decoration:none;transition:color .2s ease}a:hover{color:var(--color-primary-dark)}input,textarea,select{font-family:inherit;font-size:inherit;border:1px solid var(--color-border);border-radius:4px;padding:var(--space-12) var(--space-16);background-color:var(--color-bg);color:var(--color-text);transition:border-color .2s ease,box-shadow .2s ease}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #1e88e51a}input:disabled,textarea:disabled,select:disabled{background-color:var(--color-bg-light);color:var(--color-text-disabled);cursor:not-allowed}button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;border-radius:4px;padding:var(--space-12) var(--space-24);font-weight:var(--font-weight-medium);transition:all .2s ease}button:disabled{opacity:.5;cursor:not-allowed}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-light)}::-webkit-scrollbar-thumb{background:var(--color-text-disabled);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-secondary)}#root{width:100%;min-height:100vh}.layout{display:flex;flex-direction:column;min-height:100vh;background-color:var(--color-bg-light)}.header{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 100%);color:#fff;padding:var(--space-24);box-shadow:var(--shadow-md);position:sticky;top:0;z-index:100}.header__content{max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-24)}.header__title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:#fff;margin:0}.header__user-selector{display:flex;align-items:center;gap:var(--space-12);flex-wrap:wrap}.header__label{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:#fff}.header__select{padding:var(--space-8) var(--space-16);border:2px solid rgba(255,255,255,.3);border-radius:4px;background-color:#ffffff1a;color:#fff;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all .2s ease}.header__select:hover{background-color:#fff3;border-color:#ffffff80}.header__select:focus{outline:none;background-color:#fff3;box-shadow:0 0 0 3px #ffffff4d}.header__select option{background-color:var(--color-bg);color:var(--color-text)}.header__score{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:#fff;padding:var(--space-8) var(--space-16);background-color:#fff3;border-radius:4px}.nav{display:flex;gap:var(--space-32);padding:var(--space-16) var(--space-24);background-color:var(--color-bg);border-bottom:1px solid var(--color-border);max-width:1400px;margin:0 auto;width:100%;position:sticky;top:80px;z-index:99}.nav__link{padding:var(--space-12) var(--space-16);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-decoration:none;transition:all .2s ease;border-bottom:3px solid transparent;margin-bottom:-3px}.nav__link:hover{color:var(--color-text)}.nav__link--active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.layout__body{flex:1;padding:var(--space-24);max-width:1400px;width:100%;margin:0 auto}.main{background-color:var(--color-bg);border-radius:8px;padding:var(--space-32);box-shadow:var(--shadow-sm)}@media (max-width: var(--breakpoint-md)){.header__content{gap:var(--space-16)}.header__title{font-size:var(--font-size-2xl)}.nav{gap:var(--space-16);padding:var(--space-12) var(--space-16)}.nav__link{padding:var(--space-8) var(--space-12);font-size:var(--font-size-sm)}.layout__body,.main{padding:var(--space-16)}}@media (max-width: var(--breakpoint-sm)){.header{padding:var(--space-16)}.header__content{flex-direction:column;align-items:flex-start}.header__title{font-size:var(--font-size-2xl)}.header__user-selector{width:100%}.header__select{flex:1}.nav{top:70px;gap:var(--space-12);padding:var(--space-8) var(--space-12)}.nav__link{padding:var(--space-8) var(--space-12);font-size:.875rem}}.toast-container{position:fixed;top:var(--space-16);right:var(--space-16);z-index:9999;display:flex;flex-direction:column;gap:var(--space-12)}.toast{display:flex;align-items:center;justify-content:space-between;background-color:var(--color-bg);border-radius:4px;padding:var(--space-16);min-width:300px;box-shadow:var(--shadow-lg);animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}.toast--success{border-left:4px solid var(--color-success)}.toast--error{border-left:4px solid var(--color-error)}.toast--warning{border-left:4px solid var(--color-warning)}.toast--info{border-left:4px solid var(--color-primary)}.toast__message{flex:1;font-size:var(--font-size-sm);color:var(--color-text);margin-right:var(--space-16)}.toast__close{background:none;border:none;color:var(--color-text-secondary);font-size:var(--font-size-lg);cursor:pointer;padding:0;min-width:auto;transition:color .2s ease}.toast__close:hover{color:var(--color-text)}.task-card{display:flex;flex-direction:column;gap:var(--space-16);padding:var(--space-24);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;box-shadow:var(--shadow-sm);cursor:pointer;transition:all .3s ease}.task-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--color-primary-light)}.task-card__header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-16)}.task-card__title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0;flex:1}.task-card__status{padding:var(--space-4) var(--space-12);border-radius:4px;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);white-space:nowrap}.task-card__status--unread{background-color:#ef53501a;color:var(--color-unread)}.task-card__status--in-progress{background-color:#fdd8351a;color:var(--color-in-progress)}.task-card__status--done{background-color:#66bb6a1a;color:var(--color-done)}.task-card__detail{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.task-card__meta{display:flex;gap:var(--space-24);flex-wrap:wrap}.task-card__info{display:flex;gap:var(--space-8);align-items:center}.task-card__info-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.task-card__info-value{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text)}.task-card__footer{display:flex;justify-content:space-between;align-items:center;padding-top:var(--space-12);border-top:1px solid var(--color-border)}.task-card__date{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.task-card__reactions{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-primary);background-color:var(--color-primary-lighter);padding:var(--space-4) var(--space-12);border-radius:4px}@media (max-width: var(--breakpoint-sm)){.task-card{padding:var(--space-16)}.task-card__header{flex-direction:column}.task-card__meta{flex-direction:column;gap:var(--space-12)}}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:var(--space-24)}.loading__spinner{width:48px;height:48px;border:4px solid var(--color-border);border-top:4px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading__text{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.skeleton-card{display:flex;flex-direction:column;gap:var(--space-16);padding:var(--space-24);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;margin-bottom:var(--space-16)}.skeleton-card__header{display:flex;justify-content:space-between;gap:var(--space-16)}.skeleton-card__title{flex:1;height:24px;background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg-light) 50%,var(--color-border) 75%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:4px}.skeleton-card__status{width:80px;height:24px;background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg-light) 50%,var(--color-border) 75%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:4px}.skeleton-card__detail{height:40px;background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg-light) 50%,var(--color-border) 75%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:4px}.skeleton-card__meta{display:flex;gap:var(--space-24)}.skeleton-card__info{flex:1;height:16px;background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg-light) 50%,var(--color-border) 75%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:4px}.skeleton-card__footer{display:flex;justify-content:space-between;padding-top:var(--space-12);border-top:1px solid var(--color-border)}.skeleton-card__date{width:150px;height:14px;background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg-light) 50%,var(--color-border) 75%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:4px}.skeleton-table{display:flex;flex-direction:column;gap:var(--space-12)}.skeleton-table__header{height:48px;background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg-light) 50%,var(--color-border) 75%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:8px}.skeleton-table__row{height:48px;background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg-light) 50%,var(--color-border) 75%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:4px}.task-list-page{display:flex;flex-direction:column;gap:var(--space-24)}.task-list-page__header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-16)}.task-list-page__header h1{margin:0}.task-list-page__add-button{padding:var(--space-12) var(--space-24);background-color:var(--color-primary);color:#fff;border:none;border-radius:4px;font-weight:var(--font-weight-medium);font-size:var(--font-size-base);cursor:pointer;transition:all .2s ease;white-space:nowrap}.task-list-page__add-button:hover{background-color:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.task-list-page__add-button:active{transform:translateY(0)}.task-list-page__form{display:flex;flex-direction:column;gap:var(--space-16);padding:var(--space-24);background-color:var(--color-bg-light);border-radius:8px;border:1px solid var(--color-border)}.task-list-page__form-group{display:flex;flex-direction:column;gap:var(--space-8)}.task-list-page__form-group label{font-weight:var(--font-weight-medium);color:var(--color-text);font-size:var(--font-size-sm)}.task-list-page__form-group input,.task-list-page__form-group textarea,.task-list-page__form-group select{padding:var(--space-12) var(--space-16);border:1px solid var(--color-border);border-radius:4px;font-family:inherit;font-size:var(--font-size-sm);transition:border-color .2s ease}.task-list-page__form-group input:focus,.task-list-page__form-group textarea:focus,.task-list-page__form-group select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #1e88e51a}.task-list-page__form-hint{font-size:.75rem;color:var(--color-text-secondary);margin:0}.task-list-page__form-submit{padding:var(--space-12) var(--space-24);background-color:var(--color-success);color:#fff;border:none;border-radius:4px;font-weight:var(--font-weight-medium);cursor:pointer;transition:all .2s ease;align-self:flex-end}.task-list-page__form-submit:hover{background-color:#45a049;transform:translateY(-2px);box-shadow:var(--shadow-sm)}.task-list-page__error{padding:var(--space-16);background-color:#f443361a;border-left:4px solid var(--color-error);border-radius:4px;color:var(--color-error);font-size:var(--font-size-sm)}.task-list-page__content{min-height:300px}.task-list-page__skeleton{display:flex;flex-direction:column;gap:var(--space-16)}.task-list-page__empty{display:flex;align-items:center;justify-content:center;min-height:300px;text-align:center;color:var(--color-text-secondary)}.task-list-page__list{display:flex;flex-direction:column;gap:var(--space-16)}@media (max-width: var(--breakpoint-sm)){.task-list-page__header{flex-direction:column;align-items:flex-start}.task-list-page__add-button{width:100%}.task-list-page__form{gap:var(--space-12)}.task-list-page__form-submit{width:100%;align-self:stretch}}.reaction-buttons{display:flex;flex-direction:column;gap:var(--space-16);padding:var(--space-24);background-color:var(--color-bg-light);border-radius:8px;border:1px solid var(--color-border)}.reaction-buttons__label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text)}.reaction-buttons__group{display:flex;gap:var(--space-16);flex-wrap:wrap}.reaction-button{display:flex;flex-direction:column;align-items:center;gap:var(--space-8);padding:var(--space-16);background-color:var(--color-bg);border:2px solid var(--color-border);border-radius:8px;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text);cursor:pointer;transition:all .2s ease;min-width:100px}.reaction-button:hover:not(:disabled){border-color:var(--color-primary);background-color:var(--color-primary-lighter);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.reaction-button:active:not(:disabled){transform:translateY(0)}.reaction-button--active{border-color:var(--color-primary);background-color:var(--color-primary);color:#fff;box-shadow:var(--shadow-md)}.reaction-button--active .reaction-button__emoji{transform:scale(1.3)}.reaction-button:disabled{opacity:.5;cursor:not-allowed}.reaction-button--locked{opacity:.4;background-color:var(--color-bg-disabled, #f5f5f5);border-color:var(--color-border-light, #e0e0e0);cursor:not-allowed}.reaction-button--locked:hover{transform:none;box-shadow:none}.reaction-button__emoji{font-size:var(--font-size-2xl);transition:transform .2s ease}.reaction-button__label{font-size:var(--font-size-xs);white-space:nowrap}@media (max-width: var(--breakpoint-sm)){.reaction-buttons__group{gap:var(--space-12)}.reaction-button{min-width:80px;padding:var(--space-12)}.reaction-button__emoji{font-size:var(--font-size-xl)}.reaction-button__label{font-size:.65rem}}.task-detail-page{display:flex;flex-direction:column;gap:var(--space-24);max-width:900px;margin:0 auto}.task-detail-page__back{padding:var(--space-12) var(--space-16);background:none;border:none;color:var(--color-primary);font-weight:var(--font-weight-medium);cursor:pointer;transition:all .2s ease;align-self:flex-start}.task-detail-page__back:hover{color:var(--color-primary-dark);transform:translate(-4px)}.task-detail-page__card{display:flex;flex-direction:column;gap:var(--space-24);padding:var(--space-32);background-color:var(--color-bg);border-radius:8px;box-shadow:var(--shadow-sm)}.task-detail-page__header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-24)}.task-detail-page__title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin:0;flex:1}.task-detail-page__status{padding:var(--space-8) var(--space-16);border-radius:4px;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);white-space:nowrap}.task-detail-page__status--unread{background-color:#ef535026;color:var(--color-unread)}.task-detail-page__status--in_progress{background-color:#fdd83526;color:var(--color-in-progress)}.task-detail-page__status--done{background-color:#66bb6a26;color:var(--color-done)}.task-detail-page__meta{display:flex;gap:var(--space-32);flex-wrap:wrap;padding-bottom:var(--space-16);border-bottom:1px solid var(--color-border)}.task-detail-page__info{display:flex;gap:var(--space-12);align-items:center}.task-detail-page__label{font-weight:var(--font-weight-medium);color:var(--color-text-secondary);font-size:var(--font-size-sm)}.task-detail-page__value{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text)}.task-detail-page__detail-section,.task-detail-page__deadline-section{display:flex;flex-direction:column;gap:var(--space-12)}.task-detail-page__detail-section h2,.task-detail-page__deadline-section h2{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0;color:var(--color-text)}.task-detail-page__detail-text,.task-detail-page__deadline-text{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text);margin:0;padding:var(--space-16);background-color:var(--color-bg-light);border-radius:4px}.task-detail-page__created-section{display:flex;gap:var(--space-16);align-items:center;padding:var(--space-12) 0;border-top:1px solid var(--color-border);font-size:var(--font-size-sm)}.task-detail-page__created-label{font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.task-detail-page__created-value{color:var(--color-text)}.task-detail-page__reactions{margin-top:var(--space-16)}.task-detail-page__completed-notice{margin-top:var(--space-16);padding:var(--space-12);background-color:#4caf501a;border-left:4px solid var(--color-done);color:var(--color-text-secondary);font-size:var(--font-size-sm);border-radius:4px}.task-detail-page__error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-16);min-height:400px;text-align:center;color:var(--color-text-secondary)}.task-detail-page__error p{margin:0}.task-detail-page__back-button{padding:var(--space-12) var(--space-24);background-color:var(--color-primary);color:#fff;border:none;border-radius:4px;font-weight:var(--font-weight-medium);cursor:pointer;transition:all .2s ease}.task-detail-page__back-button:hover{background-color:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-sm)}@media (max-width: var(--breakpoint-sm)){.task-detail-page__card{padding:var(--space-16);gap:var(--space-16)}.task-detail-page__header{flex-direction:column;gap:var(--space-12)}.task-detail-page__title{font-size:var(--font-size-2xl)}.task-detail-page__meta{gap:var(--space-16)}}.ranking-table-wrapper{overflow-x:auto;border-radius:8px;box-shadow:var(--shadow-sm)}.ranking-table{width:100%;border-collapse:collapse;background-color:var(--color-bg)}.ranking-table thead{background:linear-gradient(90deg,var(--color-primary) 0%,var(--color-secondary) 100%);color:#fff;font-weight:var(--font-weight-semibold)}.ranking-table th{padding:var(--space-16) var(--space-24);text-align:left;font-size:var(--font-size-sm)}.ranking-table td{padding:var(--space-16) var(--space-24);border-bottom:1px solid var(--color-border);font-size:var(--font-size-sm)}.ranking-table tbody tr{transition:background-color .2s ease}.ranking-table tbody tr:hover{background-color:var(--color-bg-light)}.ranking-table tbody tr:last-child td{border-bottom:none}.ranking-table__row--highlight{background-color:#1e88e50d}.ranking-table__row--highlight:hover{background-color:#1e88e51a}.ranking-table__col--rank{width:80px;text-align:center}.ranking-table__col--name{width:200px}.ranking-table__col--score{width:150px;text-align:right}.ranking-table__col--change{width:120px;text-align:center}.ranking-table__col--avg-time{width:150px;text-align:center}.ranking-table__medal{font-size:var(--font-size-xl)}.ranking-table__rank-number{font-weight:var(--font-weight-semibold);color:var(--color-text-secondary)}.ranking-table__name{font-weight:var(--font-weight-medium);color:var(--color-text)}.ranking-table__score{font-weight:var(--font-weight-semibold);font-size:var(--font-size-base);color:var(--color-primary)}.ranking-table__trend-icon{font-weight:var(--font-weight-bold);margin-right:var(--space-4)}.ranking-table__col--change.trend--up{color:var(--color-success)}.ranking-table__col--change.trend--down{color:var(--color-error)}.ranking-table__col--change.trend--flat{color:var(--color-text-secondary)}.ranking-table__trend-value{font-weight:var(--font-weight-medium)}.ranking-table__avg-time{color:var(--color-text-secondary)}@media (max-width: var(--breakpoint-md)){.ranking-table th,.ranking-table td{padding:var(--space-12) var(--space-12);font-size:.875rem}.ranking-table__col--rank{width:60px}.ranking-table__col--name{width:auto;min-width:150px}.ranking-table__col--score{width:120px}.ranking-table__col--change{width:100px}.ranking-table__col--avg-time{width:140px}}@media (max-width: var(--breakpoint-sm)){.ranking-table th,.ranking-table td{padding:var(--space-8) var(--space-8);font-size:.75rem}.ranking-table__medal{font-size:var(--font-size-base)}.ranking-table__col--change{font-size:.7rem}}.ranking-page{display:flex;flex-direction:column;gap:var(--space-32)}.ranking-page h1{margin:0}.ranking-page__tabs{display:flex;gap:var(--space-16);border-bottom:2px solid var(--color-border)}.ranking-page__tab{padding:var(--space-16) var(--space-24);background:none;border:none;border-bottom:3px solid transparent;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);cursor:pointer;transition:all .2s ease;margin-bottom:-2px}.ranking-page__tab:hover:not(:disabled){color:var(--color-text)}.ranking-page__tab--active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.ranking-page__tab:disabled{opacity:.5;cursor:not-allowed}.ranking-page__top3{display:flex;flex-direction:column;gap:var(--space-16)}.ranking-page__top3 h2{margin:0}.ranking-page__podium{display:flex;align-items:flex-end;justify-content:center;gap:var(--space-24);min-height:300px}.ranking-page__podium-item{display:flex;flex-direction:column;align-items:center;gap:var(--space-12);padding:var(--space-24);border-radius:8px;text-align:center;transition:all .3s ease}.ranking-page__podium-item--gold{order:2;width:180px;height:320px;background:linear-gradient(135deg,gold,#ffed4e);box-shadow:0 8px 16px #ffd7004d;justify-content:flex-end}.ranking-page__podium-item--silver{order:1;width:160px;background:linear-gradient(135deg,silver,#e8e8e8);box-shadow:0 6px 12px #c0c0c04d;height:260px;justify-content:flex-end}.ranking-page__podium-item--bronze{order:3;width:160px;background:linear-gradient(135deg,#cd7f32,#e8a76d);box-shadow:0 6px 12px #cd7f324d;height:220px;justify-content:flex-end}.ranking-page__podium-item:hover{transform:translateY(-4px)}.ranking-page__medal{font-size:3rem}.ranking-page__name{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0}.ranking-page__podium-score{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0;color:#333}.ranking-page__podium-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:#666}.ranking-page__error{padding:var(--space-16);background-color:#f443361a;border-left:4px solid var(--color-error);border-radius:4px;color:var(--color-error);font-size:var(--font-size-sm)}.ranking-page__empty{display:flex;align-items:center;justify-content:center;min-height:300px;text-align:center;color:var(--color-text-secondary)}@media (max-width: var(--breakpoint-md)){.ranking-page__podium{gap:var(--space-16);min-height:250px}.ranking-page__podium-item{padding:var(--space-16)}.ranking-page__podium-item--gold{width:150px}.ranking-page__podium-item--silver{width:140px;height:220px}.ranking-page__podium-item--bronze{width:140px;height:180px}.ranking-page__medal{font-size:2rem}.ranking-page__name{font-size:var(--font-size-base)}.ranking-page__podium-score{font-size:var(--font-size-xl)}}@media (max-width: var(--breakpoint-sm)){.ranking-page__tabs{gap:var(--space-8)}.ranking-page__tab{padding:var(--space-12) var(--space-16);font-size:var(--font-size-sm)}.ranking-page__podium{gap:var(--space-12);min-height:200px}.ranking-page__podium-item{padding:var(--space-12);gap:var(--space-8)}.ranking-page__podium-item--gold{width:120px}.ranking-page__podium-item--silver{width:110px;height:170px}.ranking-page__podium-item--bronze{width:110px;height:140px}.ranking-page__medal{font-size:1.5rem}.ranking-page__name{font-size:.875rem}.ranking-page__podium-score{font-size:var(--font-size-lg)}.ranking-page__podium-label{font-size:.75rem}}.not-found{display:flex;align-items:center;justify-content:center;min-height:80vh;padding:var(--space-24)}.not-found__content{text-align:center}.not-found__title{font-size:6rem;font-weight:var(--font-weight-bold);color:var(--color-primary);margin:0 0 var(--space-16) 0;line-height:1}.not-found__message{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--space-8) 0}.not-found__description{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0 0 var(--space-32) 0;line-height:var(--line-height-relaxed)}.not-found__button{display:inline-block;padding:var(--space-12) var(--space-32);background-color:var(--color-primary);color:#fff;border-radius:4px;font-weight:var(--font-weight-medium);transition:all .2s ease;text-decoration:none}.not-found__button:hover{background-color:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}