/* ============================================================
   datchecker · desktop design system (A3 Core Desktop)
   tokens + window chrome + taskbar + dialogs + app modules
   ============================================================ */
:root{
  --orange:#f7931a; --orange-2:#ffb454;
  --desk1:#191308; --desk2:#0c0a06;
  --win:#211c13; --win-2:#181510; --chrome:#2c261a; --chrome-hi:#3b3322; --line:#3a331f;
  --text:#f0e7d3; --dim:#ab9e83; --faint:#8b8757;
  /* a11y (WCAG AA, normal text >=4.5:1):
     --dim kept #ab9e83 — already passes on every surface it touches:
       6.41:1 on #211c13, 6.89:1 on #181510, 5.68:1 on #2c261a (.qbtn), 7.40:1 on #0e0c07 (topbar/taskbar).
     --faint: was #77704f (3.40:1 on #211c13, 3.65:1 on #181510, 3.92:1 on #0e0c07 — all failing)
       -> now #8b8757 (4.60:1 on #211c13, 4.94:1 on #181510, 5.31:1 on #0e0c07, 4.85:1 on credits #1a1712).
       Warm hue preserved (49.5° -> 55.4°, R>=G>=B kept). */
  --ok:#5bd179; --bad:#ef6a58; --bad-soft:#ff9083;
  --mono:ui-monospace,"Cascadia Mono",Menlo,Consolas,monospace;
  --sans:system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0}
