flex: 1; background: transparent; border: 0;
color: #ffe9a8; font: 16px Georgia, serif;
padding: 10px 12px; outline: none; min-width: 0;
}
#kb {
padding: 6px 6px calc(8px + env(safe-area-inset-bottom));
background: rgba(10,8,4,0.94); border-top: 1px solid #8a6a1c;
}
.kbrow { display: flex; gap: 5px; margin-bottom: 6px; }
.kbrow:last-child { margin-bottom: 0; }
.kbkey {
flex: 1; height: 44px; border-radius: 8px;
border: 1px solid #8a6a1c; background: transparent;
color: #ffd700; font: 19px Georgia, serif;
cursor: pointer; -webkit-tap-highlight-color: transparent; padding: 0;
}
.kbkey:active { background: #d8a920; color: #111; }
/* ============ FLOATING WORDS — voices across the view ============ */
#floatwords { position: fixed; inset: 0; pointer-events: none; z-index: 8; overflow: hidden; }
.floatword {
position: absolute; transform: translate(-50%,-100%); max-width: 230px;
background: #0d0a05; border: 1px solid #d8a920; border-radius: 10px;
padding: 5px 10px; font: 12px/1.5 Georgia, serif; color: #e8dcc0;
}
/* ============ SOLID BANNER — my words ============ */
#solidbanner {
position: fixed; top: 76px; left: 14px; max-width: 72%; z-index: 8;
color: #ffe9a8; font: 15px Georgia, serif; text-align: left;
opacity: 0; transition: opacity .6s;
text-shadow: 0 2px 10px #000; pointer-events: none;
}
#solidbanner.show { opacity: 1; }
/* ============ PANELS — shape, render, go ============ */
.optpanel {
position: fixed; display: none; flex-direction: row; gap: 10px; z-index: 6;
max-width: calc(100vw - 100px); overflow-x: auto;
scrollbar-width: none; -webkit-overflow-scrolling: touch; padding: 4px 2px;
}
.optpanel::-webkit-scrollbar { display: none; }
.optpanel.open { display: flex; }
.optpanel button {
width: 46px; height: 46px; flex: 0 0 auto; border-radius: 50%;
background: rgba(20,14,6,0.85); border: 1px solid #8a6a1c;
cursor: pointer; display: flex; align-items: center; justify-content: center;
padding: 0; -webkit-tap-highlight-color: transparent;
}
.optpanel button.sel { background: #d8a920; border-color: #d8a920; }
/* keyboard up: collapse floating controls, keep the view wide */
body.chatting #os-toggle { display: none !important; }
/* #joy NEVER hides — button permanence law */
☕️
The Creator
Loading...