:root{--bg-dark:#121212;--bg-panel:#1e1e1e;--bg-card:#2a2a2a;--accent:#d4af37;--accent-hover:#f0c040;--text-main:#e0e0e0;--text-muted:#a0a0a0;--border:#333;--shadow:0 4px 12px #00000080;--font-header:"Cinzel", serif;--font-body:"Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}.skip-link{z-index:1000;background:var(--accent);color:#000;border-radius:6px;padding:.65rem 1rem;position:fixed;top:.5rem;left:.5rem;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}body{background-color:var(--bg-dark);color:var(--text-main);font-family:var(--font-body);height:100vh;overflow:hidden}.app-container{height:100vh;display:flex}.sidebar{background-color:var(--bg-panel);border-right:1px solid var(--border);z-index:100;white-space:nowrap;flex-direction:column;width:300px;transition:all .3s;display:flex}@media (width>=769px){.sidebar.desktop-collapsed{border-right:none;width:0;padding:0;overflow:hidden}}.sidebar-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1.5rem;display:flex}.header-controls{gap:10px;display:flex}.sidebar-header h2{font-family:var(--font-header);color:var(--accent)}#collapse-sidebar{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1rem}#collapse-sidebar:hover{color:var(--accent)}.letter-nav{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:center;gap:4px;padding:.5rem;display:flex}.letter-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:4px;padding:2px 6px;font-size:.8rem}.letter-btn:hover,.letter-btn.active{color:var(--accent);border-color:var(--accent)}#keyword-list{flex:1;list-style:none;overflow-y:auto}.list-item{cursor:pointer;width:100%;color:inherit;font:inherit;text-align:left;background:0 0;border-top:0;border-bottom:1px solid #252525;border-left:4px solid #0000;border-right:0;padding:10px 20px;transition:background .2s;display:block}.list-item:hover{background-color:var(--bg-card)}.list-item.active{background-color:var(--bg-card);border-left:4px solid var(--accent);color:var(--accent)}button:focus-visible,a:focus-visible,input:focus-visible,#keyword-title:focus-visible{outline:3px solid var(--accent-hover);outline-offset:3px}.main-content{flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.top-bar{background-color:var(--bg-panel);border-bottom:1px solid var(--border);align-items:center;gap:1rem;padding:1rem 2rem;display:flex}.sidebar-toggle-wrapper{align-items:center;display:flex}#expand-sidebar{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:4px;padding:5px 10px;font-size:1rem}#expand-sidebar[hidden]{display:none!important}#expand-sidebar:hover{color:var(--accent);border-color:var(--accent)}.search-container{flex:1;max-width:600px;margin:0 auto;position:relative}#search-input{border:1px solid var(--border);background-color:var(--bg-dark);width:100%;color:var(--text-main);border-radius:25px;outline:none;padding:12px 40px 12px 20px;font-size:1rem;transition:border-color .2s}#search-input:focus{border-color:var(--accent)}.search-icon{color:var(--text-muted);position:absolute;top:50%;right:15px;transform:translateY(-50%)}.content-scroll-area{flex:1;justify-content:center;padding:.2rem 1.25rem 1rem;display:flex;overflow-y:auto}.card-display{flex-direction:column;gap:.25rem;width:100%;max-width:1000px;display:flex}.nav-controls{justify-content:space-between;align-items:center;display:flex}.nav-btn{background-color:var(--bg-card);border:1px solid var(--border);color:var(--text-main);cursor:pointer;border-radius:8px;padding:10px 20px;font-weight:600;transition:all .2s}.nav-btn:hover{background-color:var(--accent);color:#000;border-color:var(--accent)}#current-index{color:var(--text-muted);font-family:var(--font-body)}.keyword-card{background:linear-gradient(145deg, var(--bg-card), #222);border:1px solid var(--border);text-align:center;box-shadow:var(--shadow);border-radius:16px;flex-direction:column;gap:.65rem;padding:1rem;display:flex;position:relative}.keyword-card h1{font-family:var(--font-header);color:var(--accent);text-shadow:0 2px 4px #000c;margin-bottom:.5rem;font-size:3rem}.definition-section{background-color:#0003;border:1px solid #ffffff0d;border-radius:8px;padding:.65rem}.section-label{font-family:var(--font-header);color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid var(--border);margin-bottom:.8rem;padding-bottom:.2rem;font-size:.9rem;display:inline-block}.official-text{color:#ccc;font-family:Inter,sans-serif;font-size:1.2rem;font-style:italic;line-height:1.5}.beginner-text{color:#fff;font-family:Inter,sans-serif;font-size:1.4rem;font-weight:400;line-height:1.5}.source-text{color:var(--text-muted);font-family:Inter,sans-serif;font-size:.95rem;line-height:1.4}.source-text a{color:#8ae;border-bottom:1px solid #88aaee59;text-decoration:none}.source-text a:hover{color:#aac4ff;border-bottom-color:#aac4ff}.examples-section h3{font-family:var(--font-header);color:var(--text-muted);border-bottom:1px solid var(--border);text-align:center;margin-bottom:.35rem;padding-bottom:.5rem}.cards-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));justify-items:center;gap:20px;display:grid}.mtg-card-img{cursor:pointer;border-radius:4.5%/3.5%;width:100%;max-width:250px;transition:transform .2s;box-shadow:0 4px 8px #00000080}.mtg-card-link{border-radius:4.5%/3.5%;width:100%;max-width:250px;display:block}.mtg-card-link:hover .mtg-card-img,.mtg-card-link:focus-visible .mtg-card-img{z-index:10;transform:scale(1.05)}.cards-status{color:var(--text-muted);text-align:center;grid-column:1/-1}.cards-status-error{color:#ff8a8a}.retry-button{border:1px solid var(--accent);background:var(--bg-card);color:var(--text-main);cursor:pointer;border-radius:6px;grid-column:1/-1;padding:.6rem 1rem}.retry-button:hover{background:var(--accent);color:#000}.loading-spinner{border:4px solid #ffffff1a;border-left-color:var(--accent);border-radius:50%;width:36px;height:36px;margin:20px auto;animation:1s linear infinite spin;display:none}.cards-grid .loading-spinner{grid-column:1/-1;display:block}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.mobile-only{display:none}.desktop-only{display:block}@media (width<=768px){.mobile-only{display:block}.desktop-only{display:none!important}.app-container{position:relative}.sidebar{white-space:normal;border-right:1px solid #333;width:min(300px,85vw);max-width:85%;height:auto;transition:transform .3s;position:fixed;top:0;bottom:0;left:0;overflow:hidden;transform:translate(-100%);box-shadow:2px 0 10px #000c}.sidebar.open{transform:translate(0,0)}#keyword-list{min-width:0;overflow-x:hidden}#keyword-list>li{display:block}.top-bar{gap:.5rem;padding:1rem}#menu-toggle{color:var(--accent);cursor:pointer;background:0 0;border:none;padding-right:10px;font-size:1.5rem}#close-sidebar{color:var(--text-main);cursor:pointer;background:0 0;border:none;font-size:2rem}.keyword-card{padding:1rem}.keyword-card h1{font-size:2rem}.keyword-card p{font-size:1.1rem}#search-input{font-size:16px}}