:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{width:100%;height:100%;overflow:hidden}#root{width:100%;height:100%}canvas{display:block}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;padding:0;overflow:hidden;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}html,body,#root{width:100%;height:100%}canvas{display:block;outline:none}.loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:18px;z-index:100}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{background:linear-gradient(135deg,#f8f9fa,#e3f2fd);border-radius:20px;padding:30px;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;position:relative;box-shadow:0 20px 60px #0000004d;border:2px solid rgba(255,255,255,.2);will-change:auto;transform:translateZ(0)}.modal-close{position:absolute;top:15px;right:20px;background:none;border:none;font-size:28px;cursor:pointer;color:#666;transition:color .3s ease}.modal-close:hover{color:#333}.modal-choice{text-align:center}.modal-choice h2{color:#2c3e50;margin-bottom:20px;font-size:24px}.modal-choice p{color:#5d6d7e;margin-bottom:30px;font-size:16px}.choice-buttons{display:flex;gap:20px;flex-direction:column}.choice-btn{padding:15px 25px;border:none;border-radius:12px;font-size:16px;cursor:pointer;transition:all .3s ease;font-weight:600}.read-btn{background:linear-gradient(135deg,#3498db,#2980b9);color:#fff}.read-btn:hover{background:linear-gradient(135deg,#2980b9,#21618c);transform:translateY(-2px);box-shadow:0 8px 20px #3498db4d}.write-btn{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff}.write-btn:hover{background:linear-gradient(135deg,#c0392b,#a93226);transform:translateY(-2px);box-shadow:0 8px 20px #e74c3c4d}.modal-write h2,.modal-read h2{color:#2c3e50;margin-bottom:15px;font-size:22px}.modal-write p,.modal-read p{color:#5d6d7e;margin-bottom:25px;line-height:1.6}.input-group{margin-bottom:20px}.input-group label{display:block;margin-bottom:8px;color:#2c3e50;font-weight:600}.input-group input,.input-group textarea{width:100%;padding:12px 16px;border:2px solid #e0e6ed;border-radius:10px;font-size:14px;transition:border-color .3s ease;font-family:inherit;background:#ffffffe6}.input-group input:focus,.input-group textarea:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.input-group textarea{resize:vertical;min-height:120px;line-height:1.5}.input-group small{color:#95a5a6;font-size:12px;margin-top:5px;display:block}.message-content{background:#ffffffe6;padding:25px;border-radius:15px;margin-bottom:25px;border-left:4px solid #3498db;box-shadow:0 4px 15px #0000001a;pointer-events:auto;position:relative;z-index:1}.message-text{font-size:16px;line-height:1.6;color:#2c3e50;margin-bottom:20px;position:relative;padding:0 20px}.message-text a{color:#3498db;text-decoration:underline;cursor:pointer;pointer-events:auto;position:relative;z-index:10;display:inline-block;padding:2px 4px;margin:0 2px;border-radius:3px;transition:all .2s ease}.message-text a:hover{background-color:#3498db1a;color:#2980b9;text-decoration:none}.message-text a:focus{outline:2px solid #3498db;outline-offset:2px}.message-text:before{content:'"';position:absolute;left:0;top:-10px;font-size:40px;color:#bdc3c7;font-family:serif}.message-text:after{content:'"';position:absolute;right:0;bottom:-20px;font-size:40px;color:#bdc3c7;font-family:serif}.message-meta{border-top:1px solid #ecf0f1;padding-top:15px}.message-meta p{margin:5px 0;color:#7f8c8d;font-size:14px}.modal-actions{display:flex;gap:15px;justify-content:flex-end;margin-top:25px}.btn{padding:12px 24px;border:none;border-radius:8px;font-size:14px;cursor:pointer;transition:all .3s ease;font-weight:600}.btn.cancel{background:#95a5a6;color:#fff}.btn.cancel:hover{background:#7f8c8d;transform:translateY(-1px)}.btn.send{background:linear-gradient(135deg,#27ae60,#229954);color:#fff}.btn.send:hover:not(:disabled){background:linear-gradient(135deg,#229954,#1e8449);transform:translateY(-1px);box-shadow:0 6px 15px #27ae604d}.btn.send:disabled{background:#bdc3c7;cursor:not-allowed;transform:none}.btn:not(.cancel):not(.send){background:linear-gradient(135deg,#3498db,#2980b9);color:#fff}.btn:not(.cancel):not(.send):hover{background:linear-gradient(135deg,#2980b9,#21618c);transform:translateY(-1px)}@media (max-width: 600px){.modal-content{padding:20px;margin:20px}.choice-buttons{gap:15px}.modal-actions{flex-direction:column}.modal-actions .btn{width:100%}}