/* =========================================================================
   A377Tool · One Page Love / Shawn Golden 风格覆盖层
   在页面自身样式之后加载，用黑白网格 + 棕色点缀统一全站视觉。
   ========================================================================= */
html[data-skin="one"]{
  --op-ink:#000;
  --op-paper:#fff;
  --op-copy:#836953;
  --op-grey:#c8c8c8;
  --op-serif:"Times New Roman",Times,"Songti SC","SimSun",serif;
  --op-pixel:"Courier New","MS Gothic",Consolas,monospace;
}
html[data-skin="one"],
html[data-skin="one"][data-theme="light"],
html[data-skin="one"][data-theme="dark"]{
  --ui-bg:#000!important;
  --ui-surface:#fff!important;
  --ui-sunken:#f2f2f2!important;
  --ui-line:#000!important;
  --ui-line-strong:#000!important;
  --ui-ink:#000!important;
  --ui-ink-2:#333!important;
  --ui-ink-3:#777!important;
  --ui-accent:#836953!important;
  --ui-accent-ink:#6b4f3b!important;
  --ui-accent-soft:#f3ece6!important;
  --ui-ok:#000!important;
  --ui-ok-soft:#fff!important;
  --ui-err:#000!important;
  --ui-err-soft:#fff!important;
  --ui-r-sm:0!important;
  --ui-r-md:0!important;
  --ui-r-lg:0!important;
  --ui-shadow-1:none!important;
  --ui-shadow-2:none!important;
  --ui-shadow-3:none!important;

  --bg:#000!important;
  --s1:#fff!important;
  /* --s2 是「下沉面」色，/trips/ 有 34 处引用（.vibe / .prop / .delta / .hswitch …）。
     原来是 #000，而这些元素的文字色是 --text(#000) / --dim(#333)，等于黑底黑字看不见。
     改成浅灰，与 --s3 / --s4 同向。 */
  --s2:#f5f5f5!important;
  --s3:#f2f2f2!important;
  --s4:#e6e6e6!important;
  --text:#000!important;
  --dim:#333!important;
  --dim2:#777!important;
  --a:#836953!important;
  --b:#000!important;
  --ok:#000!important;
  --gold:#836953!important;
  --r:0!important;

  --background:#fff!important;
  --foreground:#000!important;
  --card:#fff!important;
  --card-foreground:#000!important;
  --popover:#fff!important;
  --popover-foreground:#000!important;
  --primary:#000!important;
  --primary-foreground:#fff!important;
  --secondary:#f2f2f2!important;
  --secondary-foreground:#000!important;
  --muted:#f2f2f2!important;
  --muted-foreground:#555!important;
  --accent:#f2f2f2!important;
  --accent-foreground:#000!important;
  --border:#000!important;
  --input:#000!important;
  --ring:#836953!important;
  --destructive:#000!important;
  --sidebar:#fff!important;
  --sidebar-foreground:#000!important;
  --sidebar-primary:#000!important;
  --sidebar-primary-foreground:#fff!important;
  --sidebar-accent:#f2f2f2!important;
  --sidebar-accent-foreground:#000!important;
  --sidebar-border:#000!important;
  --sidebar-ring:#836953!important;
  --radius:0!important;
  --radius-sm:0!important;
  --radius-md:0!important;
  --radius-lg:0!important;
  --radius-xl:0!important;
  --shadow-xs:none!important;
  --shadow-sm:none!important;
  --shadow-md:none!important;
  --shadow-lg:none!important;
  --shadow-xl:none!important;
  --surface:#fff!important;
}
html[data-skin="one"] *{box-sizing:border-box}
html[data-skin="one"] ::selection{background:var(--op-copy);color:#fff}
html[data-skin="one"] body{
  background:#000!important;
  color:#000!important;
  font-family:var(--op-serif)!important;
  cursor:crosshair;
}
html[data-skin="one"] body.shell-pad{padding-top:var(--shell-h)}
html[data-skin="one"] a{text-decoration-style:dotted;text-underline-offset:2px}
html[data-skin="one"] button, html[data-skin="one"] a, html[data-skin="one"] input, html[data-skin="one"] select, html[data-skin="one"] textarea{font-family:var(--op-pixel)!important}
html[data-skin="one"] h1, html[data-skin="one"] h2, html[data-skin="one"] h3, html[data-skin="one"] h4, html[data-skin="one"] .logo, html[data-skin="one"] .hubhead h1, html[data-skin="one"] .tripbar, html[data-skin="one"] .tool h2, html[data-skin="one"] .name, html[data-skin="one"] .brand{
  font-family:var(--op-pixel)!important;
  text-transform:uppercase;
  letter-spacing:-.02em;
}

/* 页面纸张 */
html[data-skin="one"] .wrap, html[data-skin="one"] .hub, html[data-skin="one"] #tripview main, html[data-skin="one"] .sidebar-wrapper, html[data-skin="one"] .sidebar-inset, html[data-skin="one"] .sidebar, html[data-skin="one"] .wrap .inner{
  background:#fff!important;
  color:#000!important;
  border-radius:0!important;
  box-shadow:none!important;
}
html[data-skin="one"] .wrap, html[data-skin="one"] .hub, html[data-skin="one"] #tripview main{
  border:1px solid #000!important;
}

