:root{font-family:Inter,Segoe UI,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#232323;background-color:#f7f2e7;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background:#f7f2e7}#root{width:100%;min-height:100vh}.container{max-width:1400px;margin:0 auto;padding:0 1rem}.card{background:#fffdfa;border:1px solid #e5e1d8;border-radius:18px;box-shadow:0 4px 24px #2c272112;padding:1.5rem;margin:1rem 0;transition:box-shadow .3s ease,transform .3s ease}.card:hover{transform:translateY(-2px) scale(1.01);box-shadow:0 8px 32px #2c272121}.btn{background:#232323;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:10px;cursor:pointer;font-weight:600;transition:background .2s,box-shadow .2s,transform .2s;text-decoration:none;display:inline-block;box-shadow:0 2px 8px #2c272112}.btn:hover{background:#444;transform:translateY(-1px) scale(1.01);box-shadow:0 4px 16px #2c272121}.btn-secondary{background:#fffdfa;color:#232323;border:1px solid #e5e1d8}.btn-secondary:hover{background:#ece6d9}.input{background:#fffdfa;border:1px solid #e5e1d8;border-radius:10px;padding:.75rem;color:#232323;font-size:1rem;width:100%;transition:border .2s,box-shadow .2s}.input:focus{outline:none;border-color:#232323;box-shadow:0 0 0 2px #e5e1d8}.input::placeholder{color:#b8b2a7}.grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.header{background:#f7f2e7;padding:1rem 0;position:sticky;top:0;z-index:100}.header-content{display:flex;justify-content:space-between;align-items:center}.header-left{display:flex;align-items:center;gap:1rem;margin-left:-3rem;padding-left:0}.logo{font-size:1.7rem;font-weight:700;color:#232323;text-decoration:none;display:flex;align-items:center;gap:.5rem;border-radius:12px}.nav{display:flex;gap:1rem;align-items:center}.shortcut-key{background:#ece6d9;border:1px solid #e5e1d8;border-radius:6px;padding:.25rem .7rem;font-family:Courier New,monospace;font-size:.95rem;color:#232323;display:inline-block;margin:.25rem;box-shadow:0 1px 4px #2c27210a}.shortcut-key.glow{box-shadow:0 0 8px 2px #ffe9a7,0 1px 4px #2c27210a;background:#fffbe6}.shortcut-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem;background:#f7f2e7;border-radius:8px;margin:.5rem 0}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .5s ease-out}@media (max-width: 768px){.container{padding:0 1rem}.header-content{flex-direction:column;gap:1rem}.nav{flex-wrap:wrap;gap:.5rem}.grid{grid-template-columns:1fr;gap:1rem}.about-grid{grid-template-columns:1fr!important;gap:2rem!important}.about-header{flex-direction:column!important;align-items:flex-start!important;gap:1rem!important}.about-media{position:static!important;top:auto!important}}.loading{display:flex;justify-content:center;align-items:center;padding:2rem;background:none}.spinner{border:3px solid #ece6d9;border-top:3px solid #232323;border-radius:50%;width:30px;height:30px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.toast{position:fixed;top:20px;right:20px;background:#fffdfa;color:#232323;padding:1rem;border-radius:8px;box-shadow:0 4px 15px #2c272121;z-index:1000;animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}