:root{--space-1: .5rem;--space-2: .75rem;--space-3: 1rem;--space-4: 1.25rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 2.5rem;--space-8: 3rem}.container{max-width:1200px;margin:0 auto}.chat-intro{max-width:900px;margin:var(--space-6) auto var(--space-4);padding:0;text-align:center}.chat-intro h2{font-size:2rem;margin:0}.intro-note{max-width:900px;margin:var(--space-6) auto 0;padding:var(--space-6);border:2px dotted transparent;border-image:var(--gradient-accent) 1;border-radius:12px;font-size:.75rem;color:#fff}.nickname-prompt{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur))}.prompt-content{background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:12px;padding:2.25rem;text-align:center;max-width:420px;width:min(92vw,420px);box-shadow:var(--glass-shadow)}.prompt-content h2{margin:0 0 1.25rem;font-family:Berkshire Swash,serif;font-weight:400;background-image:var(--gradient-heading);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;font-size:1.8rem;line-height:1.2}.prompt-content input{width:100%;padding:.95rem 1rem;background:#0a0a0f59;border:1px solid rgba(255,255,255,.12);border-radius:10px;color:var(--color-text);font-size:1rem;margin-bottom:1rem;box-sizing:border-box;transition:border-color .2s,box-shadow .2s}.prompt-content input::placeholder{color:#ffffff73}.prompt-content input:focus{outline:none;border-color:#7e7eff99;box-shadow:0 0 0 3px #7e7eff2e}.prompt-content button{width:100%;padding:.95rem 1rem;background:var(--gradient-accent);border:1px solid rgba(255,255,255,.12);border-radius:10px;color:var(--color-text);font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s,opacity .2s}.prompt-content button:hover{transform:translateY(-1px);box-shadow:0 10px 22px #00000059}.prompt-content button:active{transform:translateY(0);opacity:.95}.hint{margin-top:.9rem;font-size:.85rem;color:#ffffff8c}.chat-area{max-width:900px;margin:0 auto;padding:var(--space-6) var(--space-3)}.chat-wrapper{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;box-shadow:var(--glass-shadow-soft);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));overflow:hidden;display:flex;flex-direction:column;height:min(72vh,720px)}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-4)}.chat-header h1{margin:0;font-family:Berkshire Swash,serif;font-weight:400;background-image:var(--gradient-heading);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;font-size:1.55rem;line-height:1.2}.online-counter{display:flex;align-items:center;gap:.5rem;font-size:.95rem;color:#ffffffa6;font-family:inherit}.pulse-dot{width:8px;height:8px;background:#00dbffd9;border-radius:50%;animation:pulse 2s ease-in-out infinite}.admin-btn,.leave-btn{margin-left:var(--space-2);padding:.35rem .6rem;border-radius:10px;border:none;background:var(--overlay-gradient-accent);color:#fffc;cursor:pointer;font:inherit}.admin-btn:hover,.leave-btn:hover{background:#0a0a0f59}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.messages-container{flex:1;min-height:0;overflow-y:auto;padding:1.25rem;display:flex;flex-direction:column;gap:.6rem;background:#0a0a0f2e}.messages-container::-webkit-scrollbar{width:10px}.messages-container::-webkit-scrollbar-track{background:#00000026}.messages-container::-webkit-scrollbar-thumb{background:#7e7eff38;border-radius:6px}.messages-container::-webkit-scrollbar-thumb:hover{background:#7e7eff59}.loading{text-align:center;color:#ffffff8c;padding:2rem 1rem}.message{display:flex;gap:.75rem;align-items:flex-start;padding:0;background:transparent;border:none;animation:fadeIn .25s ease-in;width:100%}.message-content{max-width:80%;min-width:0;padding:.5rem .75rem;border-radius:12px;background:var(--overlay-gradient-accent);border:none;transition:transform .15s ease,box-shadow .15s ease}.message:hover .message-content{transform:translateY(-1px);box-shadow:0 8px 16px #0000004d}.message-header{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.25rem}.message-nickname{font-family:inherit;font-size:.9rem;line-height:1.15;color:#070707f2;font-weight:600}.message-timestamp{font-size:.75rem;color:#020202}.message-text{color:#fff;line-height:1.4;word-wrap:break-word;font-size:.9rem}.system-message{text-align:center;font-size:.8rem;color:#9273ff99;padding:.35rem .5rem;margin:var(--space-2) auto;background:transparent!important;border:none!important;box-shadow:none!important;font-style:italic;max-width:fit-content}.message-actions{opacity:0;transition:opacity .2s;align-self:flex-start;padding-top:.5rem}.message:hover .message-actions{opacity:1}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.message-avatar{display:none}.delete-btn{background:var(--overlay-gradient-accent);border:none;color:#ffffffe6;padding:.35rem .6rem;border-radius:8px;font-size:.78rem;cursor:pointer;transition:transform .15s ease,background .15s ease,border-color .15s}.delete-btn:hover{background:#da25c92e;border-color:#da25c98c;transform:translateY(-1px)}.input-area{padding:var(--space-4);background:#0a0a0f59;border-top:1px solid rgba(255,255,255,.08)}.cooldown-bar{height:2px;background:var(--gradient-accent);border-radius:2px;margin-bottom:var(--space-3);transform:scaleX(0);transform-origin:left;transition:transform .1s linear}.input-wrapper{display:flex;gap:.75rem;align-items:center}.input-wrapper input{flex:1;padding:.85rem 1rem;background:#0a0a0f59;border:1px solid rgba(255,255,255,.12);border-radius:10px;color:var(--color-text);font-size:.95rem;transition:border-color .2s,box-shadow .2s,opacity .2s}.input-wrapper input:focus{outline:none;border-color:#7e7eff99;box-shadow:0 0 0 3px #7e7eff29}.input-wrapper input:disabled{opacity:.55;cursor:not-allowed}.input-wrapper input::placeholder{color:#ffffff73}.input-wrapper button{padding:.85rem 1.25rem;background:var(--overlay-gradient-accent);border:none;border-radius:10px;overflow:hidden;color:var(--color-text);font:inherit;font-size:.95rem;cursor:pointer;position:relative;transition:transform .15s ease,box-shadow .15s ease,opacity .2s;white-space:nowrap}.input-wrapper button:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 1px #ffffff2e}.input-wrapper button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 22px #00000059}.input-wrapper button:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}.input-hints{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-2);font-size:.85rem;color:#fff9}#cooldownText{color:#00dbffd9;font-weight:500}.nickname-display{color:#9273fff2}.nickname-display strong{color:#9273fff2;font-weight:600}.system-delete{margin-left:.6rem;min-width:72px;height:28px;padding:0 .75rem;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;background:var(--overlay-gradient-accent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:none;border-radius:999px;font-family:inherit;font-size:.8rem;font-weight:500;color:#ffffffbf;cursor:pointer;transition:background .2s ease,color .2s ease,transform .15s ease}.system-delete:hover{background:#ffffff1f;color:#fffffff2;transform:translateY(-1px)}.system-delete:active{transform:translateY(0);background:#ffffff2e}.modal{position:fixed;inset:0;display:none;z-index:30000}.modal.is-open{display:block}.modal-backdrop{position:absolute;inset:0;background:#0000008c;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.modal-card{position:relative;width:min(92vw,420px);margin:14vh auto 0;padding:1.25rem 1.25rem 1rem;background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:12px;box-shadow:var(--glass-shadow)}.modal-title{margin:0 0 .35rem;font-size:1.25rem;line-height:1.2}.modal-subtitle{margin:0 0 .9rem;color:#ffffffa6;font-size:.92rem;line-height:1.4}.modal-input{width:100%;padding:.85rem .95rem;background:#0a0a0f59;border:1px solid rgba(255,255,255,.12);border-radius:10px;color:var(--color-text);font-size:.95rem;box-sizing:border-box}.modal-input:focus{outline:none;border-color:#7e7eff99;box-shadow:0 0 0 3px #7e7eff29}.modal-actions{display:flex;justify-content:flex-end;gap:.6rem;margin-top:.9rem}.modal-btn{padding:.65rem .9rem;border-radius:10px;border:1px solid rgba(255,255,255,.12);font:inherit;cursor:pointer}.modal-btn.secondary{background:#0a0a0f40;color:#fffc}.modal-btn.primary{background:var(--gradient-accent);color:#ffffffeb}.modal-actions{display:flex;justify-content:flex-end;gap:.75rem;margin-top:1.5rem}.modal-actions button{appearance:none;border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:.55rem 1.25rem;font-family:inherit;font-size:.9rem;font-weight:600;cursor:pointer;color:var(--color-text);background:#0a0a0f59;transition:transform .15s ease,box-shadow .15s ease,opacity .2s ease}#deleteCancelBtn{background:var(--overlay-gradient-accent)}#deleteCancelBtn:hover{background:#0a0a0f73;transform:translateY(-1px)}#deleteConfirmBtn{background:var(--overlay-gradient-accent);border-color:#1f1a3b40}#deleteConfirmBtn:hover{transform:translateY(-1px);box-shadow:0 10px 24px #0006}#deleteConfirmBtn:active,#deleteCancelBtn:active{transform:translateY(0);opacity:.95}@media(max-width:1100px){.chat-intro{max-width:900px}.chat-area{padding-left:1rem;padding-right:1rem}.prompt-content{padding:var(--space-6) var(--space-4)}.chat-wrapper{height:clamp(420px,52dvh,520px)}.chat-header{flex-direction:column;gap:.6rem;align-items:flex-start;padding:var(--space-4)}.chat-header h1{font-size:1.45rem}.messages-container{padding:var(--space-4)}.message-avatar{width:32px;height:32px;font-size:.95rem}.message-nickname{font-size:1rem}.input-wrapper{flex-direction:column;gap:.55rem;align-items:stretch}.input-area{padding-bottom:calc(1rem + env(safe-area-inset-bottom))}.input-wrapper button{width:100%}.input-hints{flex-direction:column;gap:.25rem;align-items:flex-start}}