/* 顶栏也黑白化 */
html[data-skin="one"] .a377bar{
  background:#000!important;
  color:#fff!important;
  border-bottom:1px solid #fff!important;
  font-family:var(--op-pixel)!important;
}
html[data-skin="one"] .a377bar-brand, html[data-skin="one"] .a377bar-nav a, html[data-skin="one"] .a377bar-crumb{color:#fff!important}
html[data-skin="one"] .a377bar-nav a[aria-current="page"]{background:#fff!important;color:#000!important}
html[data-skin="one"] .a377bar-theme{background:#000!important;color:#fff!important;border-color:#fff!important}

/* 通用块：方形、黑边、无阴影
   注意：下面每一条都必须带 html[data-skin="one"] 前缀。
   漏了前缀又带 !important 的规则会穿透到 classic 皮肤和深色主题，
   把卡片强制成白底黑边 —— 这是 v0.3/v0.4 皮肤失效的直接原因。 */
html[data-skin="one"] .card,
html[data-skin="one"] .panel,
html[data-skin="one"] .res,
html[data-skin="one"] .opts,
html[data-skin="one"] .drop,
html[data-skin="one"] .fitem,
html[data-skin="one"] .hcard,
html[data-skin="one"] .tripbar,
html[data-skin="one"] .lockzone,
html[data-skin="one"] .wbox,
html[data-skin="one"] .guide,
html[data-skin="one"] .fold,
html[data-skin="one"] .mbox,
html[data-skin="one"] .drawer,
html[data-skin="one"] .cmpbar,
html[data-skin="one"] .sidebar,
html[data-skin="one"] .sidebar-inner,
html[data-skin="one"] .inset-header,
html[data-skin="one"] .sidebar-container,
html[data-skin="one"] .syncbar,
html[data-skin="one"] .toast,
html[data-skin="one"] .tool,
html[data-skin="one"] .hubsec,
html[data-skin="one"] .hubhead,
html[data-skin="one"] .trip,
html[data-skin="one"] .foldbody,
html[data-skin="one"] .foldinner{
  border-radius:0!important;
  box-shadow:none!important;
}
html[data-skin="one"] .card,
html[data-skin="one"] .panel,
html[data-skin="one"] .res,
html[data-skin="one"] .opts,
html[data-skin="one"] .drop,
html[data-skin="one"] .fitem,
html[data-skin="one"] .hcard,
html[data-skin="one"] .tripbar,
html[data-skin="one"] .lockzone,
html[data-skin="one"] .wbox,
html[data-skin="one"] .guide,
html[data-skin="one"] .fold,
html[data-skin="one"] .mbox,
html[data-skin="one"] .drawer,
html[data-skin="one"] .cmpbar,
html[data-skin="one"] .sidebar,
html[data-skin="one"] .sidebar-inner,
html[data-skin="one"] .inset-header,
html[data-skin="one"] .sidebar-container,
html[data-skin="one"] .syncbar,
html[data-skin="one"] .toast,
html[data-skin="one"] .tool,
html[data-skin="one"] .hubsec,
html[data-skin="one"] .hubhead,
html[data-skin="one"] .trip{
  border:1px solid #000!important;
  background:#fff!important;
  color:#000!important;
}
html[data-skin="one"] header{background:#fff!important;border-bottom:1px solid #000!important}
html[data-skin="one"] header .logo, html[data-skin="one"] header .who, html[data-skin="one"] header .chip, html[data-skin="one"] header .iconbtn{color:#000!important}
html[data-skin="one"] .gatebox{background:#fff!important;border:1px solid #000!important;border-radius:0!important;box-shadow:none!important}
html[data-skin="one"] .gate{background:rgba(0,0,0,.82)!important}
/* 无障碍跳转链接：shell.css 用的是 --ui-ink 底 + --ui-bg 字，one 皮肤下两者都是黑 */
html[data-skin="one"] .a377-skip{background:#000!important;color:#fff!important;border-radius:0!important}

/* 按钮 */
html[data-skin="one"] .btn, html[data-skin="one"] .ui-btn, html[data-skin="one"] .miniBtn, html[data-skin="one"] .gsubmit, html[data-skin="one"] .newtrip, html[data-skin="one"] .act, html[data-skin="one"] .iconbtn, html[data-skin="one"] .gx, html[data-skin="one"] .foldhead, html[data-skin="one"] .hswitch, html[data-skin="one"] .hlink, html[data-skin="one"] .rail2{
  border-radius:0!important;
  box-shadow:none!important;
  border:1px solid #000!important;
  background:#fff!important;
  color:#000!important;
  font-family:var(--op-pixel)!important;
  text-transform:uppercase;
}
html[data-skin="one"] .btn.primary, html[data-skin="one"] .ui-btn.primary, html[data-skin="one"] .gsubmit, html[data-skin="one"] .newtrip, html[data-skin="one"] .go, html[data-skin="one"] .impSave{
  background:#000!important;
  color:#fff!important;
}
html[data-skin="one"] .btn.primary:hover:not(:disabled),
html[data-skin="one"] .ui-btn.primary:hover:not(:disabled),
html[data-skin="one"] .gsubmit:hover, html[data-skin="one"] .newtrip:hover, html[data-skin="one"] .go:hover{background:var(--op-copy)!important;color:#fff!important}
html[data-skin="one"] .btn.ghost, html[data-skin="one"] .ui-btn.ghost{background:#fff!important;color:#000!important}
html[data-skin="one"] button:focus-visible, html[data-skin="one"] a:focus-visible, html[data-skin="one"] input:focus-visible, html[data-skin="one"] select:focus-visible, html[data-skin="one"] textarea:focus-visible{
  outline:2px solid var(--op-copy)!important;
  outline-offset:2px!important
}

/* 输入 */
html[data-skin="one"] input, html[data-skin="one"] select, html[data-skin="one"] textarea{
  border-radius:0!important;
  border:1px solid #000!important;
  background:#fff!important;
  color:#000!important;
  box-shadow:none!important;
}
html[data-skin="one"] input::placeholder, html[data-skin="one"] textarea::placeholder{color:#888!important}
html[data-skin="one"] input[type=range]{accent-color:var(--op-copy)!important}

/* 标签、圆点、徽章、进度条 */
html[data-skin="one"] .tag, html[data-skin="one"] .badge, html[data-skin="one"] .pill, html[data-skin="one"] .chip, html[data-skin="one"] .wchip, html[data-skin="one"] .blchip{
  border-radius:0!important;
  border:1px solid #000!important;
  background:#fff!important;
  color:#000!important;
}
html[data-skin="one"] .bar, html[data-skin="one"] .pbar{
  border-radius:0!important;
  background:#000!important;
}
html[data-skin="one"] .bar i, html[data-skin="one"] .pbar>div{background:var(--op-copy)!important}
html[data-skin="one"] .dot, html[data-skin="one"] .sw, html[data-skin="one"] .av, html[data-skin="one"] .no, html[data-skin="one"] .hnum, html[data-skin="one"] .bnum{border-radius:0!important}
html[data-skin="one"] svg{rx:0}

/* /trips/ 里这几个强调色是写死的，按深色底调过。one 皮肤是浅色面，
   原色对比度不够（粉 #e08aa4 压在白底上只有 2.3），换成同色相的深色版。 */
html[data-skin="one"] .delta .d{color:#b03060!important}
html[data-skin="one"] .tag.ok{color:#1f6b48!important}
html[data-skin="one"] .tag.worn{color:#9a5570!important}
html[data-skin="one"] .tag.rain{color:#2f6ea8!important}
html[data-skin="one"] .iconbtn.accent{color:#836953!important}

/* 滚动条 */
html[data-skin="one"] *{scrollbar-color:#000 #fff}
html[data-skin="one"] *::-webkit-scrollbar{width:10px;height:10px}
html[data-skin="one"] *::-webkit-scrollbar-track{background:#fff}
html[data-skin="one"] *::-webkit-scrollbar-thumb{background:#000;border:2px solid #fff}

/* 响应式：小屏也保持硬边 */
@media (max-width:640px){
  html[data-skin="one"] .wrap, html[data-skin="one"] .hub, html[data-skin="one"] #tripview main{border-left:0!important;border-right:0!important}
}