html,body{height:100%}
body{
  font:14.5px/1.5 var(--sans);color:var(--text);
  background:
    radial-gradient(900px 480px at 78% 18%, #f7931a14, transparent 55%),
    radial-gradient(700px 500px at 12% 82%, #f7931a0a, transparent 55%),
    linear-gradient(160deg,var(--desk1),var(--desk2));
  overflow-x:hidden;
}
a{color:var(--orange-2)}
::selection{background:#f7931a55}
/* ---------- a11y: keyboard focus ----------
   default outline removed ONLY when :focus-visible does not apply (mouse/touch);
   keyboard focus always gets the 2px Bitcoin-orange ring. */
button:focus:not(:focus-visible),a:focus:not(:focus-visible),input:focus:not(:focus-visible),
select:focus:not(:focus-visible),[tabindex]:focus:not(:focus-visible){outline:none}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{
  outline:2px solid #f7931a;outline-offset:2px}
/* h1 oculto visualmente (SEO/a11y): la metáfora desktop no tiene h1 visible */
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap}
/* watermarks */
.wm{position:fixed;font-weight:800;color:var(--orange);opacity:.05;user-select:none;pointer-events:none;z-index:0}
.wm.w1{font-size:340px;right:-60px;top:-70px;transform:rotate(-14deg)}
.wm.w2{font-size:220px;left:-40px;bottom:60px;transform:rotate(10deg)}
.wm.w3{font-size:120px;left:44%;top:38%;transform:rotate(-6deg);opacity:.035}
/* ---------- top bar ---------- */
.topbar{
  position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:18px;height:44px;
  background:#0e0c07ee;backdrop-filter:blur(10px);border-bottom:1px solid #2c261a;padding:0 16px;font-size:13px;
}
.topbar .brand{display:flex;align-items:center;gap:8px;font-weight:800;cursor:default}
.topbar .coin{width:20px;height:20px;border-radius:50%;background:var(--orange);color:#3b2a10;
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800}
.topbar .menu{color:var(--dim);cursor:pointer;padding:3px 8px;border-radius:6px}
.topbar .menu:hover{background:#ffffff0d;color:var(--text)}
.clock{margin-left:auto;font-family:var(--mono);font-size:12.5px;color:var(--dim);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;min-width:0;flex-shrink:1}
.clock b{color:var(--orange-2);font-weight:600}
.langs{display:flex;border:1px solid var(--line);border-radius:99px;overflow:hidden;font-size:11.5px}
.langs button{border:0;background:transparent;color:var(--faint);padding:3px 10px;cursor:pointer;font:inherit}
.langs button.on{background:var(--orange);color:#2c1e08;font-weight:700}
/* ---------- desktop & windows ---------- */
.desk{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:26px 18px 96px}
.win{
  background:var(--win);border:1px solid var(--line);border-radius:12px;overflow:hidden;
  box-shadow:0 30px 80px -24px #000000e6, 0 0 0 1px #ffffff08;
  margin-bottom:22px;transition:box-shadow .18s;
}
.win.focus{box-shadow:0 34px 90px -22px #000000f2, 0 0 0 1px #f7931a55, 0 0 46px -16px #f7931a3d}
.win.hidden{display:none}
.titlebar{display:flex;align-items:center;gap:10px;background:linear-gradient(var(--chrome-hi),var(--chrome));
  color:#cfc3a6;padding:8px 13px;font-size:12.5px;user-select:none;cursor:default}
.win.focus .titlebar{color:#f2e8d0}
.titlebar .ic{width:16px;height:16px;border-radius:4px;background:var(--orange);color:#3b2a10;font-size:9px;
  display:inline-flex;align-items:center;justify-content:center;font-weight:800;flex:none}
.titlebar .t{flex:1;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* a11y: was #8f8467 (3.37:1 on titlebar #3b3322) → now #a89e6b (4.62:1) — close-window glyph must read as text */
.winbtns{display:flex;gap:12px;font-family:var(--mono);font-size:11px;color:#a89e6b}
.winbtns button{border:0;background:transparent;color:inherit;cursor:pointer;font:inherit;padding:0}
.winbtns button:hover{color:#fff}
.winbody{padding:18px 20px}
.sec{font-size:11px;font-weight:700;color:var(--faint);text-transform:uppercase;letter-spacing:.09em;margin-bottom:12px}
/* wallet app */
.grid2{display:grid;grid-template-columns:1.25fr .85fr;gap:26px}
.big{font-family:var(--mono);font-size:36px;font-weight:600;letter-spacing:-1.3px;color:var(--orange-2)}
.big small{font-size:18px;color:var(--dim);font-weight:500}
.note{color:var(--bad);font-weight:700;font-size:12.5px;margin-top:2px}
.kv .row{display:flex;justify-content:space-between;gap:10px;padding:7px 2px;border-bottom:1px solid #2c261a;font-size:12.8px}
.kv .k{color:var(--dim)} .kv .v{font-family:var(--mono);white-space:nowrap}
.kv .v small{color:var(--faint);font-family:var(--sans)}
.pos{color:var(--ok);font-weight:700}
.btnrow{display:flex;flex-direction:column;gap:9px}
.btn{display:block;width:100%;text-align:center;padding:11px 14px;border-radius:8px;
  border:1px solid #b96e0f;background:linear-gradient(#ffa733,#ef8f13);color:#2c1e08;
  font-weight:800;font-size:13.5px;cursor:pointer;text-decoration:none;font-family:inherit;
  box-shadow:0 1px 0 #ffffff40 inset, 0 5px 16px -6px #f7931a70}
.btn.ghost{background:var(--chrome);border-color:var(--line);color:var(--text);font-weight:600;box-shadow:none}
.btn small{display:block;font-weight:400;font-size:11.5px;opacity:.8}
/* console / verify app */
.cbody{font-family:var(--mono);font-size:12.5px;line-height:1.85;overflow-wrap:anywhere}
#console-out div{overflow-wrap:anywhere}
.cbody .p{color:var(--orange);font-weight:700}
.cbody .dim{color:var(--faint)} .cbody .ok{color:var(--ok)} .cbody .bad{color:var(--bad)}
.cbody b{color:var(--text)}
.drop{border:1.5px dashed #4a3f28;color:var(--dim);text-align:center;padding:20px 14px;margin-bottom:14px;
  border-radius:9px;font-family:var(--sans);font-size:13.5px;transition:all .15s;cursor:pointer}
.drop:hover,.drop.over{border-color:var(--orange);color:var(--text);background:#f7931a0d}
.drop b{color:var(--text)}
.demos{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.qbtn{font:600 12px/1 var(--sans);padding:8px 14px;border-radius:7px;cursor:pointer;
  background:var(--chrome);border:1px solid var(--line);color:var(--dim);font-family:inherit}
.qbtn:hover{color:var(--text);border-color:#5a4d2e}
.qbtn.primary{background:linear-gradient(#ffa733,#ef8f13);border-color:#b96e0f;color:#2c1e08;font-weight:800}
.cursor{display:inline-block;width:8px;height:14px;background:var(--orange);vertical-align:-2px;animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
/* result dialog */
.dlg{margin-top:14px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--win-2);
  box-shadow:0 14px 34px -16px #000000cc}
.dlg .dtitle{display:flex;align-items:center;gap:8px;padding:7px 12px;
  background:linear-gradient(var(--chrome-hi),var(--chrome));font-size:11.5px;color:#cfc3a6}
.dlg .dtitle .dotr{width:8px;height:8px;border-radius:50%;background:var(--bad);box-shadow:0 0 7px #ef6a5899;flex:none}
.dlg .dtitle .dotg{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 7px #5bd17999;flex:none}
.dlg .dtitle .doty{width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 7px #f7931a99;flex:none}
.dlg .dtitle .t{flex:1;letter-spacing:.2px}
.dlg .dbody{display:flex;gap:14px;padding:14px 16px;align-items:flex-start}
.dlg .dicon{width:36px;height:36px;border-radius:9px;background:#3a2415;border:1px solid #5f3a22;
  display:flex;align-items:center;justify-content:center;font-size:17px;flex:none}
.dlg .dicon.ok{background:#1c3320;border-color:#2f5a3a}
.dlg .dicon.neutral{background:#3a2f15;border-color:#5f5122}
.vline{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.vword{font-size:15px;font-weight:800;letter-spacing:.16em;color:var(--bad-soft)}
.vword.ok{color:var(--ok)} .vword.warn{color:var(--orange-2)}
.vsub{font-family:var(--mono);font-size:11px;color:var(--faint)}
.dlg p{font-size:12.8px;color:var(--dim);margin-top:5px;line-height:1.55}
.dlg p b{color:var(--text)}
.dkv{display:flex;gap:18px;margin-top:9px;font-family:var(--mono);font-size:11.5px;color:var(--faint);flex-wrap:wrap}
.dkv b{color:var(--dim)} .dkv .g{color:var(--ok)} .dkv .r{color:var(--bad-soft)} .dkv .o{color:var(--orange-2)}
.dlg .dbtns{display:flex;justify-content:flex-end;gap:8px;padding:10px 12px;border-top:1px solid var(--line);flex-wrap:wrap}
/* packs app */
.files{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.folder{border:1px solid var(--line);border-radius:10px;padding:14px;background:#ffffff04;cursor:default}
.folder:hover{background:#f7931a10;border-color:#6b5426}
.folder .fi{font-size:26px}
.folder h3{font-size:13.5px;margin:6px 0 4px}
.folder p{font-size:11.8px;color:var(--dim);line-height:1.5}
.folder p b{color:var(--text)}
.folder .sz{font-family:var(--mono);font-size:11px;color:var(--faint);margin-top:6px;display:block}
/* database app */
.db-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.db-controls input[type=search]{flex:1;min-width:200px;padding:8px 12px;background:var(--win-2);
  border:1px solid var(--line);border-radius:8px;color:var(--text);font:12.5px var(--mono)}
.db-controls select{padding:7px 10px;background:var(--win-2);border:1px solid var(--line);border-radius:8px;color:var(--text);font:12.5px var(--sans)}
.db-controls label{display:flex;gap:6px;align-items:center;font-size:12px;color:var(--dim);cursor:pointer}
.db-count{font-size:11.5px;color:var(--faint);font-family:var(--mono)}
.db-tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px}
table.db-table{border-collapse:collapse;width:100%;font-size:12px;min-width:860px}
.db-table th{background:var(--win-2);text-align:left;padding:8px 10px;font-size:10.5px;text-transform:uppercase;
  letter-spacing:.06em;color:var(--faint);border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0}
.db-table td{padding:7px 10px;border-bottom:1px solid #2c261a;white-space:nowrap;font-family:var(--mono);font-size:11.5px}
.db-table tr{cursor:pointer} .db-table tbody tr:hover td{background:#f7931a0a}
.db-table .cls{font-family:var(--sans);font-size:11px}
.cls-pill{display:inline-block;padding:1px 8px;border-radius:99px;font-size:10.5px;border:1px solid}
.cls-pill.synthetic-86{color:#ff9083;border-color:#8a4a3f}
.cls-pill.dated-reconstruction{color:var(--orange-2);border-color:#8a6a2f}
.cls-pill.generic-btc-challenge{color:#ff9083;border-color:#6e2f2c}
.cls-pill.altcoin-challenge{color:#bc8cff;border-color:#6a4f8a}
.cls-pill.altcoin-plaintext{color:var(--ok);border-color:#3f6a4a}
.cls-pill.empty,.cls-pill.corrupt{color:var(--faint);border-color:var(--line)}
.pos.n{color:var(--ok)} .zero{color:var(--faint)}
/* explorer app */
.ex-row{display:flex;gap:8px;flex-wrap:wrap}
.ex-row input[type=text]{flex:1;min-width:240px;padding:9px 12px;background:var(--win-2);
  border:1px solid var(--line);border-radius:8px;color:var(--text);font:12.5px var(--mono)}
#ex-result{margin-top:14px}
.ex-card{border:1px solid var(--line);border-radius:10px;background:var(--win-2);padding:14px 16px}
.ex-kv .row{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid #2c261a;font-size:12.5px}
.ex-kv .k{color:var(--dim)} .ex-kv .v{font-family:var(--mono)}
.ex-src{font-size:11px;color:var(--faint);margin-top:10px;font-family:var(--mono)}
.spin{display:inline-block;width:12px;height:12px;border:2px solid var(--line);border-top-color:var(--orange);
  border-radius:50%;animation:sp .8s linear infinite;vertical-align:-2px}
@keyframes sp{to{transform:rotate(360deg)}}
/* taskbar */
.taskbar{
  position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;align-items:center;gap:8px;
  height:58px;padding:0 18px;background:#0e0c07e8;backdrop-filter:blur(10px);border-top:1px solid #2c261a;
}
.tb-btn{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 12px;border-radius:9px;
  color:var(--dim);font-size:10.5px;cursor:pointer;border:1px solid transparent;background:transparent;font-family:var(--sans)}
.tb-btn:hover{background:#ffffff0a;color:var(--text)}
.tb-btn.on{background:#f7931a1c;border-color:#6b5426;color:var(--orange-2)}
.tb-btn .i{font-size:17px;line-height:1}
.tb-stat{margin-left:auto;display:flex;gap:18px;font-family:var(--mono);font-size:11.5px;color:var(--faint);white-space:nowrap}
.tb-stat b{color:var(--dim)}
.tb-stat .g{color:var(--ok)} .tb-stat .r{color:var(--bad-soft)}
/* toast */
.toast{position:fixed;bottom:74px;right:18px;z-index:70;background:var(--win-2);border:1px solid var(--line);
  border-radius:10px;padding:11px 16px;font-size:12.5px;color:var(--dim);box-shadow:0 14px 40px -12px #000c}
.toast b{color:var(--text)}
/* responsive */
@media (max-width:840px){
  .grid2{grid-template-columns:1fr}
  .files{grid-template-columns:1fr}
  .topbar a.menu{display:none} /* keep #menubtn.menubtn visible — .menu on button was self-kill */
  .topbar{overflow:hidden}
  .clock{margin-left:auto;max-width:38vw}
  .clock [data-i18n]{display:none}
  .langs{flex:none;margin-left:8px}
  .clock{margin-left:auto}
  .taskbar{height:52px;padding:0 10px}
  .tb-btn .lbl{display:none}
  .tb-stat{display:none}
  .desk{padding:18px 10px 80px}
  .winbody{padding:14px}
  .big{font-size:30px}
  .wm.w1{font-size:220px}
}
/* ---------- a11y: reduced motion ----------
   cancels every animation in this sheet (cursor blink, .spin loader) and all
   transitions (.win shadow, .drop hover). States never rely on color alone:
   pos/neg figures carry their numeric value as text, .on states add weight/bg. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ---------- F2: site footer + mobile menu + anchor menus ---------- */
a.menu{color:var(--dim);text-decoration:none}
a.menu:hover{background:#ffffff0d;color:var(--text)}
a.brand{color:var(--text);text-decoration:none}
a.brand:hover .coin{filter:brightness(1.1)}
.menubtn{display:inline-flex;align-items:center;background:transparent;border:0;font-size:16px;
  cursor:pointer;color:var(--dim);padding:4px 8px;border-radius:8px;line-height:1}
.menubtn:hover{color:var(--text);background:#ffffff0d}
.topnav-drop{position:fixed;top:50px;right:10px;width:292px;z-index:55;background:#0e0c07f6;
  backdrop-filter:blur(12px);border:1px solid #3b3322;border-radius:12px;padding:8px;
  display:flex;flex-direction:column;gap:1px;box-shadow:0 22px 60px -18px #000d}
.topnav-drop[hidden]{display:none}
.topnav-drop a{color:var(--dim);text-decoration:none;padding:10px 12px;border-radius:8px;font-size:14px}
.topnav-drop a:hover{color:var(--text);background:#ffffff08}
.topnav-drop a:last-child{border-bottom:none}
.sitefoot{max-width:1120px;margin:0 auto;padding:6px 18px 30px;z-index:1;position:relative}
.sitefoot .footlinks{display:flex;gap:18px;flex-wrap:wrap;padding-bottom:10px;border-bottom:1px solid #26211700}
.sitefoot .footlinks a{color:var(--dim);text-decoration:none;font-size:12.5px}
.sitefoot .footlinks a:hover{color:var(--orange-2)}
.sitefoot p{color:var(--faint);font-size:11.5px;margin-top:10px}
@media (max-width:840px){
  /* móvil: el panel ocupa todo el ancho, como una hoja */
  .topnav-drop{left:0;right:0;width:auto;top:44px;border-radius:0;border-left:0;border-right:0;border-top:0;
    box-shadow:none;padding:10px 16px 14px}
  .topnav-drop a{border-radius:0;border-bottom:1px solid #221d13;padding:10px 8px}
}