:root{--bg:#0a0b0f;--surface:#141620;--muted:#8a8fa3;--text:#e7e9ee;--accent:#6f7cff}html,body,#root{height:100%;margin:0;padding:0;overscroll-behavior:none;-webkit-overflow-scrolling:touch}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto;font-size:16px;line-height:1.5;height:100vh;height:100dvh}#root{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth;height:100%;height:100dvh}.container{max-width:720px;margin:0 auto;padding:16px;min-height:100vh;display:flex;flex-direction:column;position:relative}.hamburger-menu{position:fixed;top:16px;left:16px;z-index:1000}.hamburger-btn{background:var(--surface);border:1px solid var(--muted);border-radius:8px;color:var(--text);font-size:18px;width:40px;height:40px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 2px 8px #0003}.hamburger-btn:hover{background:var(--accent);color:var(--bg)}.menu-dropdown{position:absolute;top:45px;left:0;background:var(--surface);border:1px solid var(--muted);border-radius:8px;box-shadow:0 4px 12px #0000004d;min-width:200px;padding:8px 0;animation:menuSlide .2s ease-out}@keyframes menuSlide{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-item{display:block;width:100%;padding:12px 16px;background:none;border:none;color:var(--text);text-align:left;cursor:pointer;font-size:14px;transition:background-color .2s ease}.menu-item:hover:not(:disabled){background:var(--accent);color:var(--bg)}.menu-item:disabled{color:var(--muted);cursor:not-allowed}.start-page-hamburger{position:fixed;top:16px;left:16px;z-index:1000}.start-hamburger-btn{background:var(--surface);border:1px solid var(--muted);border-radius:8px;color:var(--text);font-size:18px;width:40px;height:40px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 2px 8px #0003}.start-hamburger-btn:hover{background:var(--accent);color:var(--bg)}.start-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:80vh;text-align:center;padding:40px 20px}.start-page-header{position:relative;width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:40px}.start-title{font-family:Georgia,Times New Roman,serif;font-size:32px;font-weight:700;color:var(--accent);text-shadow:1px 1px 2px rgba(0,0,0,.3)}.start-page-menu{position:absolute;right:0;top:0}.start-hamburger{background:var(--surface);border:1px solid var(--muted);color:var(--text);font-size:18px;width:40px;height:40px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.start-hamburger:hover{background:var(--accent);border-color:var(--accent)}.start-menu-dropdown{position:absolute;top:45px;left:0;background:var(--surface);border:1px solid var(--muted);border-radius:8px;min-width:180px;box-shadow:0 4px 16px #0000004d;z-index:100}.start-menu-item{display:block;width:100%;padding:12px 16px;background:transparent;border:none;color:var(--text);text-align:left;cursor:pointer;font-size:14px;border-bottom:1px solid var(--muted);transition:background-color .2s ease}.start-menu-item:last-child{border-bottom:none}.start-menu-item:hover{background:var(--muted)}.start-menu-item.logout-item{color:#ff6b6b}.start-menu-item.logout-item:hover{background:#ff6b6b1a}.start-form{background:var(--surface);padding:30px;border-radius:16px;border:1px solid var(--muted);max-width:400px;width:100%;box-shadow:0 4px 16px #0003}.input-group{margin-bottom:20px;text-align:left}.input-group label{display:block;color:var(--text);font-size:14px;margin-bottom:6px;font-weight:500}.required{color:var(--accent)}.start-input{width:100%;padding:12px 16px;background:var(--bg);border:1px solid var(--muted);border-radius:8px;color:var(--text);font-size:16px;box-sizing:border-box;transition:border-color .2s ease}.start-input:focus{outline:none;border-color:var(--accent)}.start-input::placeholder{color:var(--muted)}.start-button{width:100%;padding:14px;background:var(--accent);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:10px}.start-button:hover:not(:disabled){background:#5865d9;transform:translateY(-1px)}.start-button:disabled{background:var(--muted);cursor:not-allowed;transform:none}.error-message{color:#ff6b6b;font-size:14px;margin-bottom:15px;padding:8px 12px;background:#ff6b6b1a;border:1px solid rgba(255,107,107,.3);border-radius:6px}.error-message.success{color:#4ade80;background:#4ade801a;border:1px solid rgba(74,222,128,.3)}.resend-pin-section{margin:15px 0;padding:15px;background:#6f7cff0d;border:1px solid rgba(111,124,255,.2);border-radius:8px;text-align:center}.resend-pin-text{color:var(--muted);font-size:14px;margin:0 0 12px}.resend-pin-button{background:#6f7cff1a;color:var(--accent);border:1px solid rgba(111,124,255,.3);border-radius:6px;padding:8px 16px;font-size:14px;cursor:pointer;transition:all .2s ease}.resend-pin-button:hover:not(:disabled){background:#6f7cff33;border-color:#6f7cff80;transform:translateY(-1px)}.resend-pin-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.resend-pin-form{text-align:left;margin-top:12px}.resend-pin-buttons{display:flex;gap:8px;margin-top:12px}.resend-confirm-button{flex:1;background:var(--accent);color:#fff;border:none;border-radius:6px;padding:10px 16px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.resend-confirm-button:hover:not(:disabled){background:#5c69e6;transform:translateY(-1px)}.resend-confirm-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.resend-cancel-button{background:transparent;color:var(--muted);border:1px solid rgba(138,143,163,.3);border-radius:6px;padding:10px 16px;font-size:14px;cursor:pointer;transition:all .2s ease}.resend-cancel-button:hover:not(:disabled){background:#8a8fa31a;color:var(--text);border-color:#8a8fa380}.auth-mode-selection{display:flex;gap:8px;margin-bottom:25px;padding:4px;background:#ffffff0d;border-radius:10px}.mode-button{flex:1;padding:12px 16px;background:transparent;color:var(--text);border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.mode-button:hover{background:#ffffff1a}.mode-button.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px #7c8bf64d}.pin-input-container{position:relative;display:flex;align-items:center}.pin-input{font-family:Courier New,monospace;letter-spacing:2px;font-size:18px;text-align:center;padding-right:50px!important}.pin-toggle{position:absolute;right:12px;background:none;border:none;color:var(--muted);cursor:pointer;font-size:16px;padding:4px;border-radius:4px;transition:all .2s ease}.pin-toggle:hover{color:var(--text);background:#ffffff1a}.suggestions{margin-bottom:15px;padding:15px;background:#ffffff0d;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.suggestions-title{margin:0 0 10px;font-size:14px;color:var(--muted);font-weight:500}.suggestions-list{display:flex;flex-wrap:wrap;gap:8px}.suggestion-button{padding:8px 12px;background:#7c8bf633;color:var(--accent);border:1px solid var(--accent);border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.suggestion-button:hover{background:var(--accent);color:#fff;transform:translateY(-1px)}.help-text{margin-top:15px;text-align:center;font-size:14px;color:var(--muted)}.link-button{background:none;border:none;color:var(--accent);text-decoration:underline;cursor:pointer;font-size:inherit;padding:0;margin:0;font-weight:500}.link-button:hover{color:#5865d9}@media (max-width: 480px){.start-title{font-size:28px}.start-form{padding:20px}}.auth-step{width:100%;max-width:400px}.auth-step h3{color:var(--text);font-size:20px;margin-bottom:20px;text-align:center}.auth-step h4{color:var(--muted);font-size:16px;margin-bottom:20px;text-align:center;font-weight:400}.logged-in-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid var(--muted)}.logged-in-header h3{margin:0;color:var(--accent);font-size:18px}.logout-button{background:#ff6b6b33;color:#ff6b6b;border:1px solid #ff6b6b;border-radius:6px;padding:6px 12px;font-size:12px;cursor:pointer;transition:all .2s ease}.logout-button:hover{background:#ff6b6b;color:#fff}.header{padding:12px 0;text-align:center;margin-bottom:20px}.title{font-size:28px;color:var(--text);margin-bottom:8px;display:block}.title.poetic{font-family:Brush Script MT,Lucida Handwriting,cursive;font-style:italic;color:var(--accent)}.title.technical{font-family:Courier New,Monaco,monospace;font-weight:700;letter-spacing:1px;text-transform:uppercase}.title.adventure{font-family:Papyrus,Bradley Hand,fantasy;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.5)}.title.default{font-family:Georgia,Times New Roman,serif;font-weight:700}.nickname-row{font-size:16px;color:var(--muted)}.chat{display:flex;flex-direction:column;gap:12px;flex:1;margin-bottom:140px}.bubble{padding:12px 14px;border-radius:16px;max-width:85%;line-height:1.6;animation:rise .2s ease-out;word-wrap:break-word;white-space:pre-wrap}.bubble.me{align-self:flex-end;background:#1b1e2b;margin-left:15%}.bubble.ai{align-self:flex-start;background:#121420;border:1px solid #1f2233;margin-right:15%}.composer{position:fixed;left:0;right:0;bottom:0;background:linear-gradient(180deg,transparent,rgba(10,11,15,.9));padding:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);bottom:env(keyboard-inset-height,0px);padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}.row{display:flex;gap:8px;max-width:720px;margin:0 auto;align-items:flex-end}textarea{flex:1;background:var(--surface);color:var(--text);border:1px solid #1f2233;border-radius:12px;padding:10px;resize:none;min-height:48px;max-height:120px;font-family:inherit;font-size:16px}textarea:focus{outline:none;border-color:var(--accent)}button{background:var(--accent);color:#fff;border:none;border-radius:12px;padding:12px 16px;min-width:64px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .2s}button:hover:not(:disabled){background:#5a67e6}button:disabled{opacity:.6;cursor:not-allowed}.file-input{opacity:0;position:absolute;z-index:-1}.file-button{background:var(--surface);border:1px solid #1f2233;color:var(--text);border-radius:12px;padding:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;width:48px;height:48px}.file-button:hover{border-color:var(--accent)}.camera-button{background:var(--surface);border:1px solid #2d4a22}.camera-button:hover{border-color:#4a7c3a}.camera-on-demand{background:var(--surface);border:1px solid #4a4a22;animation:cameraOnDemandPulse 2s infinite}.camera-on-demand:hover{border-color:#7a7a3a}@keyframes cameraOnDemandPulse{0%{border-color:#4a4a22}50%{border-color:#7a7a3a}to{border-color:#4a4a22}}.location-button{background:var(--surface);border:1px solid #1f2233;color:var(--text);border-radius:12px;padding:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;width:48px;height:48px;font-size:18px;transition:all .2s ease}.location-button:hover:not(:disabled){border-color:var(--accent);background:#6f7cff1a}.location-button:disabled{opacity:.5;cursor:not-allowed}.location-preview{position:fixed;bottom:80px;left:16px;right:16px;max-width:688px;margin:0 auto;background:var(--surface);border:1px solid #1f2233;border-radius:12px;padding:16px;z-index:1000;box-shadow:0 8px 32px #00000080}.location-preview-content{display:flex;justify-content:space-between;align-items:center;gap:16px}.location-info{flex:1;font-size:14px;line-height:1.4}.location-coords{margin-top:8px;font-family:Courier New,monospace;font-size:12px;color:var(--muted)}.location-actions{display:flex;gap:8px}.location-send-btn,.location-cancel-btn{padding:8px 16px;border-radius:8px;border:none;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease}.location-send-btn{background:var(--accent);color:#fff}.location-send-btn:hover{background:#5a66d9}.location-cancel-btn{background:var(--surface);color:var(--text);border:1px solid #1f2233}.location-cancel-btn:hover{border-color:var(--accent)}.location-error{position:fixed;top:16px;left:16px;right:16px;max-width:688px;margin:0 auto;background:#2d1f1f;color:#ff6b6b;border:1px solid #ff6b6b;border-radius:8px;padding:12px;font-size:14px;z-index:1001;display:flex;justify-content:space-between;align-items:center}.error-close{background:none;border:none;color:#ff6b6b;font-size:16px;cursor:pointer;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center}.location-container{background:#6f7cff1a;border:1px solid rgba(111,124,255,.3);border-radius:8px;padding:12px;margin:8px 0}.location-container .location-info{font-size:14px;margin-bottom:8px}.location-container .location-coords{font-family:Courier New,monospace;font-size:12px;color:var(--muted);margin-top:4px}.location-link{display:inline-block;padding:6px 12px;background:var(--accent);color:#fff;text-decoration:none;border-radius:6px;font-size:12px;transition:background-color .2s ease}.location-link:hover{background:#5a66d9}.small{color:var(--muted);font-size:12px}.loading{opacity:.7;font-style:italic}.nickname-display{cursor:pointer;padding:2px 4px;border-radius:4px;transition:background-color .2s ease}.nickname-display:hover{background-color:var(--surface)}.nickname-display.locked{cursor:default;color:var(--muted)}.nickname-display.locked:hover{background-color:transparent}.lock-icon{font-size:12px;opacity:.7;margin-left:4px}.nickname-editor{display:inline-flex;align-items:center;gap:4px;margin:0 8px}.nickname-input{background:var(--surface);color:var(--text);border:1px solid var(--accent);border-radius:6px;padding:4px 8px;font-size:14px;font-weight:700;min-width:120px;font-family:inherit}.nickname-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #6f7cff33}.nickname-save-btn,.nickname-cancel-btn{background:var(--surface);color:var(--text);border:1px solid #1f2233;border-radius:4px;padding:2px 6px;cursor:pointer;font-size:12px;transition:all .2s ease}.nickname-save-btn:hover{background:#22c55e;border-color:#22c55e;color:#fff}.nickname-cancel-btn:hover{background:#ef4444;border-color:#ef4444;color:#fff}.clear-chat-btn{margin-left:10px;font-size:12px;padding:4px 8px;background:var(--surface);color:var(--text);border:1px solid #1f2233;border-radius:6px;cursor:pointer;transition:all .2s ease}.clear-chat-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}.image-container{margin-bottom:8px}.chat-image{max-width:100%;max-height:300px;border-radius:12px;display:block;box-shadow:0 2px 8px #0000004d;transition:transform .2s ease}.chat-image:hover{transform:scale(1.02);cursor:pointer}.message-text{margin-top:0}.bubble .image-container+.message-text{margin-top:8px}.message-text h1,.message-text h2,.message-text h3,.message-text h4,.message-text h5,.message-text h6{margin:16px 0 8px;color:var(--text);font-weight:600}.message-text h1{font-size:1.5em}.message-text h2{font-size:1.3em}.message-text h3{font-size:1.1em}.message-text h4,.message-text h5,.message-text h6{font-size:1em}.message-text p{margin:8px 0;line-height:1.6}.message-text ul,.message-text ol{margin:8px 0;padding-left:20px}.message-text li{margin:4px 0;line-height:1.5}.message-text code{background:#ffffff1a;padding:2px 6px;border-radius:4px;font-family:Consolas,Monaco,Courier New,monospace;font-size:.9em;color:var(--accent)}.message-text pre{background:#ffffff0d;border:1px solid var(--muted);border-radius:8px;padding:12px;margin:12px 0;overflow-x:auto;font-family:Consolas,Monaco,Courier New,monospace;font-size:.9em;line-height:1.4}.message-text pre code{background:none;padding:0;border-radius:0;color:var(--text)}.message-text blockquote{border-left:3px solid var(--accent);padding-left:16px;margin:12px 0;color:var(--muted);font-style:italic}.message-text strong{font-weight:600;color:var(--text)}.message-text em{font-style:italic}.message-text a{color:var(--accent);text-decoration:none}.message-text a:hover{text-decoration:underline}.message-text table{border-collapse:collapse;margin:12px 0;width:100%;font-size:.9em;background:#ffffff05;border-radius:6px;overflow:hidden;box-shadow:0 1px 3px #0003}.message-text thead{background:#ffffff1a}.message-text th,.message-text td{border:1px solid rgba(255,255,255,.1);padding:8px 12px;text-align:left;vertical-align:top;word-break:break-word}.message-text th{background:#ffffff14;font-weight:600;color:var(--text);font-size:.85em;text-transform:uppercase;letter-spacing:.5px}.message-text td{background:#ffffff05}.message-text tr:nth-child(2n) td{background:#ffffff0a}@media (max-width: 600px){.message-text table{font-size:.8em;display:block;overflow-x:auto;white-space:nowrap}.message-text th,.message-text td{padding:6px 8px;min-width:80px}}.message-text hr{border:none;border-top:1px solid var(--muted);margin:16px 0}.markdown-image-container{margin:16px 0;text-align:center;background:#ffffff05;border-radius:8px;padding:8px;border:1px solid rgba(255,255,255,.1)}.markdown-image{max-width:100%;max-height:400px;height:auto;border-radius:6px;box-shadow:0 2px 8px #0000004d;transition:transform .2s ease;cursor:pointer}.markdown-image:hover{transform:scale(1.02)}.image-error{color:var(--muted);font-style:italic;padding:16px;text-align:center;background:#ff6b6b1a;border:1px solid rgba(255,107,107,.3);border-radius:6px;margin:8px 0}.markdown-image.fullscreen{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(1);max-width:90vw;max-height:90vh;z-index:10000;border-radius:8px;box-shadow:0 8px 32px #0009;cursor:zoom-out}.fullscreen-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;z-index:9999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@keyframes rise{0%{transform:translateY(6px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 768px){.container{padding:12px 12px 12px 20px}.chat{margin-bottom:180px;padding-bottom:env(keyboard-inset-height,0px)}.header{font-size:20px}.bubble{max-width:90%}.bubble.me{margin-left:10%}.bubble.ai{margin-right:10%}.composer{position:fixed;bottom:env(keyboard-inset-height,env(safe-area-inset-bottom,0px))}@supports (-webkit-touch-callout: none){body,#root{height:-webkit-fill-available}}}.popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;box-sizing:border-box}.popup-content{background:var(--surface);border-radius:12px;width:100%;max-width:600px;max-height:90vh;overflow-y:auto;border:1px solid #2a2d3a;box-shadow:0 10px 30px #00000080}.popup-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #2a2d3a}.popup-header h3{margin:0;color:var(--text);font-size:18px;font-weight:600}.popup-close{background:none;border:none;color:var(--muted);font-size:20px;cursor:pointer;padding:4px;border-radius:4px;transition:color .2s ease}.popup-close:hover{color:var(--text);background:#ffffff1a}.popup-body{padding:20px}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:6px;color:var(--text);font-weight:500;font-size:14px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px;border:1px solid #2a2d3a;border-radius:6px;background:var(--bg);color:var(--text);font-size:14px;font-family:inherit;box-sizing:border-box;transition:border-color .2s ease}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--accent)}.form-row{display:flex;gap:16px}.form-row .form-group{flex:1}.system-prompt-textarea{resize:vertical;min-height:200px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:13px;line-height:1.4}.popup-footer{display:flex;justify-content:flex-end;gap:12px;padding:20px;border-top:1px solid #2a2d3a}.btn-primary,.btn-secondary{padding:10px 20px;border-radius:6px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:#5a67e8}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:transparent;color:var(--muted);border:1px solid #2a2d3a}.btn-secondary:hover:not(:disabled){background:#ffffff0d;color:var(--text)}@media (max-width: 768px){.popup-overlay{padding:10px}.popup-content{max-height:95vh}.popup-header,.popup-body,.popup-footer{padding:16px}.form-row{flex-direction:column;gap:0}.system-prompt-textarea{min-height:150px}}.continue-button-container{display:flex;justify-content:flex-end;margin-top:8px;margin-bottom:12px;margin-right:20px}.continue-button{padding:6px 12px;background:#7c8bf633;color:var(--accent);border:1px solid var(--accent);border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease;min-width:auto}.continue-button:hover:not(:disabled){background:var(--accent);color:#fff;transform:translateY(-1px)}.continue-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.admin-panel-content{max-height:400px;overflow-y:auto;padding:10px 0}.admin-section{margin-bottom:30px;padding:20px;background:#ffffff05;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.admin-section h4{color:var(--text);margin:0 0 15px;font-size:16px;font-weight:600}.admin-action-btn{width:100%;padding:12px 20px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;margin-top:10px}.admin-action-btn.create{background:linear-gradient(135deg,#4ade80,#22c55e);color:#fff}.admin-action-btn.create:hover:not(:disabled){background:linear-gradient(135deg,#22c55e,#16a34a);transform:translateY(-1px)}.admin-action-btn.delete{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.admin-action-btn.delete:hover:not(:disabled){background:linear-gradient(135deg,#dc2626,#b91c1c);transform:translateY(-1px)}.admin-action-btn.assign{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}.admin-action-btn.assign:hover:not(:disabled){background:linear-gradient(135deg,#d97706,#b45309);transform:translateY(-1px)}.admin-action-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
