:root{--blue:#0a4f87;--cyan:#40c9ff;--deep:#031d39;--paper:#edf4fa;--line:#92aec7;--shadow:#163b5a40}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Segoe UI,Arial,sans-serif;color:#173653}body{background:radial-gradient(circle at 25% 10%,#fff,#e0ebf5 50%,#c9d8e7)}button,input{font:inherit}button{cursor:pointer}header{height:72px;padding:10px 20px;display:flex;justify-content:space-between;align-items:center;position:relative;overflow:hidden;background:linear-gradient(145deg,#155f96,#073a68 48%,#031f3e);border-bottom:1px solid #5bbdf0;box-shadow:inset 0 1px #b6efff66,inset 0 -10px 22px #00142688,0 7px 19px #06315366}header:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 15%,#b9f3ff24 50%,transparent 72%)}.brand,.top{display:flex;align-items:center;gap:12px;position:relative;z-index:1}.brand>b{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:27px;color:#eefcff;background:radial-gradient(circle at 30% 22%,#a9efff,#258dcc 35%,#07385f 76%);border:1px solid #9deaff;box-shadow:inset 3px 3px 7px #e9fcff,inset -5px -6px 10px #032642,0 0 15px #38c6ffbb,6px 8px 14px #00192e99;text-shadow:0 0 10px #fff}.brand strong,.brand small{display:block}.brand strong{color:#fff;letter-spacing:.4px;text-shadow:0 2px 2px #00162d,0 0 9px #2fc5ff66}.brand small{color:#c9eaff}.top button,.status{min-height:40px;border:1px solid #5bbdf0;border-radius:11px;color:#eefcff;background:linear-gradient(145deg,#155f96,#073a68 52%,#031f3e);box-shadow:inset 2px 2px 5px #8de3ff55,inset -4px -5px 9px #001426aa,0 6px 12px #00192e77}.top button{padding:9px 12px;font-weight:800}.status{padding:9px 13px;display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:900;letter-spacing:.7px}.status-led{position:relative;width:16px;height:16px;display:grid;place-items:center;flex:0 0 16px;border-radius:50%;animation:ledHalo 1.3s ease-in-out infinite}.status-led:before,.status-led:after{content:"";position:absolute;border-radius:50%}.status-led:before{inset:-7px;background:radial-gradient(circle,#1e75d788,#0b4da244 43%,transparent 73%);animation:ledOuter 1.3s ease-in-out infinite}.status-led:after{inset:-2px;border:1px solid #2e78cc88;animation:ledRing 1.3s ease-in-out infinite}.status-led-core{width:10px;height:10px;border-radius:50%;background:#0b4da2;animation:ledCore 1.3s ease-in-out infinite}@keyframes ledCore{0%,100%{opacity:.3;transform:scale(.78);box-shadow:0 0 4px #072e64}50%{opacity:1;transform:scale(1.25);box-shadow:0 0 8px #397fd0,0 0 18px #145bb5,0 0 32px #073b82}}@keyframes ledOuter{0%,100%{opacity:.3;transform:scale(.55)}50%{opacity:1;transform:scale(1.45)}}@keyframes ledRing{0%,100%{opacity:.25;transform:scale(.7)}50%{opacity:1;transform:scale(1.35)}}@keyframes ledHalo{0%,100%{filter:brightness(.6)}50%{filter:brightness(1.25)}}
main{padding:16px;display:grid;grid-template-columns:548px minmax(520px,1fr) 350px;gap:16px;align-items:start}.left,.answerBox,.adminsOnly,.bottomTopics{border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#fff,#e0eaf4);box-shadow:14px 18px 35px #28445e2b,-7px -7px 18px #fff,inset 0 1px #fff}.left,.middle,.adminsOnly{height:620px}.left{padding:53px 17px 17px;position:relative}.left>label{position:absolute;top:15px;left:17px;padding:8px 11px;border-radius:9px;background:#fff;color:#23588e;font-size:11px;font-weight:900;letter-spacing:1px;box-shadow:0 6px 14px #344f6a25}.visual{width:512px;height:512px;position:relative;border:2px solid #d7f1ff;border-radius:25px;background:#061e39;box-shadow:inset 0 0 0 4px #ffffffaa,inset 0 0 24px #257ecb55,0 0 0 1px #4c82b3,0 17px 30px #193f653b,0 0 25px #3ca9eb66;isolation:isolate}.visual:after{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;border-radius:22px;background:linear-gradient(115deg,transparent 25%,#d3f8ff4f 48%,transparent 68%);background-size:240% 100%;box-shadow:inset 8px 8px 18px #fff5,inset -9px -10px 20px #174d8426;animation:holoSweep 5.8s linear infinite}.visual img,.visual video{position:absolute;inset:0;width:512px;height:512px;object-fit:cover;border-radius:22px}.visual video{display:none;background:transparent}.visual.playing video{display:block}.visual.playing img{display:none}.visual:not(.playing) #fallback{animation:fallbackFloat 5s ease-in-out infinite,fallbackGlow 3.2s ease-in-out infinite}.visual:not(.playing):before{content:"";position:absolute;z-index:-1;left:6%;right:6%;bottom:-16px;height:39px;border-radius:50%;background:radial-gradient(ellipse,#43caffbb,#166eb066 43%,transparent 74%);filter:blur(10px);animation:basePulse 3.2s ease-in-out infinite}@keyframes fallbackFloat{0%,100%{transform:translateY(0) scale(.985)}50%{transform:translateY(-12px) scale(1.01)}}@keyframes fallbackGlow{0%,100%{filter:drop-shadow(0 0 9px #168fd077) drop-shadow(0 17px 18px #123f6a55)}50%{filter:drop-shadow(0 0 24px #56d5ffff) drop-shadow(0 25px 30px #126da399)}}@keyframes basePulse{0%,100%{opacity:.45;transform:scaleX(.82)}50%{opacity:1;transform:scaleX(1.08)}}@keyframes holoSweep{from{background-position:160% 0}to{background-position:-120% 0}}
.middle{display:block}.answerBox{height:620px;display:grid;grid-template-rows:auto 1fr auto;overflow:hidden}.answerHead{padding:13px 15px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #bac8d6;background:linear-gradient(#fff,#edf3f8)}.answerHead>b{font-size:12px;color:#245689;letter-spacing:1px}.answerHead button,.free button,.backCategory{border:1px solid #65add5;border-radius:10px;padding:9px 11px;color:#174776;background:linear-gradient(145deg,#fff,#d4e8f5 55%,#adc9dc);box-shadow:inset 2px 2px 5px #fff,inset -4px -5px 8px #7892a633,0 6px 12px #123d5c35;font-weight:800;transition:.2s}.answerHead button:hover,.free button:hover,.backCategory:hover{transform:translateY(-3px);border-color:#31b9f4;box-shadow:inset 2px 2px 5px #fff,inset -4px -5px 8px #5c86a744,0 10px 18px #104a7155,0 0 16px #2fc2ff77}.answerBody{padding:20px 22px;overflow:auto}.answerBody h1{margin:0 0 12px;color:#174f84}.free{padding:13px 15px;border-top:1px solid #b7c5d4;background:#f7fafddd}.free>label{font-size:10px;font-weight:900;color:#245689}.free>div{display:flex;gap:7px;margin-top:7px}.free input{flex:1;min-width:0;padding:11px;border:1px solid #9db0c4;border-radius:10px}#mic{width:52px;height:47px;padding:0;display:grid;place-items:center}#mic svg{width:31px;height:31px;filter:drop-shadow(0 2px 1px #fff) drop-shadow(0 3px 3px #164b76aa)}
.adminsOnly{padding:15px;display:flex;flex-direction:column;overflow:hidden}.heading{display:flex;justify-content:space-between;align-items:end}.adminsTitle{flex:0 0 auto;margin-bottom:13px;padding:12px 13px;border:1px solid #61cfff;border-radius:14px;background:linear-gradient(145deg,#123f73,#062a52);box-shadow:inset 2px 2px 6px #8fe5ff44,inset -5px -6px 10px #00152d99,0 8px 16px #082e4f55,0 0 18px #2abaff66}.adminsTitle b{color:#f4fcff;font-size:12px;letter-spacing:1.2px;text-shadow:0 2px 2px #00152e,0 0 10px #42caff}.adminsTitle small{color:#aeeaff;font-weight:700}#admins{display:grid;grid-template-columns:1fr;gap:9px;overflow:auto;padding:3px 4px 9px}.admin3d{--tone:#167fc0;width:100%;min-height:64px;margin:0;padding:9px 12px;display:grid;grid-template-columns:48px 1fr 20px;gap:11px;align-items:center;border:1px solid #73d7ff;border-radius:17px;color:#f7fdff;background:linear-gradient(145deg,color-mix(in srgb,var(--tone) 88%,#fff 12%),color-mix(in srgb,var(--tone) 58%,#031d39 42%));box-shadow:inset 3px 3px 7px #d0f5ff55,inset -7px -8px 14px #00152eaa,0 9px 16px #092f4f66,0 0 17px color-mix(in srgb,var(--tone) 70%,transparent);text-shadow:0 2px 2px #00152e,0 0 8px #87e5ff88;transition:.2s;position:relative;overflow:hidden;text-align:left}.admin3d:nth-child(2){--tone:#167bba}.admin3d:nth-child(3){--tone:#16a0a5}.admin3d:nth-child(4){--tone:#4366bd}.admin3d:nth-child(5){--tone:#6a50c5}.admin3d:nth-child(6){--tone:#b06a1c}.admin3d:nth-child(7){--tone:#1677ce}.admin3d:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 18%,#ffffff10 36%,#d7f8ff66 49%,transparent 78%);transform:translateX(-145%);transition:.58s}.admin3d:hover:before{transform:translateX(145%)}.admin3d i{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-style:normal;font-size:22px;color:#fff;background:radial-gradient(circle at 30% 22%,#fff,#87e6ff 20%,var(--tone) 50%,#052f59 82%);border:1px solid #c6f5ff;box-shadow:inset 3px 3px 7px #fff,inset -6px -7px 11px #012943,0 0 16px #4ed4ffbb,6px 8px 13px #001a31aa}.admin3d span,.admin3d em{position:relative;z-index:1}.admin3d span b,.admin3d span small{display:block}.admin3d span b{font-size:11px;line-height:1.14;color:#fff}.admin3d span small{font-size:9px;color:#c9edff;margin-top:4px}.admin3d em{font-style:normal;font-size:24px;color:#b9efff;text-shadow:0 0 12px #4acfff}.admin3d:hover,.admin3d.active{transform:perspective(600px) translateX(-5px) translateY(-3px) rotateY(-2deg) scale(1.018);filter:brightness(1.16) saturate(1.18);border-color:#e6fbff;box-shadow:inset 3px 3px 8px #e4faff77,inset -7px -8px 14px #00152eaa,0 14px 23px #08294288,0 0 29px color-mix(in srgb,var(--tone) 88%,#fff 12%)}
.bottomTopics{margin:0 16px 18px;padding:15px 16px 17px}.bottomTitle{display:flex;justify-content:space-between;align-items:end;padding-bottom:10px;margin-bottom:12px;border-bottom:1px solid #b5c6d6}.bottomTitle b{font-size:12px;letter-spacing:1px;color:#174d84}.bottomTitle small{color:#58738a;font-weight:600}.bottomNav{display:grid;grid-template-columns:repeat(6,minmax(145px,1fr));gap:14px}.bottomTopic{min-height:88px;padding:12px 14px;display:grid;grid-template-columns:58px 1fr 24px;align-items:center;gap:8px;text-align:left;border:1px solid #5bbdf0;border-radius:20px;color:#eefdff;background:linear-gradient(145deg,#155f96,#073a68 47%,#031f3e);box-shadow:inset 3px 3px 7px #8de3ff55,inset -7px -8px 15px #001426aa,0 10px 18px #06315366,0 0 18px #1ca8ee55;text-shadow:0 2px 2px #00162d,0 0 8px #2fc5ff77;transition:.22s}.bottomTopic i{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;font-style:normal;font-size:26px;background:radial-gradient(circle at 32% 25%,#9beaff,#248fcb 33%,#084a7a 70%,#032844);border:1px solid #91e8ff;box-shadow:inset 3px 3px 7px #d7f8ff,inset -5px -6px 10px #022640,0 0 15px #38c6ffcc}.bottomTopic b{font-size:12px;letter-spacing:.8px}.bottomTopic em{font-style:normal;font-size:26px;color:#8de6ff}.bottomTopic:hover{transform:perspective(700px) translateY(-7px) rotateX(4deg) scale(1.025);border-color:#b5f2ff;box-shadow:inset 3px 3px 8px #b6efff66,inset -7px -8px 15px #001426aa,0 18px 28px #05294788,0 0 28px #24bdffcc}.bottomTopic.active{background:linear-gradient(145deg,#277fd2,#284d9e 50%,#10275f);border-color:#dcfaff;animation:activePulse 2.1s ease-in-out infinite}@keyframes activePulse{50%{filter:brightness(1.16);box-shadow:inset 0 0 24px #77e4ffaa,0 0 0 2px #adf2ff88,0 0 42px #2ca5ffff}}
.categoryIntro{margin-bottom:13px;padding:12px;border:1px solid #b0c4d6;border-radius:12px;background:linear-gradient(145deg,#fff,#e7f0f8)}.serviceButtons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.serviceButton{min-height:76px;padding:12px 14px;display:grid;grid-template-columns:52px 1fr 22px;gap:9px;align-items:center;text-align:left;border:1px solid #5bbce9;border-radius:18px;color:#123f68;background:linear-gradient(145deg,#fff,#d9effb 48%,#b9d9ee);box-shadow:inset 3px 3px 7px #fff,inset -6px -7px 13px #7096b43b,0 9px 16px #143e5d35;transition:.2s}.serviceButton i{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;font-style:normal;font-size:24px;background:radial-gradient(circle at 30% 22%,#baf1ff,#348fc4 35%,#0b4f81 72%);color:#fff;box-shadow:inset 3px 3px 6px #e8fbff,inset -5px -6px 9px #063256,0 0 14px #22b8ff99}.serviceButton em{font-style:normal;font-size:24px}.serviceButton:hover{transform:translateY(-5px) scale(1.018);border-color:#2dafff;box-shadow:inset 3px 3px 8px #fff,inset -6px -7px 13px #4d88b344,0 15px 24px #0d527d55,0 0 23px #28bfff99}.backCategory{margin-bottom:12px}.localDetail{line-height:1.58}.contact{display:grid;gap:8px;padding:14px;border:1px solid #a8bdd1;border-radius:14px;background:linear-gradient(145deg,#fff,#e6eef7)}.contact p{display:grid;gap:3px;margin:0;padding-bottom:7px;border-bottom:1px solid #c7d4e0}.contact a{color:#185e9a}.contact .site{padding:10px;border-radius:10px;background:#1d69a5;color:#fff;text-decoration:none;text-align:center;font-weight:800}.answerBox.topic-open #title{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;margin:-6px -7px 19px;padding:16px 20px;border:1px solid #6bd7ff;border-radius:18px;color:#eefcff;font-size:25px;font-weight:950;letter-spacing:1.4px;text-transform:uppercase;background:linear-gradient(135deg,#0b69a6,#173f87 48%,#321f77);text-shadow:0 3px 2px #00162f,0 0 8px #83e8ff,0 0 20px #239cff;box-shadow:inset 3px 3px 8px #a7edff55,inset -8px -9px 16px #040e3baa,0 10px 22px #082d5c66,0 0 26px #30bdff99;animation:titleBreath 2.8s ease-in-out infinite}.title-gem{width:48px;height:48px;flex:0 0 48px;border-radius:14px;display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#c5f6ff,#3aa6da 35%,#0a4479 72%);border:1px solid #a4edff;box-shadow:inset 3px 3px 6px #eaffff,inset -5px -6px 10px #062a55,0 0 17px #42d1ffdd}.title-spark{margin-left:auto}@keyframes titleBreath{50%{filter:brightness(1.12);box-shadow:inset 3px 3px 8px #c7f5ff77,inset -8px -9px 16px #040e3baa,0 12px 26px #082d5c77,0 0 36px #30bdffcc}}
#listen{position:fixed;z-index:100;inset:0;display:none;place-items:center;background:#dfe7f1ee}#listen.show{display:grid}#listen>div{width:290px;height:290px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#fff,#cbd9e8);box-shadow:0 0 0 14px #286ca333,0 0 70px #286ca366}#listen small{margin-top:8px}@media(max-width:1450px){main{grid-template-columns:548px minmax(460px,1fr) 320px}.bottomNav{grid-template-columns:repeat(3,1fr)}}@media(max-width:1150px){main{grid-template-columns:1fr}.left{justify-self:center}.left,.middle,.adminsOnly{height:auto;min-height:620px}.answerBox{height:auto;min-height:620px}}@media(max-width:760px){header{height:auto}.status{display:none}.left{width:100%;min-height:0}.visual,.visual img,.visual video{width:100%;height:auto;aspect-ratio:1}.bottomTitle{display:block}.bottomTitle small{display:block;margin-top:5px}.bottomNav,.serviceButtons{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}
/* Administration buttons: text-only, no icons */
#admins{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:repeat(7,minmax(60px,1fr))!important;gap:11px!important;overflow:visible!important;flex:1 1 auto!important;min-height:0!important;padding:4px 5px 6px!important}
.admin3d{--tone:#087bb8;position:relative!important;isolation:isolate!important;overflow:hidden!important;width:100%!important;min-height:60px!important;margin:0!important;padding:10px 15px 10px 18px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 24px!important;align-items:center!important;gap:10px!important;text-align:left!important;border:2px solid #77dfff!important;border-radius:18px!important;color:#fff!important;background:linear-gradient(145deg,color-mix(in srgb,var(--tone) 88%,#72dfff 12%),color-mix(in srgb,var(--tone) 63%,#031b37 37%))!important;box-shadow:inset 4px 4px 9px #d8f7ff3d,inset -8px -9px 15px #001326b8,0 10px 18px #062d4d70,0 0 18px color-mix(in srgb,var(--tone) 72%,transparent)!important;text-shadow:0 2px 2px #00152e,0 0 10px #67dcff99!important;transition:transform .2s ease,filter .2s ease,border-color .2s ease,box-shadow .2s ease!important}
.admin3d:nth-child(2){--tone:#0871ad}.admin3d:nth-child(3){--tone:#078f96}.admin3d:nth-child(4){--tone:#345bb5}.admin3d:nth-child(5){--tone:#5744b7}.admin3d:nth-child(6){--tone:#a45c12}.admin3d:nth-child(7){--tone:#096bc0}.admin3d:before{content:"";position:absolute;z-index:-1;inset:-1px;background:linear-gradient(108deg,transparent 18%,#ffffff12 36%,#e7faff7d 49%,#ffffff0c 61%,transparent 79%);transform:translateX(-145%);transition:transform .58s ease}.admin3d:hover:before,.admin3d.active:before{transform:translateX(145%)}.admin3d:after{content:"";position:absolute;left:14px;right:14px;top:5px;height:1px;background:linear-gradient(90deg,transparent,#d6f7ff,transparent);opacity:.75}.admin3d span{min-width:0;position:relative;z-index:1}.admin3d span b,.admin3d span small{display:block!important}.admin3d span b{font-size:11px!important;line-height:1.18!important;color:#fff!important;letter-spacing:.45px!important}.admin3d span small{font-size:9px!important;color:#cbeeff!important;margin-top:4px!important;font-weight:600!important}.admin3d em{position:relative;z-index:1;font-style:normal!important;font-size:26px!important;color:#c9f4ff!important;text-align:right!important;text-shadow:0 0 12px #4acfff!important}.admin3d:hover{transform:perspective(700px) translateX(-5px) translateY(-4px) rotateY(-2deg) scale(1.018)!important;filter:brightness(1.18) saturate(1.18)!important;border-color:#f0fdff!important;box-shadow:inset 4px 4px 10px #effdff55,inset -8px -9px 15px #001326b8,0 15px 25px #0827428a,0 0 31px color-mix(in srgb,var(--tone) 88%,#fff 12%)!important}.admin3d.active{transform:translateX(-4px) scale(1.015)!important;filter:brightness(1.2) saturate(1.22)!important;border-color:#fff!important;box-shadow:inset 0 0 22px #aeeeff55,inset -8px -9px 15px #001326aa,0 13px 23px #08274288,0 0 38px color-mix(in srgb,var(--tone) 90%,#fff 10%)!important;animation:adminActivePulse 2s ease-in-out infinite}@keyframes adminActivePulse{50%{filter:brightness(1.32) saturate(1.25);box-shadow:inset 0 0 28px #c8f6ff66,inset -8px -9px 15px #001326aa,0 15px 27px #08274299,0 0 48px color-mix(in srgb,var(--tone) 92%,#fff 8%)}}
@media(max-width:1150px){#admins{grid-template-rows:none!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}.admin3d{min-height:68px!important}}@media(max-width:650px){#admins{grid-template-columns:1fr!important}}
/* Consistent blue theme styling across all administration buttons */
.admin3d,
.admin3d:nth-child(2),
.admin3d:nth-child(3),
.admin3d:nth-child(4),
.admin3d:nth-child(5),
.admin3d:nth-child(6),
.admin3d:nth-child(7){
  --tone:#0a4f87!important;
  color:#ffffff!important;
  border-color:#7fe4ff!important;
  background:linear-gradient(145deg,#1774b6 0%,#0a4f87 45%,#062a52 100%)!important;
  box-shadow:
    inset 4px 4px 9px rgba(216,247,255,.25),
    inset -8px -9px 15px rgba(0,19,38,.72),
    0 10px 18px rgba(6,45,77,.45),
    0 0 22px rgba(64,201,255,.55)!important;
}
.admin3d span b{color:#ffffff!important;text-shadow:0 2px 2px #00152e,0 0 9px rgba(103,220,255,.65)!important}
.admin3d span small{color:#cbeeff!important}
.admin3d em{color:#d7f7ff!important;text-shadow:0 0 12px #40c9ff!important}
.admin3d:hover{
  transform:perspective(700px) translateX(-5px) translateY(-4px) rotateY(-2deg) scale(1.018)!important;
  filter:brightness(1.15) saturate(1.12)!important;
  border-color:#effdff!important;
  box-shadow:
    inset 4px 4px 10px rgba(239,253,255,.35),
    inset -8px -9px 15px rgba(0,19,38,.72),
    0 15px 25px rgba(8,39,66,.54),
    0 0 35px rgba(64,201,255,.85)!important;
}
.admin3d.active{
  filter:brightness(1.18) saturate(1.15)!important;
  border-color:#ffffff!important;
  box-shadow:
    inset 0 0 24px rgba(174,238,255,.38),
    inset -8px -9px 15px rgba(0,19,38,.66),
    0 13px 23px rgba(8,39,66,.54),
    0 0 40px rgba(64,201,255,.90)!important;
}
@keyframes adminActivePulse{
  50%{
    filter:brightness(1.28) saturate(1.18);
    box-shadow:
      inset 0 0 30px rgba(200,246,255,.44),
      inset -8px -9px 15px rgba(0,19,38,.66),
      0 15px 27px rgba(8,39,66,.60),
      0 0 50px rgba(64,201,255,.95)
  }
}
/* Speech avatar and video display styling */
.visual.playing::after,.visual.playing::before{display:none!important;content:none!important;animation:none!important;background:none!important;box-shadow:none!important;filter:none!important}
.visual.playing video{filter:none!important;transform:none!important;opacity:1!important;box-shadow:none!important}
.visual:not(.playing){background:linear-gradient(145deg,#eef2f6,#d9e1e9)!important}
/* Speech avatar: centered, fully visible, transparent background */
.visual:not(.playing){
  background:linear-gradient(145deg,#eef2f6 0%,#d9e1e9 52%,#cbd6e1 100%)!important;
}
.visual:not(.playing) #fallback[src*="assistant-fallback-avatar-gray"]{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  background:transparent!important;
  border-radius:22px!important;
  transform:none!important;
  transform-origin:center center!important;
  animation:speechAvatarFloat 5s ease-in-out infinite,speechAvatarGlow 3.2s ease-in-out infinite!important;
}
@keyframes speechAvatarFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}
@keyframes speechAvatarGlow{
  0%,100%{filter:drop-shadow(0 0 8px rgba(22,143,208,.42)) drop-shadow(0 14px 15px rgba(18,63,106,.28))}
  50%{filter:drop-shadow(0 0 20px rgba(86,213,255,.85)) drop-shadow(0 20px 22px rgba(18,109,163,.48))}
}
@media(prefers-reduced-motion:reduce){
  .visual:not(.playing) #fallback[src*="assistant-fallback-avatar-gray"]{animation:none!important;transform:none!important}
}
/* Transparent speech fallback avatar and bottom navigation icon styling */
.visual:not(.playing) #fallback[src*="assistant-fallback-avatar-transparent"]{object-fit:contain!important;object-position:center!important;background:transparent!important}
.topicIcon3d{display:grid!important;place-items:center!important;overflow:visible!important;position:relative!important;background:radial-gradient(circle at 28% 20%,#eafdff 0%,#54caff 26%,#1769b5 58%,#082d63 100%)!important;border:2px solid rgba(209,248,255,.95)!important;box-shadow:inset 4px 4px 8px rgba(255,255,255,.92),inset -7px -8px 13px rgba(0,25,70,.82),0 0 18px rgba(48,197,255,.9),7px 9px 14px rgba(0,20,54,.65)!important}
.topicIcon3d::after{content:"";position:absolute;inset:4px;border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.35),transparent 45%);pointer-events:none}
.topicIcon3d svg{width:39px;height:39px;display:block;filter:drop-shadow(0 2px 1px rgba(255,255,255,.65)) drop-shadow(0 0 7px rgba(100,225,255,.95))}
.bottomTopic:hover .topicIcon3d{transform:translateY(-2px) rotateX(8deg) scale(1.08)!important;box-shadow:inset 4px 4px 9px rgba(255,255,255,1),inset -7px -8px 13px rgba(0,25,70,.8),0 0 28px rgba(62,211,255,1),8px 12px 18px rgba(0,20,54,.7)!important}
/* Avatar display and white thematic icon styling */
.visual:not(.playing) #fallback[src*="assistant-fallback-avatar-clean"]{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  background:linear-gradient(145deg,#eef2f6 0%,#d9e1e9 52%,#cbd6e1 100%)!important;
  border-radius:22px!important;
}
/* Icon holder keeps its 3D blue styling; SVG marks inside are always white. */
.topicIcon3d svg *{
  fill:#fff!important;
  stroke:#fff!important;
}
.topicIcon3d svg [fill="none"]{fill:none!important}
.topicIcon3d svg defs{display:none!important}
.topicIcon3d svg{
  filter:drop-shadow(0 2px 1px rgba(255,255,255,.75)) drop-shadow(0 0 8px rgba(255,255,255,.95))!important;
}
/* Matte avatar background and white line-icon styling */
.visual:not(.playing) #fallback[src*="assistant-fallback-avatar-gray-clean"]{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;background:linear-gradient(145deg,#eef2f6,#d9e1e9 52%,#cbd8e4)!important}
.topicIcon3d{background:linear-gradient(145deg,#195b8f,#07365f 55%,#03233f)!important;border:1px solid #89dcff!important;box-shadow:inset 2px 2px 5px #c7f3ff55,inset -5px -6px 10px #00182f99,0 5px 10px #00192e77!important}
.topicIcon3d::after{display:none!important}
.topicIcon3d svg{width:42px!important;height:42px!important;display:block!important;overflow:visible!important;filter:drop-shadow(0 2px 1px #00172d)!important}
.topicIcon3d svg *{fill:none!important;stroke:#fff!important;stroke-width:3.6!important;stroke-linecap:round!important;stroke-linejoin:round!important;opacity:1!important}
.bottomTopic:hover .topicIcon3d{transform:translateY(-2px) scale(1.06)!important;box-shadow:inset 2px 2px 6px #eafdff77,inset -5px -6px 10px #00182f99,0 0 14px #4dcfff88!important}
/* Fallback avatar wording and status indicator light styling */
.visual:not(.playing) #fallback[src*="FallBackClear.jpg"]{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center center!important;background:#eef2f6!important;border-radius:22px!important}
.status-led{width:10px!important;height:10px!important;flex:0 0 10px!important;animation:whiteLedHalo 1.3s ease-in-out infinite!important}
.status-led-core{width:6px!important;height:6px!important;background:#fff!important;animation:whiteLedCore 1.3s ease-in-out infinite!important}
.status-led::before{inset:-4px!important;background:radial-gradient(circle,rgba(255,255,255,.88) 0%,rgba(255,255,255,.26) 46%,transparent 74%)!important;animation:whiteLedOuter 1.3s ease-in-out infinite!important}
.status-led::after{inset:-1px!important;border:1px solid rgba(255,255,255,.68)!important;animation:whiteLedRing 1.3s ease-in-out infinite!important}
@keyframes whiteLedCore{0%,100%{opacity:.45;transform:scale(.82);box-shadow:0 0 2px #fff}50%{opacity:1;transform:scale(1.08);box-shadow:0 0 4px #fff,0 0 8px rgba(255,255,255,.8)}}
@keyframes whiteLedOuter{0%,100%{opacity:.28;transform:scale(.65)}50%{opacity:.8;transform:scale(1.12)}}
@keyframes whiteLedRing{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:.75;transform:scale(1.1)}}
@keyframes whiteLedHalo{0%,100%{filter:brightness(.8)}50%{filter:brightness(1.1)}}
/* Shows the administration logo in the left visual panel when an administration is selected. */
.visual.admin-logo-mode::after{display:none!important}
.visual.admin-logo-mode::before{display:none!important}
.visual.admin-logo-mode #fallback{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  padding:12px!important;
  background:linear-gradient(145deg,#eef2f6 0%,#d9e1e9 52%,#cbd8e4 100%)!important;
  border-radius:22px!important;
  animation:none!important;
  transform:none!important;
  filter:drop-shadow(0 8px 14px rgba(4,38,75,.28))!important;
}
/* Top-left brand element acts as a Home button. */
.brand[role="button"]{cursor:pointer;user-select:none;border-radius:14px;transition:filter .18s ease,transform .18s ease}
.brand[role="button"]:hover{filter:brightness(1.12);transform:translateY(-1px)}
.brand[role="button"]:focus-visible{outline:2px solid #b8f1ff;outline-offset:4px}
/* Speech avatar shown only while speaking; premium 7AD image shown on Home/brand. */
.visual:not(.playing) #fallback[src*="Gemini_Generated_Image_oopcheoopcheoopc.jpg"]{
  width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;
  background:linear-gradient(145deg,#eef2f6,#d9e1e9 52%,#cbd8e4)!important;border-radius:22px!important;
}
/* Visual modes for the premium Home image and administration logos. */
.visual:not(.playing):not(.admin-logo-mode) #fallback[src*="assistant-fallback-premium.jpg"]{
  display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;
  object-position:center!important;padding:0!important;background:transparent!important;border-radius:22px!important;
}
.visual.admin-logo-mode #fallback{display:block!important;visibility:visible!important;opacity:1!important}

/* Competency (ΑΡΜΟΔΙΟΤΗΤΕΣ) module styling */
.answerBox.competencies-open .answerBody{overflow:auto!important;padding:14px 18px!important}
.answerBox.competencies-open #title{margin-bottom:10px!important;padding:11px 16px!important;min-height:58px!important;font-size:20px!important}
.answerBox.competencies-open .title-gem{width:38px!important;height:38px!important;flex-basis:38px!important}
.competency-grid{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;gap:8px}
.competency-button{min-height:0;padding:8px 12px;display:grid;grid-template-columns:minmax(0,1fr) 18px;align-items:center;gap:8px;text-align:left;border:1px solid #5bbce9;border-radius:13px;color:#123f68;background:linear-gradient(145deg,#fff,#d9effb 48%,#b9d9ee);box-shadow:inset 2px 2px 5px #fff,inset -5px -6px 10px #7096b433,0 6px 12px #143e5d2f;transition:.18s}
.competency-button b{font-size:11px;line-height:1.16}.competency-button em{font-style:normal;font-size:22px;color:#17679f}.competency-button:hover{transform:translateY(-2px);border-color:#2dafff;box-shadow:inset 2px 2px 6px #fff,inset -5px -6px 10px #4d88b344,0 9px 16px #0d527d44,0 0 14px #28bfff77}
.back-competencies{margin:0 0 12px;padding:9px 12px;border:1px solid #65add5;border-radius:10px;color:#174776;background:linear-gradient(145deg,#fff,#d4e8f5 55%,#adc9dc);box-shadow:inset 2px 2px 5px #fff,0 6px 12px #123d5c35;font-weight:800}
.competency-text{line-height:1.62;color:#273f55}.competency-text p{margin:0 0 13px}.answerBox.competency-detail-open .answerBody{overflow:auto!important}
@media(max-width:760px){.answerBox.competencies-open .answerBody{overflow:auto!important}.competency-grid{height:auto;grid-template-columns:1fr;grid-template-rows:none}.competency-button{min-height:54px}}
/* Premium styling for the competency grid buttons. */
.answerBox.competencies-open .answerBody{padding:15px 18px!important;background:radial-gradient(circle at 50% 0,#f9fdff,#e5eff8)!important}
.competency-grid{gap:11px!important}
.competency-button{position:relative!important;overflow:hidden!important;padding:10px 14px!important;border:2px solid #62d4ff!important;border-radius:17px!important;color:#f7fdff!important;background:linear-gradient(145deg,#197ab8 0%,#0a4f87 52%,#052a52 100%)!important;box-shadow:inset 3px 3px 7px #b8efff44,inset -7px -8px 13px #00152eaa,0 8px 15px #0b355568,0 0 16px #31c4ff66!important;text-shadow:0 2px 2px #00152e,0 0 8px #68dcff88!important;transition:transform .2s ease,filter .2s ease,box-shadow .2s ease!important}
.competency-button::before{content:"";position:absolute;inset:0;background:linear-gradient(108deg,transparent 20%,#ffffff15 37%,#d8f8ff7d 49%,transparent 72%);transform:translateX(-145%);transition:transform .56s ease}.competency-button:hover::before{transform:translateX(145%)}
.competency-button b{position:relative;z-index:1;font-size:12px!important;letter-spacing:.25px!important}.competency-button em{position:relative;z-index:1;color:#c8f4ff!important;text-shadow:0 0 11px #49ceff!important}.competency-button:hover{transform:perspective(600px) translateY(-4px) scale(1.018)!important;filter:brightness(1.16)!important;border-color:#e9fbff!important;box-shadow:inset 3px 3px 8px #dcf8ff55,inset -7px -8px 13px #00152eaa,0 13px 22px #082c4b88,0 0 28px #32c8ffbb!important}

/* Ορατή, λεπτή μπάρα scroll στο δεξί πάνελ (answerBody) όταν το περιεχόμενο
   είναι μεγαλύτερο από το ύψος του panel. */
.answerBody{scrollbar-width:thin;scrollbar-color:#1d69a5 #e3ecf5}
.answerBody::-webkit-scrollbar{width:10px}
.answerBody::-webkit-scrollbar-track{background:#e3ecf5;border-radius:8px;margin:4px 0}
.answerBody::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#3aa0e0,#0b4f87);border-radius:8px;border:2px solid #e3ecf5}
.answerBody::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#4bb4f2,#0d5a99)}

/* Φωτογραφία προσώπου δίπλα (όχι πάνω) από το κείμενο βιογραφικού στο δεξί
   πάνελ, όταν παίζει βίντεο στο αριστερό πάνελ (#visual). Το κείμενο περνά
   γύρω της μέσω CSS float. */
.v40PersonPhoto{float:left;width:46%;max-width:440px;margin:0 20px 14px 0}
.v40PersonPhoto img{display:block;width:100%;border-radius:16px;border:1px solid #a8bdd1;box-shadow:0 10px 20px #163b5a3d}
@media(max-width:760px){.v40PersonPhoto{float:none;width:100%;max-width:280px;margin:0 auto 14px}}

/* Διακριτικό version tag δίπλα στο status indicator του header */
.v-tag{font-size:11px;color:#7d95ab;background:rgba(125,149,171,0.12);border:1px solid rgba(125,149,171,0.3);border-radius:6px;padding:2px 7px;margin-left:8px;font-weight:600;letter-spacing:.3px}

/* Ενσωματωμένο βίντεο με χειροκίνητη αναπαραγωγή (ΔΡΑΣΕΙΣ, ΑΡΜΟΔΙΟΤΗΤΕΣ) και
   κάρτα εξωτερικού συνδέσμου (ΔΙΑΚΡΙΣΕΙΣ, ΕΝΗΜΕΡΩΣΗ). */
.v43VideoEmbed{
  margin:0 auto 20px;
  max-width:460px;
  border-radius:18px;
  overflow:hidden;
  border:3px solid #62d4ff;
  box-shadow:inset 3px 3px 8px #b8efff33,inset -6px -7px 12px #00152e88,0 10px 22px #0b355568,0 0 18px #31c4ff44;
  background:#0a2036;
}
.v43VideoEmbed video{display:block;width:100%;aspect-ratio:16/9;background:#000}
@media(max-width:760px){.v43VideoEmbed{max-width:100%}}

.v43LinkoutText{line-height:1.62;color:#273f55;margin:0 0 22px;font-size:15.5px}

.v43LinkButton{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 26px;border:2px solid #62d4ff;border-radius:18px;
  color:#f7fdff;text-decoration:none;font-weight:800;font-size:15px;letter-spacing:.2px;
  background:linear-gradient(145deg,#197ab8 0%,#0a4f87 52%,#052a52 100%);
  box-shadow:inset 3px 3px 7px #b8efff44,inset -7px -8px 13px #00152eaa,0 10px 18px #0b355568,0 0 18px #31c4ff55;
  text-shadow:0 2px 2px #00152e,0 0 8px #68dcff88;
  transition:transform .2s ease,filter .2s ease,box-shadow .2s ease;
}
.v43LinkButton::before{content:"";position:absolute;inset:0;background:linear-gradient(108deg,transparent 20%,#ffffff15 37%,#d8f8ff7d 49%,transparent 72%);transform:translateX(-145%);transition:transform .56s ease}
.v43LinkButton:hover::before{transform:translateX(145%)}
.v43LinkButton em{font-style:normal;font-size:19px;color:#c8f4ff;text-shadow:0 0 11px #49ceff}
.v43LinkButton:hover{transform:perspective(600px) translateY(-3px) scale(1.02);filter:brightness(1.14);border-color:#e9fbff;box-shadow:inset 3px 3px 8px #dcf8ff55,inset -7px -8px 13px #00152eaa,0 14px 24px #082c4b88,0 0 26px #32c8ffbb}

/* v55: σε ψηλές οθόνες (π.χ. kiosk fullscreen) κεντράρει κάθετα όλο το
   περιεχόμενο ώστε ο κενός χώρος να μοιράζεται πάνω/κάτω αντί να μένει όλος
   κάτω. Δεν ενεργοποιείται καθόλου σε συνηθισμένα παράθυρα/laptop. */
@media(min-height:900px){
  body{display:flex;flex-direction:column;justify-content:center;min-height:100vh}
}

/* v55: μικρό, διακριτικό κουμπί εξόδου για kiosk mode σε οθόνη αφής
   (χωρίς πληκτρολόγιο δεν υπάρχει άλλος τρόπος να κλείσει το παράθυρο). */
#v55ExitBtn{
  position:fixed;bottom:14px;right:14px;z-index:9999;
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1px solid #5bbdf0;color:#eefcff;font-size:15px;font-weight:800;
  background:linear-gradient(145deg,#155f96,#073a68 52%,#031f3e);
  box-shadow:inset 2px 2px 5px #8de3ff55,inset -4px -5px 9px #001426aa,0 6px 12px #00192e77;
  opacity:.55;transition:opacity .2s ease;
}
#v55ExitBtn:hover,#v55ExitBtn:active{opacity:1}

/* v56: όταν ένα βίντεο (avatar ή ενσωματωμένο) μπαίνει σε πλήρη οθόνη μέσω
   του κουμπιού fullscreen, να φαίνεται ολόκληρο (χωρίς να κόβονται κεφάλια
   πάνω/κάτω) αντί να «γεμίζει» κόβοντας τις άκρες. Δεν επηρεάζει καθόλου
   την κανονική, ενσωματωμένη προβολή. */
video:fullscreen{object-fit:contain!important;width:100%!important;height:100%!important;background:#000}
video:-webkit-full-screen{object-fit:contain!important;width:100%!important;height:100%!important;background:#000}
video:-moz-full-screen{object-fit:contain!important;width:100%!important;height:100%!important;background:#000}

/* v64: βελτιώσεις πλοήγησης σε κινητά/μικρές οθόνες — μόνο διάταξη/μεγέθη
   κουμπιών, χωρίς καμία αλλαγή στο υπάρχον οπτικό ύφος (χρώματα, εφέ,
   στρογγυλέματα) ή στη λειτουργικότητα. */
html{overflow-x:hidden}
body{overflow-x:hidden}
@media(max-width:760px){
  .top button,.answerHead button,.free button,.backCategory,.back-competencies,#ask{min-height:44px}
  .free input{min-height:44px}
  #mic{width:48px;height:48px}
  .admin3d{min-height:58px}
  .bottomTopic{min-height:76px}
  .answerHead{flex-wrap:wrap;gap:8px}
  .left{margin:0 auto}
  .visual{margin:0 auto}
}