:root{--primary-color: #006AB1;--white: #ffffff;--red: #ff4444;--green: #44ff44;--light-gray: #f5f5f5;--dark-gray: #333333;--border-color: #e0e0e0}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:var(--light-gray);background-image:url(/assets/logo-f551b94a.svg);background-repeat:no-repeat;background-position:center;background-size:300px;background-attachment:fixed;background-opacity:.1;color:var(--dark-gray);line-height:1.6}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:url(/assets/logo-f551b94a.svg);background-repeat:no-repeat;background-position:center;background-size:300px;opacity:.1;z-index:-1;pointer-events:none}#app{min-height:100vh;display:flex;flex-direction:column}.header{background-color:var(--primary-color);color:var(--white);padding:1rem 2rem;box-shadow:0 2px 10px #0000001a}.header-content{display:flex;justify-content:center;align-items:center;gap:1rem;margin-bottom:1rem}.logo{height:50px;width:auto;filter:brightness(0) invert(1)}.app-title{font-size:2rem;font-weight:700;margin:0;text-align:center}.refresh-info{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.action-buttons{display:flex;gap:1rem;align-items:center}.last-refresh{font-size:.9rem;opacity:.9;margin:0}.refresh-btn{background-color:var(--white);color:var(--primary-color);border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-weight:700;display:flex;align-items:center;gap:.5rem;transition:all .3s ease}.refresh-btn:hover:not(:disabled){background-color:var(--light-gray);transform:translateY(-1px)}.refresh-btn:disabled{opacity:.6;cursor:not-allowed}.download-btn{background-color:var(--dark-gray);color:var(--white);border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-weight:700;text-decoration:none;display:flex;align-items:center;gap:.5rem;transition:all .3s ease;animation:blink-blue 2s infinite}.download-btn:hover{background-color:var(--primary-color);transform:translateY(-1px);animation:none}.btn-icon{width:20px;height:20px;filter:brightness(0) invert(1)}@keyframes blink-blue{0%,50%{background-color:var(--dark-gray)}25%,75%{background-color:var(--primary-color)}}.main-content{flex:1;padding:1rem;max-width:1400px;margin:0 auto;width:100%}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;text-align:center}.logo-loader{margin-bottom:1rem}.spinning-logo{width:60px;height:60px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error{text-align:center;padding:2rem;background-color:#fff5f5;border:1px solid var(--red);border-radius:8px;color:var(--red)}.retry-btn{background-color:var(--red);color:var(--white);border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;margin-top:1rem;transition:background-color .3s ease}.retry-btn:hover{background-color:#c33}.ranking-container{background-color:#fffffff2;border-radius:12px;box-shadow:0 4px 20px #0000001a;overflow:hidden;margin:0 auto;width:fit-content;max-width:100%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.ranking-title{background-color:var(--primary-color);color:var(--white);padding:1.5rem;margin:0;font-size:1.5rem;text-align:center}.ranking-table{display:flex;flex-direction:column}.table-header{display:grid;grid-template-columns:80px 200px 200px 120px 180px 160px;background-color:var(--light-gray);font-weight:700;border-bottom:2px solid var(--border-color);min-width:960px;max-width:1040px}.header-cell{padding:1rem;text-align:center;border-right:1px solid var(--border-color)}.header-cell:last-child{border-right:none}.table-row{display:grid;grid-template-columns:80px 200px 200px 120px 180px 160px;border-bottom:1px solid var(--border-color);transition:background-color .3s ease;min-width:960px;max-width:1040px}.table-row:hover{background-color:#f8f9fa}.table-row.top-three{background-color:#fff8e1}.table-row.top-three:hover{background-color:#fff3c4}.cell{padding:1rem;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--border-color)}.cell:last-child{border-right:none}.cell.code{font-family:Courier New,monospace;font-weight:700;font-size:.9rem;color:var(--primary-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cell.name{justify-content:flex-start;font-weight:500}.cell.amount{font-weight:700;font-size:1.1rem;color:var(--primary-color);white-space:nowrap}.rank-number{font-weight:700;font-size:1.2rem}.medal{margin-left:.5rem;font-size:1.2rem}.trend-up{color:var(--green)}.trend-down{color:var(--red)}.trend-stable{color:var(--dark-gray)}.trend-indicator{font-size:1.2rem;font-weight:700}@media (max-width: 1024px){.main-content{padding:.5rem}.ranking-container{overflow-x:auto}.ranking-table{min-width:960px}}@media (max-width: 768px){.header{padding:1rem}.app-title{font-size:1.5rem}.main-content{padding:.5rem}.ranking-container{margin:0;border-radius:0;overflow-x:auto}.ranking-table{min-width:790px}.table-header,.table-row{grid-template-columns:80px 130px 200px 120px 160px 100px;min-width:790px}.header-cell,.cell{padding:.75rem .5rem;font-size:.9rem}.cell.code{font-size:.85rem}.refresh-info{flex-direction:column;align-items:flex-start;gap:.5rem}.action-buttons{flex-direction:column;align-items:flex-end;gap:.5rem}.refresh-btn,.download-btn{align-self:flex-end}}@media (max-width: 480px){.header{padding:.5rem}.app-title{font-size:1.2rem}.main-content{padding:.25rem}.ranking-container{border-radius:0;overflow-x:auto}.ranking-table{min-width:720px}.table-header,.table-row{grid-template-columns:70px 120px 180px 110px 150px 90px;min-width:720px}.header-cell,.cell{padding:.5rem .25rem;font-size:.8rem}.cell.code{font-size:.8rem}.trend-indicator,.medal{font-size:1rem}.refresh-info{flex-direction:column;align-items:center;text-align:center}.action-buttons{flex-direction:column;align-items:center;gap:.5rem}.refresh-btn,.download-btn{align-self:center;font-size:.9rem;padding:.4rem .8rem}}@media (max-width: 320px){.table-header,.table-row{grid-template-columns:60px 110px 160px 100px 130px 80px;min-width:640px}.ranking-table{min-width:640px}.header-cell,.cell{padding:.4rem .2rem;font-size:.75rem}.cell.code{font-size:.75rem}.trend-indicator,.medal{font-size:.9rem}}
