.room{position:fixed;inset:0;display:flex;flex-direction:column;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif;color:#f4ecd8;-webkit-user-select:none;user-select:none}.room-bar{display:flex;align-items:center;padding:10px max(16px,env(safe-area-inset-left,0px)) 10px max(16px,env(safe-area-inset-right,0px));background:#1a1423e0;gap:12px;flex-shrink:0;z-index:2;min-height:48px}.room-bar .room-name{font-size:clamp(15px,3vw,20px);font-weight:700;color:#ffe08a;flex:1}.room-bar .hud-info{font-size:clamp(13px,2.5vw,17px);color:#f4ecd8}.hud-daily{font-size:clamp(12px,2.2vw,15px);font-weight:700;color:#9bc995;white-space:nowrap}.hud-checkpoint{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#9bc99529;border:1px solid #9bc995;font-size:16px;text-decoration:none;flex-shrink:0;-webkit-tap-highlight-color:transparent}.hud-checkpoint:active{opacity:.7}.hud-user{display:flex;align-items:center;gap:8px;margin-left:auto}.hud-user-name{font-size:clamp(11px,2vw,14px);color:#8a8290;max-width:20vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hud-logout-btn{background:none;border:1px solid #8a8290;border-radius:8px;color:#8a8290;font-size:12px;padding:4px 10px;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent}.hud-logout-btn:active{opacity:.7}.room-body{flex:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(12px,3vw,24px);padding:clamp(16px,4vw,32px) max(clamp(16px,4vw,32px),env(safe-area-inset-left,0px));overflow-y:auto;position:relative;z-index:1;padding-bottom:max(clamp(16px,4vw,32px),env(safe-area-inset-bottom,0px))}.card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(14px,3vw,22px) clamp(16px,3.5vw,26px);border-radius:18px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .1s;text-align:center;min-width:clamp(100px,25vw,150px)}.card:active{transform:scale(.95)}.card-npc{background:#1a1423d1;border:3px solid #d9b08c;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.card-npc-done{border-color:#9bc995}.card-avatar-wrap{position:relative;margin-bottom:8px}.card-avatar{width:clamp(56px,12vw,88px);height:clamp(74px,16vw,117px);display:flex;align-items:center;justify-content:center}.card-avatar svg{width:100%;height:100%}.card-avatar-img{width:100%;height:100%;object-fit:contain}.card-npc-badge{position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:50%;background:#4a7c59;color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid #1a1423}.card-npc .card-label{font-size:clamp(15px,3vw,20px);font-weight:700;color:#f4ecd8}.card-npc .card-hint{font-size:clamp(11px,2.2vw,14px);color:#9bc995;margin-top:4px}.card-door{position:relative;border:3px solid #d9b08c;min-width:clamp(100px,22vw,140px);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.card-door.unlocked{background:#3a2f1ed9}.card-door.locked{background:#282828bf;opacity:.7;cursor:default}.card-door-done{border-color:#9bc995}.card-door .card-hint{font-size:clamp(11px,2.2vw,14px);color:#9bc995;margin-top:4px}.card-door-art{width:clamp(48px,10vw,72px);height:clamp(56px,12vw,84px);margin-bottom:8px}.card-door-art svg{width:100%;height:100%}.card-door .card-label{font-size:clamp(13px,2.5vw,17px);font-weight:700}.card-door.unlocked .card-label{color:#ffe08a}.card-door.locked .card-label{color:#888}.card-item{background:#1a1423d1;border:3px solid #9bc995;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.card-item .card-icon-text{font-size:clamp(32px,8vw,52px);margin-bottom:6px}.card-item .card-label{font-size:clamp(13px,2.5vw,17px);color:#ffe08a;font-weight:700}.card-garden{min-width:clamp(184px,46vw,288px)}.card-garden .card-hint{font-size:clamp(11px,2.2vw,14px);color:#9bc995;margin-top:6px}.garden-grid{display:flex;flex-direction:column;gap:clamp(3px,.8vw,6px);margin-bottom:8px}.garden-row{display:grid;grid-template-columns:repeat(7,1fr);gap:clamp(3px,.8vw,6px)}.garden-cell{width:clamp(22px,5.5vw,34px);height:clamp(22px,5.5vw,34px);display:flex;align-items:center;justify-content:center;font-size:clamp(14px,3.4vw,22px);line-height:1;background:#3a2f1e8c;border-radius:8px}.overlay{position:fixed;inset:0;z-index:10;display:flex;flex-direction:column;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif;color:#f4ecd8;-webkit-user-select:none;user-select:none}.convo-overlay{background:#0d0a12f7}.convo-header{display:flex;align-items:flex-start;justify-content:space-between;padding:max(12px,env(safe-area-inset-top,0px)) 16px 8px;flex-shrink:0;gap:12px}.convo-header-main{flex:1;text-align:center}.convo-npc-name{font-size:clamp(20px,5vw,30px);font-weight:700;color:#ffe08a}.convo-friendship{font-size:clamp(12px,2.5vw,16px);color:#b56576;margin-top:2px}.convo-goal{font-size:clamp(14px,3vw,18px);color:#9bc995;font-style:italic;margin-top:6px}.convo-leave-btn{background:none;border:1px solid #555;border-radius:8px;color:#8a8290;font-size:clamp(12px,2.5vw,15px);padding:6px 12px;cursor:pointer;font-family:inherit;white-space:nowrap;flex-shrink:0;-webkit-tap-highlight-color:transparent;align-self:flex-start;margin-top:4px}.convo-leave-btn:active{opacity:.7}.convo-peek-btn-wrap{display:none;justify-content:center;padding:4px max(16px,env(safe-area-inset-left,0px)) 8px;flex-shrink:0;position:relative;z-index:20}.convo-peek-btn{background:#9bc99526;border:1px solid #9bc995;color:#9bc995;border-radius:10px;padding:8px 16px;font-family:inherit;font-size:clamp(13px,3vw,16px);cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:none}.convo-peek-btn:active{opacity:.85}.convo-scene-overlay{position:absolute;inset:0;z-index:15;background:#1a1423;display:none;flex-direction:column;align-items:center;justify-content:center;gap:20px;pointer-events:none}.convo-scene-overlay.visible{display:flex}.scene-diagram{position:relative;width:min(88vw,420px);aspect-ratio:400 / 240;border-radius:16px;overflow:hidden;box-shadow:0 10px 32px #00000080}.scene-bg{position:absolute;inset:0;width:100%;height:100%;display:block}.scene-item-img{position:absolute;width:11%;transform:translate(-50%,-50%);filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}.scene-item-dim{opacity:.45}.scene-hint{color:#9bc995;font-size:clamp(12px,3vw,15px)}.convo-body{flex:1;overflow-y:auto;padding:12px max(16px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:12px}.convo-npc-speech{background:#2a2436;border-radius:16px;padding:14px 16px;font-size:clamp(17px,4vw,24px);line-height:1.5;color:#f4ecd8;border-left:5px solid #ffe08a}.convo-transcript{font-size:clamp(14px,3vw,19px);color:#9ec5ff;font-style:italic;padding:0 4px}.convo-feedback{background:#1e1a28;border-radius:14px;padding:12px 14px;font-size:clamp(15px,3.5vw,21px);line-height:1.5;color:#f4ecd8;border-left:5px solid #9bc995}.convo-feedback .corrections{color:#f2cc8f;margin-top:6px;font-size:clamp(13px,3vw,18px)}.convo-feedback .earned{color:#ffe08a;margin-top:4px;font-size:clamp(12px,2.5vw,16px)}.convo-status{text-align:center;font-size:clamp(14px,3vw,19px);padding:6px 12px;min-height:28px}.convo-input-area{flex-shrink:0;display:flex;flex-direction:column;align-items:center;padding:10px 0 max(16px,env(safe-area-inset-bottom,0px));gap:8px}.mic-btn{width:clamp(72px,18vw,96px);height:clamp(72px,18vw,96px);border-radius:50%;border:4px solid #d9b08c;background:#3d5a80;color:#f4ecd8;font-size:clamp(32px,8vw,48px);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,transform .1s;-webkit-tap-highlight-color:transparent}.mic-btn:active{transform:scale(.94)}.mic-btn.recording{background:#b56576;animation:pulse 1s infinite}@keyframes pulse{0%,to{box-shadow:0 0 #b5657680}50%{box-shadow:0 0 0 14px #b5657600}}.mic-hint{font-size:clamp(12px,2.5vw,15px);color:#8a8290}.convo-actions{flex-shrink:0;display:flex;gap:10px;padding:0 max(16px,env(safe-area-inset-left,0px)) max(12px,env(safe-area-inset-bottom,0px))}.btn{flex:1;padding:clamp(12px,3vw,18px) 0;border:none;border-radius:14px;font-family:inherit;font-size:clamp(15px,3.5vw,20px);font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s}.btn:active{opacity:.8}.btn-primary{background:#3d5a80;color:#f4ecd8}.btn-danger{background:#b56576;color:#f4ecd8}.btn-success{background:#4a7c59;color:#f4ecd8}.convo-actions:has(.btn-success:only-child) .btn-success{font-size:clamp(17px,4vw,22px);padding:clamp(16px,4vw,22px) 0}.dialogue-overlay{background:#0d0a12e0;justify-content:flex-end}.dialogue-sheet{background:#1a1423;border-top:4px solid #d9b08c;border-radius:20px 20px 0 0;padding:20px max(16px,env(safe-area-inset-left,0px)) max(16px,env(safe-area-inset-bottom,0px));max-height:70vh;overflow-y:auto}.dialogue-name{font-size:clamp(18px,4.5vw,26px);font-weight:700;color:#ffe08a}.dialogue-dots{font-size:clamp(11px,2vw,15px);color:#8a8290;float:right;margin-top:6px}.dialogue-spanish{font-size:clamp(17px,4vw,24px);line-height:1.5;color:#f4ecd8;margin-top:14px}.dialogue-hint{font-size:clamp(13px,2.8vw,18px);color:#9bc995;font-style:italic;margin-top:10px}.dialogue-lesson{font-size:clamp(13px,2.8vw,18px);color:#ffe08a;margin-top:10px}.dialogue-actions{display:flex;gap:10px;margin-top:18px}.auth-screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#1a1423;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif;color:#f4ecd8;padding:24px;z-index:100}.auth-card{background:#2a2436;border:3px solid #d9b08c;border-radius:20px;padding:clamp(24px,5vw,40px);width:min(380px,90vw);text-align:center}.auth-card h1{font-size:clamp(22px,5vw,30px);color:#ffe08a;margin-bottom:4px}.auth-card .subtitle{font-size:clamp(13px,3vw,16px);color:#9bc995;margin-bottom:24px}.auth-card input{display:block;width:100%;padding:14px 16px;margin-bottom:12px;border:2px solid #555;border-radius:12px;background:#1a1423;color:#f4ecd8;font-size:17px;font-family:inherit;outline:none}.auth-card input:focus{border-color:#ffe08a}.auth-card input::placeholder{color:#8a8290}.auth-card button{display:block;width:100%;padding:16px;border:none;border-radius:14px;font-size:18px;font-weight:700;font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;margin-top:8px}.auth-card .btn-login{background:#3d5a80;color:#f4ecd8}.auth-card .btn-register{background:#4a7c59;color:#f4ecd8}.auth-card button:active{opacity:.85}.auth-card .error{color:#b56576;font-size:15px;margin-top:10px;min-height:22px}.auth-card .success{color:#9bc995;font-size:15px;margin-top:10px}.auth-card .btn-forgot{background:transparent;color:#9bc995;font-size:14px;font-weight:400;margin-top:12px;padding:8px;text-decoration:underline;cursor:pointer;width:auto}.auth-card .btn-forgot:active{opacity:.7}.auth-card .btn-back{background:transparent;color:#8a8290;font-size:14px;font-weight:400;margin-top:4px;padding:8px;text-decoration:underline;cursor:pointer;width:auto}.auth-card .btn-back:active{opacity:.7}
