@import "https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;1,400&family=Dancing+Script:wght@400;600&display=swap";*{box-sizing:border-box;margin:0;padding:0}body{color:#2c2c2c;background-color:#f5f0e8;min-height:100vh;font-family:Crimson Text,serif}.app{max-width:680px;min-height:100vh;margin:0 auto;padding:2rem 1rem}.auth-container{flex-direction:column;justify-content:center;align-items:center;gap:1rem;min-height:100vh;display:flex}.auth-container h1{color:#2c2c2c;margin-bottom:.5rem;font-family:Dancing Script,cursive;font-size:3.5rem}.auth-container p{color:#7a6a55;margin-bottom:1.5rem;font-size:1.1rem;font-style:italic}.auth-container input{color:#2c2c2c;background:0 0;border:none;border-bottom:1px solid #a89880;outline:none;width:280px;padding:.75rem 1rem;font-family:Crimson Text,serif;font-size:1.1rem}.auth-container input::placeholder{color:#b0a090}.ink-button{color:#f5f0e8;cursor:pointer;letter-spacing:.05em;background:#2c2c2c;border:none;margin-top:1rem;padding:.6rem 2rem;font-family:Dancing Script,cursive;font-size:1.2rem;transition:opacity .2s}.ink-button:hover{opacity:.8}.switch-auth{color:#7a6a55;cursor:pointer;background:0 0;border:none;font-family:Crimson Text,serif;font-size:1rem;font-style:italic;text-decoration:underline}.nav{border-bottom:1px solid #d4c9b5;justify-content:space-between;align-items:center;margin-bottom:2.5rem;padding-bottom:1rem;display:flex}.nav h1{color:#2c2c2c;font-family:Dancing Script,cursive;font-size:2rem}.nav-links{gap:1.5rem;display:flex}.nav-links button{color:#7a6a55;cursor:pointer;background:0 0;border:none;font-family:Crimson Text,serif;font-size:1rem;font-style:italic}.nav-links button.active{color:#2c2c2c;text-decoration:underline}.mailbox h2{color:#4a3f35;margin-bottom:1.5rem;font-family:Dancing Script,cursive;font-size:1.8rem}.letter-preview{cursor:pointer;border-bottom:1px solid #d4c9b5;padding:1.2rem 1.5rem;transition:background .15s}.letter-preview:hover{background:#ede8dc}.letter-preview .from{color:#7a6a55;margin-bottom:.3rem;font-size:.85rem;font-style:italic}.letter-preview .snippet{color:#2c2c2c;font-size:1rem}.letter-preview .time{color:#b0a090;margin-top:.3rem;font-size:.8rem}.empty-mailbox{text-align:center;color:#b0a090;margin-top:4rem;font-size:1.1rem;font-style:italic;line-height:2}.letter-view{background:#fdfaf4;border:1px solid #d4c9b5;min-height:60vh;padding:2rem;position:relative}.letter-view .letter-from{color:#7a6a55;margin-bottom:2rem;font-size:.9rem;font-style:italic}.letter-view canvas{touch-action:none;width:100%}.back-button{color:#7a6a55;cursor:pointer;background:0 0;border:none;margin-bottom:1.5rem;font-family:Crimson Text,serif;font-size:1rem;font-style:italic}.compose h2{color:#4a3f35;margin-bottom:.5rem;font-family:Dancing Script,cursive;font-size:1.8rem}.compose .to-line{color:#7a6a55;margin-bottom:1.5rem;font-size:.95rem;font-style:italic}.canvas-container{touch-action:none;background:#fdfaf4;border:1px solid #d4c9b5;position:relative}.canvas-toolbar{border-bottom:1px solid #d4c9b5;align-items:center;gap:1rem;padding:.75rem 1rem;display:flex}.canvas-toolbar button{color:#7a6a55;cursor:pointer;background:0 0;border:none;font-family:Crimson Text,serif;font-size:.9rem;font-style:italic}.canvas-toolbar button:hover{color:#2c2c2c}.send-area{flex-direction:column;gap:1rem;margin-top:1.5rem;display:flex}.correspondent-list{flex-direction:column;gap:.5rem;display:flex}.correspondent-item{color:#2c2c2c;cursor:pointer;text-align:left;background:0 0;border:1px solid #d4c9b5;padding:.6rem 1rem;font-family:Crimson Text,serif;font-size:1rem;font-style:italic}.correspondent-item:hover,.correspondent-item.selected{background:#ede8dc}.ritual{flex-direction:column;align-items:center;gap:1.5rem;padding:2rem 0;display:flex}.ritual h2{color:#4a3f35;font-family:Dancing Script,cursive;font-size:1.8rem}.ritual p{color:#7a6a55;text-align:center;font-style:italic;line-height:1.8}.seal-code{color:#2c2c2c;letter-spacing:.3em;background:#fdfaf4;border:1px solid #d4c9b5;padding:1rem 2rem;font-family:Dancing Script,cursive;font-size:2.5rem}.ritual input{color:#2c2c2c;text-align:center;letter-spacing:.2em;background:0 0;border:none;border-bottom:1px solid #a89880;outline:none;width:200px;padding:.75rem 1rem;font-family:Dancing Script,cursive;font-size:1.5rem}.error{color:#8b4040;font-size:.9rem;font-style:italic}.success{color:#4a7a55;font-size:.9rem;font-style:italic}.your-code-section{text-align:center;padding:1rem}.divider{border:none;border-top:1px solid #d4c9b5;width:100%;margin:1rem 0}
