/* KING HOTEL AI Concierge V211 critical black-gold CSS */
:root{
  --bg:#050505;
  --panel:#0b0d11;
  --gold:#d8b45f;
  --gold2:#ffe6a0;
  --line:rgba(226,190,96,.92);
  --white:#fff7df;
  --muted:#d7d7d7;
}
html,body{
  margin:0!important;
  padding:0!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
  background:#050505!important;
  color:var(--white)!important;
  font-family:-apple-system,BlinkMacSystemFont,"Noto Sans TC","Noto Sans JP","Noto Sans KR","Segoe UI",Arial,sans-serif!important;
}
*{box-sizing:border-box!important}
button,input{font-family:inherit!important}
.screen{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100vh!important;
  height:100dvh!important;
  background:radial-gradient(circle at 68% 38%,rgba(230,180,75,.10),transparent 34%),linear-gradient(180deg,#090b10,#040404)!important;
  border:.24vw solid rgba(230,195,102,.78)!important;
  padding:1.0vw!important;
  overflow:hidden!important;
}
.screen:before{
  content:""!important;
  position:absolute!important;
  inset:.7vw!important;
  border:.12vw solid rgba(230,195,102,.76)!important;
  border-radius:1vw!important;
  pointer-events:none!important;
}
.topbar{
  position:relative!important;
  z-index:2!important;
  height:7.2vh!important;
  min-height:54px!important;
  display:grid!important;
  grid-template-columns:18% 1fr 18%!important;
  align-items:center!important;
  border-bottom:.12vw solid rgba(230,195,102,.85)!important;
  gap:1vw!important;
}
.back-btn{
  justify-self:start!important;
  background:rgba(16,17,22,.78)!important;
  color:#fff!important;
  border:.12vw solid var(--line)!important;
  border-radius:.55vw!important;
  height:4.8vh!important;
  min-height:38px!important;
  padding:0 1.4vw!important;
  font-weight:900!important;
  font-size:1.0vw!important;
  box-shadow:inset 0 0 1vw rgba(255,205,90,.06)!important;
}
.brand{
  justify-self:center!important;
  display:flex!important;
  align-items:center!important;
  gap:.55vw!important;
  color:var(--gold2)!important;
  font-family:Georgia,"Times New Roman",serif!important;
  text-shadow:0 0 .45vw rgba(255,195,55,.52)!important;
}
.crown{font-size:1.45vw!important;color:#ffe7a0!important}
.brand-title{font-size:2.0vw!important;font-weight:900!important;letter-spacing:.08em!important}
.no-smoking{
  justify-self:end!important;
  display:flex!important;
  align-items:center!important;
  gap:.45vw!important;
  color:#fff!important;
  font-weight:900!important;
  font-size:.86vw!important;
}
.no-smoking-icon{font-size:1.3vw!important}

.main-layout{
  position:relative!important;
  z-index:2!important;
  height:calc(100% - 7.2vh - 5.2vh)!important;
  display:grid!important;
  grid-template-columns:18% 1fr 18%!important;
  gap:.9vw!important;
  padding-top:.8vw!important;
}
.left-panel{
  border-right:.12vw solid var(--line)!important;
  padding:.2vw .7vw 0 .1vw!important;
  overflow:hidden!important;
}
.left-panel h1{
  margin:0 0 .8vw!important;
  color:#ffe8a4!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:2.35vw!important;
  line-height:1!important;
  letter-spacing:.02em!important;
}
.service-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:.42vw!important;
}
.service-btn{
  height:4.65vw!important;
  min-height:44px!important;
  background:rgba(13,15,20,.72)!important;
  color:#fff!important;
  border:.12vw solid var(--line)!important;
  border-radius:.38vw!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.16vw!important;
  font-weight:900!important;
  font-size:.68vw!important;
  line-height:1.08!important;
  text-align:center!important;
  box-shadow:inset 0 0 .8vw rgba(255,205,90,.05)!important;
}
.service-btn .ico{
  color:#ffe695!important;
  font-size:1.15vw!important;
  line-height:1!important;
}
.chat-section{
  border:.13vw solid var(--line)!important;
  border-radius:.75vw!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:auto auto auto 1fr!important;
  background:rgba(5,7,12,.35)!important;
}
.chat-title{
  padding:.55vw 1vw .25vw!important;
  color:#ffe8a4!important;
  font-size:1.55vw!important;
  font-weight:1000!important;
  line-height:1.05!important;
}
.chat-title span{font-family:Georgia,"Times New Roman",serif!important}
.lang-tabs{
  height:3.0vw!important;
  min-height:34px!important;
  display:grid!important;
  grid-template-columns:repeat(5,1fr)!important;
  align-items:end!important;
  border-top:.10vw solid rgba(230,195,102,.58)!important;
  border-bottom:.10vw solid rgba(230,195,102,.9)!important;
}
.lang-tabs button{
  height:100%!important;
  border:0!important;
  border-right:.08vw solid rgba(230,195,102,.45)!important;
  background:transparent!important;
  color:#fff!important;
  font-size:.95vw!important;
  font-weight:900!important;
}
.lang-tabs button.active{
  color:#ffe681!important;
  text-decoration:underline!important;
  text-decoration-thickness:.18vw!important;
  text-underline-offset:.45vw!important;
}
.input-row{
  display:grid!important;
  grid-template-columns:1fr 15%!important;
  gap:.45vw!important;
  padding:.55vw .75vw!important;
  border-bottom:.08vw solid rgba(230,195,102,.65)!important;
}
.input-row input{
  height:3.0vw!important;
  min-height:36px!important;
  border:.14vw solid #fff0a9!important;
  border-radius:.42vw!important;
  background:rgba(12,14,20,.92)!important;
  color:#fff!important;
  font-size:.95vw!important;
  font-weight:800!important;
  padding:0 .8vw!important;
}
.input-row button{
  height:3.0vw!important;
  min-height:36px!important;
  border:.12vw solid #ffdf8a!important;
  border-radius:.55vw!important;
  background:linear-gradient(180deg,#ffecaa,#d79c2d)!important;
  color:#2b1800!important;
  font-size:1vw!important;
  font-weight:1000!important;
}
.chat-box{
  position:relative!important;
  padding:1vw!important;
  overflow:hidden!important;
}
.message{
  display:flex!important;
  align-items:flex-start!important;
  gap:.7vw!important;
  margin:.45vw 0 1.1vw!important;
}
.message.guest{
  justify-content:flex-end!important;
}
.avatar{
  width:3.3vw!important;
  min-width:3.3vw!important;
  height:3.3vw!important;
  border:.10vw solid var(--line)!important;
  border-radius:50%!important;
  color:#ffe69b!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:1.15vw!important;
  font-weight:900!important;
  background:#121315!important;
}
.avatar small{font-size:.46vw!important;color:#fff!important;line-height:1!important}
.bubble{
  max-width:88%!important;
  border:.08vw solid rgba(255,255,255,.18)!important;
  border-radius:.5vw!important;
  background:rgba(23,26,34,.62)!important;
  color:#fff!important;
  padding:.65vw .85vw!important;
  font-size:1.05vw!important;
  font-weight:800!important;
  line-height:1.55!important;
  box-shadow:0 .2vw .8vw rgba(0,0,0,.24)!important;
}
.guest .bubble{
  background:linear-gradient(180deg,#ffe9a4,#d49c31)!important;
  color:#1b1300!important;
  border-color:#ffe69a!important;
}
.guest-icon{
  width:2.4vw!important;
  height:2.4vw!important;
  border:.25vw solid var(--gold2)!important;
  border-radius:50%!important;
  color:transparent!important;
  margin-top:.2vw!important;
}
.right-panel{
  display:grid!important;
  grid-template-rows:12.5% 1fr 15%!important;
  gap:.65vw!important;
}
.clock-card,.robot-card,.quick-actions button{
  border:.13vw solid var(--line)!important;
  border-radius:.7vw!important;
  background:rgba(12,15,22,.55)!important;
  color:#fff!important;
}
.clock-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
}
.clock-time{
  font-size:3.0vw!important;
  line-height:1!important;
  font-family:Georgia,"Times New Roman",serif!important;
  color:#ffe8a4!important;
  font-weight:900!important;
}
.clock-date{
  margin-top:.25vw!important;
  font-size:.82vw!important;
  font-weight:900!important;
}
.robot-card{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  overflow:hidden!important;
  background:radial-gradient(circle at 50% 48%,rgba(225,180,75,.15),rgba(0,0,0,.18) 58%,rgba(0,0,0,.04) 100%)!important;
}
.robot-card:before,.robot-panel-title,.robot-panel-badges,.robot-badges,.robot-card-badges,.badge-row,.robot-tags,.robot-tag,.pill-row,.robot-pill{
  display:none!important;
}
.robot-svg,.robot-card img{
  display:block!important;
  height:96%!important;
  max-height:96%!important;
  width:auto!important;
  max-width:98%!important;
  object-fit:contain!important;
  margin:auto!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 0 10px rgba(218,176,80,.28))!important;
}
.quick-actions{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:.48vw!important;
}
.quick-actions button{
  font-size:.72vw!important;
  font-weight:900!important;
  line-height:1.15!important;
}
.footer-note{
  position:absolute!important;
  left:1.3vw!important;
  right:1.3vw!important;
  bottom:.7vw!important;
  height:4.5vh!important;
  min-height:38px!important;
  border-top:.12vw solid rgba(230,195,102,.74)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.8vw!important;
  color:#fff6d6!important;
  font-size:1.25vw!important;
  font-weight:900!important;
  letter-spacing:.15em!important;
}
.info-icon{
  border:.12vw solid var(--line)!important;
  border-radius:50%!important;
  width:2.2vw!important;
  height:2.2vw!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#ffe7a0!important;
}
.keyboard-guide{
  position:absolute!important;
  left:1.3vw!important;
  right:1.3vw!important;
  bottom:.4vw!important;
  height:2.1vw!important;
  display:grid!important;
  grid-template-columns:repeat(5,1fr)!important;
  gap:.45vw!important;
  z-index:4!important;
}
.keyboard-guide span{
  border:.08vw solid var(--line)!important;
  border-radius:.35vw!important;
  background:#070707!important;
  color:#fff!important;
  font-size:.62vw!important;
  font-weight:900!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.keyboard-guide span b{color:#27bfff!important;font-size:.85vw!important;margin:0 .18vw!important}
body.keyboard-open .left-panel{visibility:hidden!important}
body.keyboard-open .footer-note{display:none!important}
body.keyboard-open .keyboard-guide{display:none!important}
@media (max-width:900px){
  .brand-title{font-size:18px!important}
  .left-panel h1{font-size:22px!important}
  .service-btn{font-size:10px!important}
}