:root{--md3-color-primary: #000000;--md3-color-primary-variant: #333333;--md3-color-secondary: #808080;--md3-color-background: #FFFFFF;--md3-color-surface: #F5F5F5;--md3-color-error: #B00020;--md3-color-on-primary: #FFFFFF;--md3-color-on-secondary: #000000;--md3-color-on-background: #000000;--md3-color-on-surface: #000000;--md3-color-on-error: #FFFFFF}.dark-theme{--md3-color-primary: #FFFFFF;--md3-color-primary-variant: #CCCCCC;--md3-color-secondary: #A9A9A9;--md3-color-background: #121212;--md3-color-surface: #1E1E1E;--md3-color-error: #CF6679;--md3-color-on-primary: #000000;--md3-color-on-secondary: #000000;--md3-color-on-background: #E0E0E0;--md3-color-on-surface: #E0E0E0;--md3-color-on-error: #000000}body{min-height:100vh;transition:color .5s,background-color .5s;line-height:1.6;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:18px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--md3-color-background);color:var(--md3-color-on-background)}h2{font-weight:500;color:var(--md3-color-primary);text-align:center}header{display:flex;flex-direction:column;align-items:center}.button-group{display:flex;gap:10px;justify-content:center;margin-top:10px}.button-group button{padding:10px 20px;font-size:16px;font-weight:500;color:var(--md3-color-on-primary);background-color:var(--md3-color-primary);border:none;border-radius:4px;cursor:pointer;transition:background-color .3s}.button-group button:hover{background-color:var(--md3-color-primary-variant)}.menu{position:absolute;background-color:var(--md3-color-surface);border:1px solid var(--md3-color-on-surface);box-shadow:0 2px 5px #0003;z-index:100}.menu ul{list-style:none;padding:10px;margin:0}.menu li{padding:8px 12px;cursor:pointer}.menu li:hover{background-color:var(--md3-color-primary);color:var(--md3-color-on-primary)}.filter-container{display:flex;flex-direction:column;gap:15px;padding:20px;background-color:var(--md3-color-surface);border:1px solid var(--md3-color-on-surface);box-shadow:0 2px 5px #0003;margin-top:20px}.filter-group{display:flex;flex-direction:column;gap:15px}.horizontal-scroll{display:flex;flex-wrap:wrap;gap:10px;padding:10px 0}.horizontal-scroll span{padding:8px 16px;font-size:14px;font-weight:500;border:1px solid var(--md3-color-on-surface);border-radius:4px;background-color:var(--md3-color-surface);color:var(--md3-color-on-surface);cursor:pointer;white-space:nowrap;transition:background-color .3s}.horizontal-scroll span.selected{background-color:var(--md3-color-primary);color:var(--md3-color-on-primary)}.horizontal-scroll span:hover{background-color:var(--md3-color-primary-variant);color:var(--md3-color-on-primary)}.filter-container button{padding:10px 20px;font-size:16px;font-weight:500;color:var(--md3-color-on-primary);background-color:var(--md3-color-primary);border:none;border-radius:4px;cursor:pointer;transition:background-color .3s}.filter-container button:hover{background-color:var(--md3-color-primary-variant)}.chart-container{position:relative;max-width:100%;height:80vh;display:flex;flex-direction:column;align-items:center}#readingChart{width:100%;height:100%}footer{margin-top:auto;text-align:center;padding:10px 0;background-color:var(--md3-color-surface);color:var(--md3-color-on-surface)}footer p{margin:0}footer a{color:var(--md3-color-primary);text-decoration:none;margin:0 5px}footer a:hover{text-decoration:underline}.recommend-page{padding:16px;background-color:transparent;color:var(--md3-color-on-surface)}.recommend-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.btn{padding:10px 18px;font-size:16px;font-weight:500;border-radius:4px;cursor:pointer;border:none;transition:background-color .3s,color .3s}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background-color:var(--md3-color-primary);color:var(--md3-color-on-primary)}.btn-primary:hover:not(:disabled){background-color:var(--md3-color-primary-variant)}.btn-outline{background:transparent;color:var(--md3-color-primary);border:1px solid var(--md3-color-primary)}.btn-outline:hover:not(:disabled){background:var(--md3-color-surface)}.recommend-form input{padding:8px 12px;height:40px;line-height:24px;border:1px solid rgba(0,0,0,.12);border-radius:6px;background:var(--md3-color-background);color:var(--md3-color-on-background);box-sizing:border-box}.recommend-form input::placeholder{color:#00000059}.dark-theme .recommend-form input::placeholder{color:#ffffff59}.recommend-form input:focus{outline:none;border-color:var(--md3-color-primary);box-shadow:0 0 0 4px #0000000a}.recommend-form input:disabled{background:var(--md3-color-surface);opacity:.7;cursor:not-allowed}.recommend-form>input,.recommend-form>.group-select{min-width:160px}@media (max-width: 720px){.recommend-form{flex-direction:column;align-items:stretch}.recommend-form>input{width:100%}.recommend-form .btn{width:100%}}.recommend-table{width:100%;border-collapse:collapse;background:transparent}.recommend-table th,.recommend-table td{padding:8px 10px;border-bottom:1px solid rgba(0,0,0,.06);vertical-align:top;color:var(--md3-color-on-surface)}.dark-theme .recommend-table th,.dark-theme .recommend-table td{border-bottom:1px solid rgba(255,255,255,.06)}.recommend-table a{color:var(--md3-color-primary);font-weight:600;text-decoration:none}.sub-text{color:var(--md3-color-secondary);font-size:12px}.tag-explore{display:inline-block;margin-top:6px;background:#ffd580;padding:2px 6px;border-radius:4px;font-size:12px}.reason-tag{display:inline-block;margin:2px 4px;padding:2px 6px;background:var(--md3-color-surface);border-radius:4px;font-size:12px;color:var(--md3-color-on-surface)}.empty-holder{padding:40px;text-align:center;color:var(--md3-color-secondary)}@media (max-width: 720px){.recommend-table thead{display:none}.recommend-table tr{display:block;margin-bottom:12px}.recommend-table td{display:block}}