@charset "UTF-8";:root{--guitar-sunset-dark: #e25822;--guitar-sunset-light: #ff7e30;--guitar-wood: #a65c32;--guitar-neck: #7f4f24;--text-on-sunset: #ffffff;--text-dark: #333333;--background-light: #faf8f4;--card-bg: #ffffff;--bg-color: var(--background-light);--text-color: var(--text-dark);--card-background: var(--card-bg);--border-color: #ddd;--input-bg: #ddd;--divider-color: #eee;--control-bg: #ffffff;--surface-muted: #f5f5f5;--surface-hover: #f0f0f0;--text-muted: #666;--text-muted-strong: #444;--status-in-tune: #2e7d32;--status-error: #c62828;--heading-color: var(--guitar-wood);--subheading-color: var(--guitar-neck)}.dark-theme{--bg-color: #1e1e1e;--text-color: #f0f0f0;--card-background: #2d2d2d;--border-color: #444;--input-bg: #3d3d3d;--divider-color: #444;--control-bg: #2d2d2d;--surface-muted: #333333;--surface-hover: #3d3d3d;--text-muted: #b0b0b0;--text-muted-strong: #d0d0d0;--status-in-tune: #66bb6a;--status-error: #ef5350;--heading-color: #f0f0f0;--subheading-color: #f0f0f0}html,body{height:100%;margin:0;padding:0;overflow:hidden}body{font-family:Roboto,\5fae\8f6f\96c5\9ed1,sans-serif;color:var(--text-color);background-color:var(--bg-color);transition:background-color .3s,color .3s}.app-container{display:flex;height:100%;overflow:hidden}.main-content{flex:1;padding:20px;box-sizing:border-box;height:100%;overflow-y:auto}.page-container{max-width:800px;margin:0 auto;box-sizing:border-box;height:100%;display:flex;flex-direction:column}.sidebar{width:250px;background:linear-gradient(to bottom,var(--guitar-wood),var(--guitar-neck));padding:20px;color:var(--text-on-sunset)}.sidebar .logo{margin-bottom:30px}.sidebar .logo h1{margin:0;font-size:24px;color:var(--text-on-sunset);text-shadow:1px 1px 2px rgba(0,0,0,.3)}.sidebar .nav-links{list-style:none;padding:0}.sidebar .nav-links li{margin-bottom:10px}.sidebar .nav-links a{display:block;padding:10px;color:var(--text-on-sunset);text-decoration:none;border-radius:4px;transition:background-color .3s,color .3s}.sidebar .nav-links a:hover{background-color:#ffffff1a}.sidebar .nav-links a.active{background-color:var(--guitar-sunset-light);color:var(--text-on-sunset);font-weight:500}.card{background-color:var(--card-background);border-radius:8px;padding:20px;margin-top:20px;box-shadow:0 2px 4px #0000001a;border-top:3px solid var(--guitar-sunset-dark)}.btn{background-color:var(--guitar-sunset-dark);color:var(--text-on-sunset);border:none;padding:8px 16px;border-radius:4px;cursor:pointer;transition:background-color .3s}.btn:hover{background-color:var(--guitar-sunset-light)}h2{color:var(--heading-color);border-bottom:2px solid var(--divider-color);padding-bottom:10px}h3{color:var(--subheading-color)}.stats{display:flex;justify-content:space-between;margin-top:15px}.stat-item{text-align:center;flex:1}.stat-value{font-size:24px;font-weight:700;color:var(--guitar-sunset-dark)}.stat-label{font-size:14px;color:var(--text-color);margin-top:5px}@media screen and (max-width: 768px){.app-container{flex-direction:column}.sidebar{width:100%;border-right:none;border-bottom:1px solid rgba(255,255,255,.2)}.nav-links{display:flex;gap:10px}.nav-links li{margin-bottom:0}}.round-button{width:40px;height:40px;border-radius:50%;border:none;background-color:var(--guitar-sunset-dark);color:var(--text-on-sunset);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s,background-color .3s;box-shadow:0 2px 4px #0003}.round-button:hover{background-color:var(--guitar-sunset-light);transform:scale(1.1)}.round-button .icon{font-size:20px;line-height:1}