html{overflow-x:clip;color-scheme:dark;}
html[data-theme="light"]{color-scheme:light;}
body{min-height:100dvh;-webkit-tap-highlight-color:rgba(185,140,240,.18);}

.dou-rail{
  min-height:48px;height:auto;display:flex;align-items:center;justify-content:space-between;gap:10px 14px;
  padding:max(8px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 8px max(14px,env(safe-area-inset-left));
  background:#0b0612;border-bottom:1px solid #432c5c;
  font-family:"JetBrains Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;color:#b49fc9;position:sticky;top:0;z-index:80;
}
.dou-rail a{color:#f4ecfa;text-decoration:none;min-height:44px;display:inline-flex;align-items:center;}
.dou-rail a:hover{color:#b98cf0;}
.dou-rail .brand{font-weight:700;letter-spacing:.14em;color:#f4ecfa;flex:0 0 auto;}
.dou-rail .brand span{color:#b98cf0;}
.dou-rail nav{display:none;gap:16px;align-items:center;}
.dou-rail nav a[aria-current="page"]{color:#c9aef0;}
.dou-rail .live{display:flex;align-items:center;gap:8px;color:#e7c889;margin-left:auto;white-space:nowrap;font-size:10px;letter-spacing:.06em;}
.dou-theme{
  width:38px;height:38px;border-radius:50%;border:1px solid #432c5c;cursor:pointer;flex:0 0 auto;
  background:linear-gradient(180deg,#2d1a40,#231433);color:#f4ecfa;font-size:15px;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;padding:0;
}
.dou-rail .live i{
  width:7px;height:7px;border-radius:50%;background:#5b7fec;box-shadow:0 0 8px #5b7fec;
  display:inline-block;flex:0 0 auto;animation:dou-pulse 1.8s ease-in-out infinite;
}
.dou-rail .clk-l{display:none;}
@keyframes dou-pulse{0%,100%{opacity:1}50%{opacity:.35}}

.dou-dock{
  display:grid;grid-template-columns:1fr 1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:90;
  background:#0b0612;border-top:1px solid #432c5c;
  padding-bottom:env(safe-area-inset-bottom);
  font-family:"JetBrains Mono",ui-monospace,monospace;
}
.dou-dock a{
  min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  color:#b49fc9;text-decoration:none;font-size:10px;letter-spacing:.12em;text-transform:uppercase;
}
.dou-dock a[aria-current="page"]{color:#f4ecfa;}
.dou-dock a:hover{color:#c9aef0;}
.dou-dock b{font-size:14px;font-weight:700;letter-spacing:0;line-height:1;}

body.has-dock{padding-bottom:calc(56px + env(safe-area-inset-bottom));}

@media (min-width:720px){
  .dou-rail{height:44px;min-height:44px;padding:0 18px;font-size:11px;letter-spacing:.1em;}
  .dou-rail a{min-height:0;}
  .dou-rail nav{display:flex;}
  .dou-rail .live{font-size:11px;margin-left:0;}
  .dou-rail .clk-s{display:none;}
  .dou-rail .clk-l{display:inline;}
  .dou-dock{display:none;}
  body.has-dock{padding-bottom:0;}
}

@media (prefers-reduced-motion:reduce){
  .dou-rail .live i{animation:none;}
}

html[data-theme="light"] .dou-rail{
  background:#faf6fc;border-bottom-color:#e2d2ed;color:#7a6291;
}
html[data-theme="light"] .dou-rail a{color:#2c1740;}
html[data-theme="light"] .dou-rail a:hover{color:#6d28d9;}
html[data-theme="light"] .dou-rail .brand{color:#2c1740;}
html[data-theme="light"] .dou-rail .brand span{color:#6d28d9;}
html[data-theme="light"] .dou-rail nav a[aria-current="page"]{color:#6d28d9;}
html[data-theme="light"] .dou-rail .live{color:#8a6a28;}
html[data-theme="light"] .dou-theme{
  border-color:#e2d2ed;background:linear-gradient(180deg,#fff,#f3e9f9);color:#2c1740;
}
html[data-theme="light"] .dou-dock{
  background:#faf6fc;border-top-color:#e2d2ed;
}
html[data-theme="light"] .dou-dock a{color:#7a6291;}
html[data-theme="light"] .dou-dock a[aria-current="page"],
html[data-theme="light"] .dou-dock a:hover{color:#2c1740;}