/* ============================================================
   MONOCLE — tema Ghost para jgz.sh
   El blog es una sesión de window manager en mosaico.
   Home = tiling (master/stack). Lectura = monocle (una ventana).
   Fraunces para la voz, Martian Mono para el sistema.
   ============================================================ */

/* ---------- rices ---------- */
:root{
  --base:#100d1f; --mantle:#0b0918; --surface:#191433; --overlay:#241c48; --hl:#2f2560;
  --text:#f3edff; --subtle:#b9aee0; --muted:#7c6fa8; --border:#332a5e;
  --accent:#ff5c9a; --accent-2:#9d8bff; --gold:#ffc447; --foam:#3ad6ff; --love:#ff4d6d; --pine:#2fd3c3; --green:#8cf26a;
  --pal-1:#ff4d6d; --pal-2:#ff8a3d; --pal-3:#ffc447; --pal-4:#8cf26a; --pal-5:#3ad6ff; --pal-6:#9d8bff; --pal-7:#ff5c9a; --pal-8:#f3edff;
  --shadow:rgba(0,0,0,.6); --glass:86%; --blob:.42;
  --gap:10px; --radius:12px;
  --mono:"Martian Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --serif:"Fraunces",Charter,"Iowan Old Style",Georgia,serif;
  --wonk:"SOFT" 30,"WONK" 1;
  --rainbow:linear-gradient(90deg,var(--pal-1),var(--pal-2),var(--pal-3),var(--pal-4),var(--pal-5),var(--pal-6),var(--pal-7));
  --conic:conic-gradient(from var(--ang,0deg),var(--pal-1),var(--pal-2),var(--pal-3),var(--pal-4),var(--pal-5),var(--pal-6),var(--pal-7),var(--pal-1));
  color-scheme:dark;
}
:root[data-rice="latte"]{
  --base:#eff1f5; --mantle:#e6e9ef; --surface:#ffffff; --overlay:#e6e9ef; --hl:#dce0e8;
  --text:#4c4f69; --subtle:#6c6f85; --muted:#9ca0b0; --border:#ccd0da;
  --accent:#ea76cb; --accent-2:#8839ef; --gold:#df8e1d; --foam:#04a5e5; --love:#d20f39; --pine:#1e66f5; --green:#40a02b;
  --pal-1:#d20f39; --pal-2:#fe640b; --pal-3:#df8e1d; --pal-4:#40a02b; --pal-5:#04a5e5; --pal-6:#8839ef; --pal-7:#ea76cb; --pal-8:#4c4f69;
  --shadow:rgba(76,79,105,.25); --blob:.28; color-scheme:light;
}
:root[data-rice="synthwave"]{
  --base:#241b2f; --mantle:#1a1424; --surface:#2b213a; --overlay:#34294a; --hl:#463561;
  --text:#f4f0ff; --subtle:#c9bfe3; --muted:#8a7fa8; --border:#463561;
  --accent:#ff7edb; --accent-2:#b893ff; --gold:#fede5d; --foam:#36f9f6; --love:#fe4450; --pine:#03edf9; --green:#72f1b8;
  --pal-1:#fe4450; --pal-2:#f97e72; --pal-3:#fede5d; --pal-4:#72f1b8; --pal-5:#36f9f6; --pal-6:#b893ff; --pal-7:#ff7edb; --pal-8:#f4f0ff;
  --shadow:rgba(0,0,0,.6); --blob:.45; color-scheme:dark;
}
:root[data-rice="dracula"]{
  --base:#282a36; --mantle:#21222c; --surface:#2e3040; --overlay:#44475a; --hl:#525670;
  --text:#f8f8f2; --subtle:#c3c7dc; --muted:#6272a4; --border:#44475a;
  --accent:#bd93f9; --accent-2:#ff79c6; --gold:#ffb86c; --foam:#8be9fd; --love:#ff5555; --pine:#8be9fd; --green:#50fa7b;
  --pal-1:#ff5555; --pal-2:#ffb86c; --pal-3:#f1fa8c; --pal-4:#50fa7b; --pal-5:#8be9fd; --pal-6:#bd93f9; --pal-7:#ff79c6; --pal-8:#f8f8f2;
  --shadow:rgba(0,0,0,.6); --blob:.36; color-scheme:dark;
}
:root[data-rice="mocha"]{
  --base:#1e1e2e; --mantle:#181825; --surface:#24243a; --overlay:#313244; --hl:#45475a;
  --text:#cdd6f4; --subtle:#a6adc8; --muted:#6c7086; --border:#363650;
  --accent:#f5c2e7; --accent-2:#cba6f7; --gold:#f9e2af; --foam:#94e2d5; --love:#f38ba8; --pine:#89b4fa; --green:#a6e3a1;
  --pal-1:#f38ba8; --pal-2:#fab387; --pal-3:#f9e2af; --pal-4:#a6e3a1; --pal-5:#94e2d5; --pal-6:#89b4fa; --pal-7:#cba6f7; --pal-8:#cdd6f4;
  --shadow:rgba(0,0,0,.6); --blob:.36; color-scheme:dark;
}
:root[data-rice="gruvbox"]{
  --base:#282828; --mantle:#1d2021; --surface:#32302f; --overlay:#3c3836; --hl:#504945;
  --text:#fbf1c7; --subtle:#d5c4a1; --muted:#928374; --border:#45403d;
  --accent:#fe8019; --accent-2:#d3869b; --gold:#fabd2f; --foam:#8ec07c; --love:#fb4934; --pine:#83a598; --green:#b8bb26;
  --pal-1:#fb4934; --pal-2:#fe8019; --pal-3:#fabd2f; --pal-4:#b8bb26; --pal-5:#8ec07c; --pal-6:#83a598; --pal-7:#d3869b; --pal-8:#fbf1c7;
  --shadow:rgba(0,0,0,.6); --blob:.34; color-scheme:dark;
}
:root[data-rice="tokyo"]{
  --base:#1a1b26; --mantle:#16161e; --surface:#1f2335; --overlay:#292e42; --hl:#3b4261;
  --text:#c0caf5; --subtle:#9aa5ce; --muted:#565f89; --border:#2f3550;
  --accent:#7aa2f7; --accent-2:#bb9af7; --gold:#e0af68; --foam:#7dcfff; --love:#f7768e; --pine:#2ac3de; --green:#9ece6a;
  --pal-1:#f7768e; --pal-2:#ff9e64; --pal-3:#e0af68; --pal-4:#9ece6a; --pal-5:#7dcfff; --pal-6:#7aa2f7; --pal-7:#bb9af7; --pal-8:#c0caf5;
  --shadow:rgba(0,0,0,.6); --blob:.36; color-scheme:dark;
}
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}

/* ---------- base ---------- */
*{box-sizing:border-box}
html{font-size:100%}
html,body{min-height:100%}
body{
  margin:0;background:var(--base);color:var(--text);
  font-family:var(--mono);font-size:12.5px;line-height:1.5;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
  transition:background .35s ease,color .35s ease;
}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
img{display:block;max-width:100%}
::selection{background:var(--pal-7);color:var(--base)}
:focus-visible{outline:2px solid var(--pal-5);outline-offset:2px;border-radius:4px}
[hidden]{display:none!important}

/* wallpaper (skydome) */
.wall{position:fixed;inset:-6%;z-index:0;pointer-events:none;overflow:hidden;
  transform:translate(calc(var(--mx,0) * -12px),calc(var(--my,0) * -8px));transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .5s}
.wall::after{content:"";position:absolute;inset:0;
  background-image:radial-gradient(circle at 1px 1px,var(--border) 1px,transparent 1.5px);
  background-size:22px 22px;opacity:.55;
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 30%,transparent 100%);mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 30%,transparent 100%)}
.blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:var(--blob);mix-blend-mode:screen}
:root[data-rice="latte"] .blob{mix-blend-mode:multiply}
.blob-a{width:52vw;height:52vw;left:-14vw;top:-18vw;background:var(--pal-6);animation:drift 38s ease-in-out infinite alternate}
.blob-b{width:44vw;height:44vw;right:-12vw;top:14vh;background:var(--pal-7);animation:drift 46s ease-in-out infinite alternate-reverse}
.blob-c{width:38vw;height:38vw;left:28vw;bottom:-18vw;background:var(--pal-5);animation:drift 52s ease-in-out infinite alternate}
.blob-d{width:30vw;height:30vw;left:46vw;top:-10vw;background:var(--pal-3);animation:drift 44s ease-in-out infinite alternate-reverse}
.blob-e{width:26vw;height:26vw;right:22vw;bottom:8vh;background:var(--pal-4);animation:drift 58s ease-in-out infinite alternate}
.aurora{position:absolute;inset:-20%;background:var(--conic);opacity:.10;filter:blur(60px) saturate(1.4);animation:spin 80s linear infinite;mix-blend-mode:screen}
:root[data-rice="latte"] .aurora{mix-blend-mode:multiply;opacity:.08}
@keyframes drift{from{transform:translate(0,0) scale(1)}to{transform:translate(6vw,4vh) scale(1.12)}}
@keyframes spin{to{--ang:360deg}}
body.expose-on .wall{filter:blur(6px) brightness(.8)}

/* session */
.session{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;gap:var(--gap);padding:var(--gap) var(--gap) 0 var(--gap)}
.stage{position:relative;perspective:2200px;perspective-origin:50% 35%;flex:1}

/* ---------- bar (waybar) ---------- */
.bar{
  position:sticky;top:env(safe-area-inset-top,0px);z-index:20;
  display:flex;align-items:center;gap:12px;min-height:38px;padding:4px 8px 4px 6px;
  background:color-mix(in oklab,var(--surface) 84%,transparent);
  backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);
  border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:0 10px 30px -18px var(--shadow);
  font-size:11px;
}
.bar::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;background:var(--rainbow);opacity:.9;border-radius:2px;transition:opacity .3s}
.post-template .bar::after,.page-template .bar::after{opacity:.15}
.launcher{width:28px;height:28px;border-radius:8px;overflow:hidden;flex:0 0 auto;border:1px solid var(--pal-7);box-shadow:0 0 0 2px color-mix(in oklab,var(--pal-7) 35%,transparent);display:grid;place-items:center;font-size:9px;font-weight:700;color:var(--pal-7)}
.launcher img{width:100%;height:100%;object-fit:cover}
.ws{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;flex:0 1 auto}
.ws::-webkit-scrollbar{display:none}
.ws-item{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 9px;border-radius:8px;color:var(--subtle);white-space:nowrap;transition:background .15s,color .15s;--tab:var(--accent)}
.ws-item:nth-child(1){--tab:var(--pal-7)}.ws-item:nth-child(2){--tab:var(--pal-4)}.ws-item:nth-child(3){--tab:var(--pal-3)}.ws-item:nth-child(4){--tab:var(--pal-5)}.ws-item:nth-child(5){--tab:var(--pal-1)}.ws-item:nth-child(6){--tab:var(--pal-6)}.ws-item:nth-child(7){--tab:var(--pal-2)}
.ws-item .n{font-weight:700;color:var(--tab);opacity:.85}
.ws-item:hover{background:var(--overlay);color:var(--tab)}
.ws-item.on{background:color-mix(in oklab,var(--tab) 16%,var(--surface));color:var(--text);box-shadow:inset 0 -2px 0 var(--tab)}
.ws-item.on .n{opacity:1}
.ws-item.ext::after{content:"↗";color:var(--muted);font-size:10px}
.bar-title{flex:1 1 auto;min-width:0;text-align:center;color:var(--subtle);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:relative}
.bar-title .path{color:var(--muted)}
.bar-title .file{color:var(--text)}
.bar-title .prog{position:absolute;left:12%;right:12%;bottom:-6px;height:2px;background:var(--overlay);border-radius:2px;overflow:hidden;opacity:0;transition:opacity .2s}
.bar-title .prog i{display:block;height:100%;width:0;background:var(--rainbow);transition:width .1s linear}
.post-template .bar-title .prog,.page-template .bar-title .prog{opacity:1}
.mods{display:flex;align-items:center;gap:8px;color:var(--subtle);flex:0 0 auto}
.mod{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 8px;border-radius:8px}
.mod.btn:hover{background:var(--overlay);color:var(--text)}
.mod.btn.on{color:var(--pal-4)}
.rice{display:inline-flex;gap:6px;align-items:center;height:28px;padding:0 6px;border-radius:8px}
.rice button{width:14px;height:14px;border-radius:50%;border:2px solid transparent;background:var(--c);transition:transform .15s}
.rice button:hover{transform:scale(1.2)}
.rice button.on{border-color:var(--text);box-shadow:0 0 0 2px var(--surface),0 0 12px var(--c)}
.clock{font-variant-numeric:tabular-nums;color:var(--gold)}
.clock small{color:var(--muted);margin-left:6px}
.kbd{display:inline-block;min-width:18px;padding:0 5px;border:1px solid color-mix(in oklab,var(--accent-2) 45%,var(--border));border-bottom-width:2px;border-radius:5px;background:var(--overlay);font-size:10px;line-height:17px;text-align:center;color:var(--accent-2)}
@media (max-width: 900px){.rice button:nth-child(n+5){display:none}.clock small{display:none}}
@media (max-width: 700px){.hide-m{display:none!important}.bar{gap:8px}.bar-title{display:none}}

/* ---------- windows ---------- */
.win{
  --wc:var(--accent);position:relative;
  background:color-mix(in oklab,var(--surface) var(--glass),transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1.5px solid var(--border);border-radius:var(--radius);
  box-shadow:0 24px 50px -30px var(--shadow);
  display:flex;flex-direction:column;min-width:0;
  transition:border-color .2s,box-shadow .2s,transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s;
  animation:wobble .7s cubic-bezier(.2,.8,.2,1) both;
  transform-origin:50% 40%;
}
.stack .win:nth-child(2){animation-delay:.06s}.stack .win:nth-child(3){animation-delay:.12s}.stack .win:nth-child(4){animation-delay:.18s}.stack .win:nth-child(5){animation-delay:.24s}
.grid2 .win:nth-child(2n){animation-delay:.06s}.grid2 .win:nth-child(3n){animation-delay:.12s}
@keyframes wobble{
  0%{transform:scale(.92) skewX(0);opacity:.5}
  35%{transform:scale(1.015) skewX(-1.6deg);opacity:1}
  55%{transform:scale(.996) skewX(1.1deg)}
  75%{transform:scale(1.003) skewX(-.5deg)}
  100%{transform:none}
}
.win.jiggle{animation:jiggle .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes jiggle{0%{transform:none}25%{transform:skewX(-1.4deg) scale(1.006)}50%{transform:skewX(1deg) scale(.998)}75%{transform:skewX(-.4deg)}100%{transform:none}}
.win:not(.focus):hover{border-color:color-mix(in oklab,var(--wc) 55%,var(--border))}
.win.focus{border-color:transparent;box-shadow:0 0 40px -14px color-mix(in oklab,var(--wc) 55%,transparent),0 30px 60px -30px var(--shadow)}
.win.focus::after{content:"";position:absolute;inset:-1.5px;border-radius:inherit;padding:1.5px;background:var(--conic);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  pointer-events:none;animation:spin 7s linear infinite;opacity:.95;z-index:1}
.tbar{display:flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-bottom:1px solid var(--border);color:var(--subtle);font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 0 auto;cursor:default;
  background:linear-gradient(90deg,color-mix(in oklab,var(--wc) 14%,transparent),transparent 60%);border-radius:var(--radius) var(--radius) 0 0}
.tbar.sub{background:none;border-radius:0;margin:40px 0 12px;padding:0 0 8px}
.tbar .dots{display:inline-flex;gap:5px;margin-right:4px}
.tbar .dots i{width:8px;height:8px;border-radius:50%;opacity:.9}
.tbar .dots i:nth-child(1){background:var(--pal-1)}.tbar .dots i:nth-child(2){background:var(--pal-3)}.tbar .dots i:nth-child(3){background:var(--pal-4)}
.tbar .cmd{color:var(--text);overflow:hidden;text-overflow:ellipsis}
.tbar .cmd::before{content:"❯ ";color:var(--wc)}
.tbar .right{margin-left:auto;color:var(--muted);flex:0 0 auto}
.tbar .right a,.tbar .right button{color:var(--wc)}
.tbar .right a:hover,.tbar .right button:hover{text-decoration:underline}
.body{padding:14px 16px;min-width:0}

/* Compiz: expose / scale */
.expose .win{transform:scale(.9);opacity:.72;filter:saturate(1.25)}
.expose .win:hover{transform:scale(.95);opacity:1}
.expose-tag{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:30;padding:6px 12px;border-radius:8px;background:var(--surface);border:1px solid var(--pal-7);box-shadow:0 0 30px -8px var(--pal-7);color:var(--text);font-size:11px;display:none}
body.expose-on .expose-tag{display:block}

/* Compiz: desktop cube entre páginas */
.ws-panel{transform-style:preserve-3d;backface-visibility:hidden;--w:1000px}
.stage.cube-out .ws-panel{animation:cubeOut .5s cubic-bezier(.65,0,.35,1) both;pointer-events:none}
:root[data-anim="cube-r"] .stage .ws-panel,:root[data-anim="cube-l"] .stage .ws-panel{animation:cubeIn .6s cubic-bezier(.2,.7,.2,1) both}
:root[data-anim="cube-l"] .stage .ws-panel{--dir:-1}
@keyframes cubeOut{from{transform:none;opacity:1}to{transform:translateZ(calc(var(--w) * -.5)) rotateY(calc(-70deg * var(--dir,1))) translateZ(calc(var(--w) * .5));opacity:.2}}
@keyframes cubeIn{from{transform:translateZ(calc(var(--w) * -.5)) rotateY(calc(70deg * var(--dir,1))) translateZ(calc(var(--w) * .5));opacity:.2}to{transform:none;opacity:1}}
:root[data-anim^="cube"] .ws-panel .win{animation:none}

/* Compiz: zoom al abrir / magic lamp al cerrar */
:root[data-anim="zoom"] .reader-win{animation:zoomIn .55s cubic-bezier(.2,.9,.2,1) both}
:root[data-anim="zoom"] .nav2 .win{animation-delay:.3s}
@keyframes zoomIn{from{transform:scale(.55);opacity:0}60%{transform:scale(1.01);opacity:1}to{transform:none}}
.reader-win.lamp{animation:lamp .5s cubic-bezier(.6,0,.9,.4) both!important;transform-origin:0% 100%}
@keyframes lamp{40%{transform:scaleX(.9) skewY(3deg);opacity:1}to{transform:translate(-30vw,70vh) scale(.06,.5) skewY(18deg);opacity:0}}

/* Compiz: water */
.ripple{position:fixed;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;border:1.5px solid var(--rc,var(--accent));pointer-events:none;z-index:60;animation:rip .75s cubic-bezier(.1,.7,.3,1) forwards}
.ripple.r2{animation-delay:.1s;border-color:var(--rc2,var(--accent-2))}
@keyframes rip{to{transform:scale(16);opacity:0}}

/* fx off / reduced motion */
:root[data-fx="off"] .win,:root[data-fx="off"] .win::after,:root[data-fx="off"] .avatar,:root[data-fx="off"] .aurora,:root[data-fx="off"] .blob,:root[data-fx="off"] .ws-panel,:root[data-fx="off"] .reader-win,:root[data-fx="off"] .lb *{animation:none!important}
:root[data-fx="off"] .wall{transform:none!important}
@media (prefers-reduced-motion: reduce){.win,.win::after,.avatar,.aurora,.blob,.ws-panel,.reader-win,.ripple,.lb *{animation:none!important}.wall{transform:none!important}}

/* ---------- tiling ---------- */
.tiles{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:var(--gap);align-items:start}
.tiles.single{grid-template-columns:1fr}
.tiles.single .master{max-width:1100px;margin:0 auto;width:100%}
.stack{display:grid;gap:var(--gap);min-width:0}
@media (max-width: 900px){.tiles{grid-template-columns:1fr}}

/* filtro */
.filter{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--border);color:var(--subtle);background:linear-gradient(90deg,color-mix(in oklab,var(--pal-4) 8%,transparent),transparent)}
.filter .p{color:var(--pal-4);font-weight:700}
.filter input{flex:1;min-width:0;background:transparent;border:0;color:var(--text);font:inherit;font-size:12.5px;outline:none}
.filter input::placeholder{color:var(--muted)}
.filter .count{color:var(--muted);font-variant-numeric:tabular-nums}

/* escritos */
.posts{list-style:none;margin:0;padding:6px 0 10px}
.year{display:grid;grid-template-columns:88px 1fr;align-items:center;padding:14px 16px 6px;color:var(--gold);font-size:10px;letter-spacing:.1em;text-transform:uppercase;gap:14px}
.year::after{content:"";height:1px;background:var(--rainbow);opacity:.55}
.post{position:relative;display:grid;grid-template-columns:88px minmax(0,1fr) 84px;grid-template-rows:auto auto auto;gap:0 14px;padding:14px 16px 15px 14px;border-left:2px solid transparent;transition:background .15s,border-color .15s;cursor:pointer}
.post:hover,.post.sel{background:linear-gradient(90deg,color-mix(in oklab,var(--accent) 12%,transparent),color-mix(in oklab,var(--accent-2) 6%,transparent) 60%,transparent);border-left-color:var(--accent)}
.post .date{grid-row:1/4;color:var(--subtle);font-size:10.5px;padding-top:6px;font-variant-numeric:tabular-nums}
.post .date b{display:block;color:var(--gold);font-weight:600}
.post .date .lang{display:inline-block;margin-top:8px;padding:0 5px;border:1px solid color-mix(in oklab,var(--foam) 50%,var(--border));border-radius:4px;font-size:9.5px;color:var(--foam);white-space:nowrap}
.post .thumb{grid-column:3;grid-row:1/4;width:84px;height:84px;border-radius:8px;overflow:hidden;border:1px solid color-mix(in oklab,var(--accent-2) 40%,var(--border));background:var(--overlay);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.post .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.post:hover .thumb,.post.sel .thumb{transform:rotate(-2deg) scale(1.04);box-shadow:0 14px 28px -10px color-mix(in oklab,var(--accent) 70%,transparent)}
.post:hover .thumb img{transform:scale(1.08)}
.post h2{grid-column:2;margin:0;font-family:var(--serif);font-weight:600;font-size:22px;line-height:1.18;letter-spacing:-.01em;text-wrap:balance;color:var(--text);font-variation-settings:"opsz" 60,var(--wonk)}
.post h2 a{color:inherit}
.post.sel h2{background:linear-gradient(90deg,var(--text) 60%,var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.post.sel h2::after{content:"▌";-webkit-text-fill-color:var(--accent);margin-left:4px;font-family:var(--mono);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.post p{grid-column:2;margin:7px 0 0;color:var(--subtle);font-family:var(--serif);font-size:14.5px;line-height:1.5;font-weight:380;font-variation-settings:"opsz" 14;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post .tags{grid-column:2;margin-top:9px;display:flex;flex-wrap:wrap;gap:6px 10px;font-size:10px;color:var(--muted)}
.post .tags a::before{content:"#";opacity:.7}
.post .tags a:nth-child(5n+1){color:var(--pal-7)}.post .tags a:nth-child(5n+2){color:var(--pal-5)}.post .tags a:nth-child(5n+3){color:var(--pal-3)}.post .tags a:nth-child(5n+4){color:var(--pal-4)}.post .tags a:nth-child(5n+5){color:var(--pal-6)}
.post .tags a:hover{text-decoration:underline}
.post.hidden{display:none}
@media (max-width: 560px){
  .post{grid-template-columns:minmax(0,1fr) 64px;grid-template-rows:auto auto auto auto}
  .year{grid-template-columns:1fr}.year::after{display:none}
  .post .date{grid-row:1;grid-column:1;display:flex;gap:10px;align-items:baseline;padding:0 0 6px}
  .post .date b{display:inline}.post .date .lang{margin:0}
  .post .thumb{grid-column:2;grid-row:1/5;width:64px;height:64px}
  .post h2{grid-column:1;font-size:19px}.post p,.post .tags{grid-column:1}
}
.more{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--border);color:var(--subtle);font-size:11px;flex-wrap:wrap}
.more.bare{border:0;padding:4px 0}
.more a{color:var(--foam)}
.more a:hover{text-decoration:underline}
.pager{display:flex;justify-content:space-between;align-items:center;gap:12px;flex:1;font-size:11px}
.pager .pg{color:var(--muted);font-variant-numeric:tabular-nums}
.empty{padding:24px 16px;color:var(--muted);font-family:var(--serif);font-size:15px}

/* fastfetch */
.fetch{display:grid;grid-template-columns:104px 1fr;gap:16px;align-items:start}
.avatar{width:104px;height:104px;border-radius:14px;overflow:hidden;background:var(--conic);padding:2.5px;transform:rotate(-3deg);transition:transform .4s cubic-bezier(.2,.8,.2,1);animation:spin 9s linear infinite}
.win:hover .avatar{transform:rotate(0) scale(1.03)}
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:11px;background:var(--overlay)}
.avatar:empty{display:none}
.kv{margin:0;display:grid;grid-template-columns:auto 1fr;gap:3px 12px;font-size:11px}
.kv dt{font-weight:600;color:var(--accent)}
.kv dt::after{content:":"}
.kv dt:nth-of-type(7n+1){color:var(--pal-1)}.kv dt:nth-of-type(7n+2){color:var(--pal-2)}.kv dt:nth-of-type(7n+3){color:var(--pal-3)}.kv dt:nth-of-type(7n+4){color:var(--pal-4)}.kv dt:nth-of-type(7n+5){color:var(--pal-5)}.kv dt:nth-of-type(7n+6){color:var(--pal-6)}.kv dt:nth-of-type(7n+7){color:var(--pal-7)}
.kv dd{margin:0;color:var(--text);min-width:0;overflow-wrap:anywhere}
.kv dd a{color:var(--foam)}
.kv .u{grid-column:1/-1;font-weight:700;font-size:12px;background:var(--rainbow);-webkit-background-clip:text;background-clip:text;color:transparent}
.kv .u small{display:block;font-weight:400;-webkit-text-fill-color:var(--muted)}
.motd{grid-column:1/-1;font-family:var(--serif);font-style:italic;font-size:15px;color:var(--accent-2);margin-top:6px;font-variation-settings:"opsz" 14,var(--wonk)}
.swatches{grid-column:1/-1;display:flex;margin-top:8px;border-radius:5px;overflow:hidden}
.swatches i{flex:1;height:14px}
@media (max-width: 420px){.fetch{grid-template-columns:1fr}.avatar{width:84px;height:84px}}

/* intro README */
.intro{font-family:var(--serif);font-size:15px;line-height:1.55;font-weight:380;color:var(--subtle);font-variation-settings:"opsz" 14;position:relative}
.intro[data-clamp].clamped{max-height:260px;overflow:hidden}
.intro[data-clamp].clamped::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(180deg,transparent,color-mix(in oklab,var(--surface) 96%,transparent))}
.intro p{margin:0 0 12px}
.intro p:first-child{color:var(--text);font-size:17px}
.intro a{color:var(--pal-7);border-bottom:1px solid color-mix(in oklab,var(--pal-7) 40%,transparent)}
.intro h1,.intro h2,.intro h3{font-family:var(--serif);font-weight:620;margin:0 0 10px;line-height:1.15;font-variation-settings:"opsz" 48,var(--wonk)}
.intro h1{font-size:24px}.intro h2{font-size:20px}.intro h3{font-size:17px}
.expand{display:block;width:100%;padding:8px 16px 10px;border-top:1px solid var(--border);color:var(--foam);font-size:11px;text-align:left}
.expand:hover{background:var(--overlay)}

/* now.log */
.log{font-size:11.5px}
.log .ln{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:6px 0;border-bottom:1px dashed var(--border)}
.log .ln:last-of-type{border-bottom:0}
.log .ts{color:var(--pal-5);font-variant-numeric:tabular-nums;white-space:nowrap}
.log .lvl{color:var(--pal-4);font-weight:600}
.log .lvl.warn{color:var(--pal-3)}
.log .msg{color:var(--text);font-family:var(--serif);font-size:14.5px;line-height:1.5;font-weight:380}
.log .msg a{color:var(--pal-7);border-bottom:1px solid color-mix(in oklab,var(--pal-7) 45%,transparent)}
.status{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:10.5px;color:var(--subtle)}
.status .dot{width:7px;height:7px;border-radius:50%;background:var(--pal-4);box-shadow:0 0 0 3px color-mix(in oklab,var(--pal-4) 30%,transparent),0 0 14px var(--pal-4);animation:pulse 2.4s ease-in-out infinite;flex:0 0 auto}
@keyframes pulse{50%{box-shadow:0 0 0 6px transparent}}

/* fotos (feh --thumbnails) */
.thumbs{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px}
.thumbs button{position:relative;aspect-ratio:16/10;border-radius:8px;overflow:hidden;border:1px solid color-mix(in oklab,var(--pal-1) 35%,var(--border));background:var(--overlay);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
.thumbs button img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.thumbs button:hover{transform:translateY(-3px) rotate(-1deg);border-color:var(--pal-1);box-shadow:0 16px 30px -12px color-mix(in oklab,var(--pal-1) 70%,transparent)}
.thumbs button:hover img{transform:scale(1.07)}
.thumbs button span{position:absolute;left:8px;bottom:6px;right:8px;font-size:9.5px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.8);opacity:0;transition:opacity .2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.thumbs button:hover span{opacity:1}

/* galería */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--gap);margin-top:var(--gap)}
.gallery.raw{display:block}
.gallery .win{cursor:zoom-in}
.gallery .shot,.about .shot{aspect-ratio:16/9;overflow:hidden;background:var(--overlay)}
.about .shot.rounded{border-radius:8px;margin-bottom:6px}
.gallery .shot img,.about .shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.gallery .win:hover .shot img{transform:scale(1.05)}
.gallery .win:hover{border-color:var(--pal-1)}
.gallery .cap{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;font-size:10.5px;color:var(--subtle)}
.gallery .cap b{color:var(--pal-7);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gal-head .about{padding-bottom:16px}

/* visor (feh --fullscreen) */
.lb{position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;background:color-mix(in oklab,var(--mantle) 90%,transparent);backdrop-filter:blur(18px) saturate(1.1);-webkit-backdrop-filter:blur(18px) saturate(1.1);animation:fadeIn .25s ease both}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.lb .tbar{border-bottom-color:var(--border);background:color-mix(in oklab,var(--surface) 70%,transparent);height:38px;padding:0 14px;font-size:11px;border-radius:0;--wc:var(--pal-1)}
.lb .tbar button{color:var(--pal-1);padding:4px 8px;border-radius:6px}
.lb .tbar button:hover{background:var(--overlay)}
.lb .stage-img{flex:1;position:relative;display:grid;place-items:center;padding:16px;min-height:0}
.lb .stage-img img{max-width:min(96vw,1400px);max-height:calc(100dvh - 140px);width:auto;height:auto;border-radius:10px;border:1.5px solid var(--border);box-shadow:0 40px 90px -30px rgba(0,0,0,.8);transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .3s;will-change:transform}
.lb .stage-img img.slide-l{animation:slideL .4s cubic-bezier(.2,.8,.2,1) both}
.lb .stage-img img.slide-r{animation:slideR .4s cubic-bezier(.2,.8,.2,1) both}
@keyframes slideL{from{transform:translateX(60px) rotateY(-12deg) scale(.96);opacity:0}to{transform:none;opacity:1}}
@keyframes slideR{from{transform:translateX(-60px) rotateY(12deg) scale(.96);opacity:0}to{transform:none;opacity:1}}
.lb .arrow{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:64px;display:grid;place-items:center;border-radius:12px;background:color-mix(in oklab,var(--surface) 80%,transparent);border:1px solid color-mix(in oklab,var(--pal-5) 50%,var(--border));color:var(--pal-5);font-size:22px;transition:background .2s,border-color .2s,transform .2s,box-shadow .2s}
.lb .arrow:hover{background:var(--overlay);border-color:var(--pal-5);box-shadow:0 0 24px -6px var(--pal-5);transform:translateY(-50%) scale(1.06)}
.lb .arrow.l{left:18px}.lb .arrow.r{right:18px}
.lb .foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--border);background:color-mix(in oklab,var(--surface) 70%,transparent);font-size:11px;color:var(--subtle);flex-wrap:wrap}
.lb .foot .cap{font-family:var(--serif);font-size:15px;color:var(--text);font-weight:380;font-variation-settings:"opsz" 14}
.lb .foot .ctr{font-variant-numeric:tabular-nums;color:var(--gold)}
.lb .strip{display:flex;gap:6px;flex-wrap:wrap}
.lb .strip button{width:44px;height:28px;border-radius:5px;overflow:hidden;border:1px solid var(--border);opacity:.55;transition:opacity .2s,border-color .2s}
.lb .strip button.on,.lb .strip button:hover{opacity:1;border-color:var(--pal-7);box-shadow:0 0 10px -2px var(--pal-7)}
.lb .strip img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.lb .arrow{width:40px;height:52px;font-size:18px}.lb .arrow.l{left:8px}.lb .arrow.r{right:8px}.lb .strip{display:none}}

/* about / readme */
.about{padding:16px 18px 18px;display:grid;gap:12px}
.about h3{margin:0;font-family:var(--serif);font-size:26px;line-height:1.12;font-weight:620;letter-spacing:-.014em;font-variation-settings:"opsz" 72,var(--wonk);background:linear-gradient(90deg,var(--text),var(--pal-7) 55%,var(--pal-6));-webkit-background-clip:text;background-clip:text;color:transparent}
.about p,.about-content p{margin:0;font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--subtle);font-weight:380;font-variation-settings:"opsz" 14}
.about-content p+p{margin-top:10px}
.about a{color:var(--pal-7)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:4px}
.stats div{border:1px dashed var(--border);border-radius:8px;padding:8px 10px;font-size:10px;color:var(--muted);line-height:1.4;min-width:0}
.stats b{display:block;font-size:15px;color:var(--text);font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.stats div:nth-child(1){border-color:color-mix(in oklab,var(--pal-7) 50%,var(--border))}.stats div:nth-child(1) b{color:var(--pal-7)}
.stats div:nth-child(2){border-color:color-mix(in oklab,var(--pal-3) 50%,var(--border))}.stats div:nth-child(2) b{color:var(--pal-3)}
.stats div:nth-child(3){border-color:color-mix(in oklab,var(--pal-5) 50%,var(--border))}.stats div:nth-child(3) b{color:var(--pal-5)}
@media (max-width: 420px){.stats{grid-template-columns:1fr 1fr}}

/* micro */
.micro-tiles{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:var(--gap);align-items:start}
@media (max-width: 900px){.micro-tiles{grid-template-columns:1fr}.micro-tiles .stack{order:-1}}
.journal{padding:4px 0 8px}
.entry{display:grid;grid-template-columns:96px minmax(0,1fr);gap:0 16px;padding:16px 18px 18px 16px;border-left:2px solid transparent;border-bottom:1px dashed var(--border);transition:background .15s,border-color .15s}
.entry:last-child{border-bottom:0}
.entry:hover{background:linear-gradient(90deg,color-mix(in oklab,var(--pal-4) 10%,transparent),transparent 70%);border-left-color:var(--pal-4)}
.entry .e-ts{color:var(--subtle);font-size:10.5px;font-variant-numeric:tabular-nums;padding-top:5px;line-height:1.6}
.entry .e-ts b{display:block;color:var(--gold);font-weight:600}
.entry .e-ts .lvl{display:inline-block;margin-top:6px;color:var(--pal-4);font-weight:600}
.entry .e-ts .lvl.new{color:var(--pal-2)}
.entry h3{margin:0 0 8px;font-family:var(--serif);font-size:21px;line-height:1.2;font-weight:600;letter-spacing:-.01em;font-variation-settings:"opsz" 48,var(--wonk)}
.entry h3 a:hover{color:var(--pal-7)}
.micro-content{font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--text);font-weight:380;font-variation-settings:"opsz" 14}
.micro-content p{margin:0 0 10px}
.micro-content p:last-child{margin-bottom:0}
.micro-content a{color:var(--accent);border-bottom:1px solid color-mix(in oklab,var(--accent) 40%,transparent)}
.micro-content h1,.micro-content h2,.micro-content h3{font-size:17px;margin:14px 0 6px;font-weight:600;font-variation-settings:"opsz" 24,var(--wonk)}
.micro-content img{border-radius:8px;margin:10px 0}
@media (max-width: 560px){.entry{grid-template-columns:1fr;gap:6px}.entry .e-ts{display:flex;gap:10px;align-items:baseline;padding:0}.entry .e-ts b{display:inline}.entry .e-ts .lvl{margin:0}}

/* libros / apps / tags */
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--gap)}
.grid2+.grid2,.grid2+.more{margin-top:var(--gap)}
.book .body{display:grid;grid-template-columns:1fr;gap:10px}
.book .body.cov{grid-template-columns:96px 1fr;gap:16px}
.cover{width:96px;aspect-ratio:2/3;border-radius:6px;overflow:hidden;border:1px solid color-mix(in oklab,var(--wc) 40%,var(--border));box-shadow:8px 8px 0 -3px var(--wc);transform:rotate(-2deg);transition:transform .3s}
.book:hover .cover{transform:rotate(0)}
.cover img{width:100%;height:100%;object-fit:cover}
.book h3,.tagwin h3{margin:0 0 6px;font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.2;letter-spacing:-.01em;font-variation-settings:"opsz" 48,var(--wonk)}
.book h3 a:hover{color:var(--wc)}
.book p,.tagwin p{margin:0;font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--subtle);font-weight:380}
.book .by{font-size:10.5px;color:var(--accent-2);margin-bottom:8px}
.pill{display:inline-block;padding:1px 7px;border-radius:5px;background:color-mix(in oklab,var(--wc) 18%,var(--surface));color:var(--wc);border:1px solid color-mix(in oklab,var(--wc) 40%,transparent);font-size:9.5px;margin-bottom:8px}
.tagwin{--wc:var(--pal-5)}
.tagwin:nth-child(7n+1){--wc:var(--pal-1)}.tagwin:nth-child(7n+2){--wc:var(--pal-2)}.tagwin:nth-child(7n+3){--wc:var(--pal-3)}.tagwin:nth-child(7n+4){--wc:var(--pal-4)}.tagwin:nth-child(7n+5){--wc:var(--pal-5)}.tagwin:nth-child(7n+6){--wc:var(--pal-6)}.tagwin:nth-child(7n+7){--wc:var(--pal-7)}
.tagwin h3{color:var(--wc)}
.tagwin:hover{transform:translateY(-2px)}

/* hint / footer */
.hint{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;align-items:center;padding:6px 8px 14px;color:var(--muted);font-size:10.5px}
.hint span{display:inline-flex;gap:6px;align-items:center}
.hint .kbd{color:var(--pal-5)}
.hint .copy a{color:var(--subtle)}

/* teclas */
.keys{position:fixed;inset:0;z-index:70;display:grid;place-items:center;background:color-mix(in oklab,var(--mantle) 55%,transparent);backdrop-filter:blur(4px)}
.keys .win{width:min(560px,calc(100% - 32px))}
.keys table{width:100%;border-collapse:collapse;font-size:11.5px}
.keys td{padding:7px 4px;border-bottom:1px dashed var(--border);color:var(--subtle)}
.keys td:first-child{width:150px;color:var(--text)}
.keys td:first-child .kbd{color:var(--pal-3)}
.keys tr:last-child td{border-bottom:0}

/* ---------- monocle (lectura) ---------- */
.mono-wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--gap)}
.reader{display:grid;grid-template-columns:1fr}
@media (min-width: 1100px){.reader{grid-template-columns:220px minmax(0,1fr) 220px}.reader.no-toc{grid-template-columns:120px minmax(0,1fr) 120px}}
.hero{position:relative;aspect-ratio:21/9;max-height:440px;overflow:hidden;border-bottom:1px solid var(--border);grid-column:1/-1;margin:0}
.hero img{width:100%;height:100%;object-fit:cover;transform:scale(1.02) translateY(calc(var(--py,0) * 1px))}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,color-mix(in oklab,var(--surface) 85%,transparent) 100%);pointer-events:none}
.hero .fn{position:absolute;left:16px;bottom:12px;right:16px;font-size:10.5px;color:var(--foam);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.toc{position:sticky;top:64px;align-self:start;padding:28px 0 0 22px;font-size:10.5px;color:var(--muted);display:none}
@media (min-width: 1100px){.toc{display:block}}
.toc:empty,.toc.empty{display:none}
.toc .t{color:var(--pal-7);font-weight:700;margin-bottom:10px;letter-spacing:.1em;font-size:9.5px}
.toc a{display:block;padding:4px 0 4px 10px;border-left:1px solid var(--border);color:var(--muted);transition:color .15s;line-height:1.45}
.toc a.h3{padding-left:20px;font-size:10px}
.toc a:hover{color:var(--text)}
.toc a.on{color:var(--text);border-left-color:var(--pal-4)}
.essay{max-width:66ch;margin:0 auto;padding:34px 22px 40px;font-family:var(--serif);font-size:18.5px;line-height:1.64;font-weight:380;font-variation-settings:"opsz" 18;color:var(--text);min-width:0;width:100%}
.essay.wide{max-width:none;padding:22px}
.essay .meta{font-family:var(--mono);font-size:10.5px;color:var(--subtle);display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:22px;font-weight:400}
.essay .meta .d{color:var(--gold)}.essay .meta .rt{color:var(--pal-4)}.essay .meta .au{color:var(--foam)}
.essay .meta .tg{color:var(--accent-2)}
.essay .meta .tg:nth-of-type(3n+1){color:var(--pal-7)}.essay .meta .tg:nth-of-type(3n+2){color:var(--pal-6)}.essay .meta .tg:nth-of-type(3n+3){color:var(--pal-5)}
.essay .meta a:hover{text-decoration:underline}
.essay h1{font-size:clamp(32px,4.4vw,46px);line-height:1.08;font-weight:640;letter-spacing:-.018em;margin:0 0 20px;text-wrap:balance;font-variation-settings:"opsz" 144,"SOFT" 40,"WONK" 1;
  background:linear-gradient(120deg,var(--text) 40%,var(--accent) 75%,var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.essay .lede{font-size:21px;line-height:1.48;color:var(--subtle);font-weight:340;margin:0 0 34px;font-style:italic;font-variation-settings:"opsz" 24,var(--wonk)}
.essay .end{font-family:var(--mono);font-size:11px;color:var(--muted);margin-top:36px;padding-top:18px;border-top:1px dashed var(--border);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.aside{position:sticky;top:64px;align-self:start;padding:28px 22px 0 0;display:none;font-size:10.5px;color:var(--muted)}
@media (min-width: 1100px){.aside{display:block}}
.aside .box{border:1px dashed var(--border);border-radius:8px;padding:10px 12px;line-height:1.7}
.aside .box b{display:block;color:var(--pal-6);margin-bottom:2px}
.nav2{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
@media (max-width: 700px){.nav2{grid-template-columns:1fr}}
.nav2 .win{cursor:pointer}
.nav2 .win:only-child{grid-column:1/-1}
.nav2 .body{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:center;font-family:var(--serif);font-size:16px;line-height:1.3;font-weight:500;font-variation-settings:"opsz" 20,var(--wonk)}
.nav2 .body img{width:56px;height:56px;border-radius:8px;object-fit:cover;border:1px solid var(--border)}
.nav2 .body>div:only-child{grid-column:1/-1}
.nav2 .body small{display:block;font-family:var(--mono);font-size:10px;color:var(--gold);margin-bottom:6px;font-weight:400}
.nav2 .next .body{grid-template-columns:1fr 56px;text-align:right}
.back:hover{text-decoration:underline}

/* ---------- contenido Koenig (.gh-content) ---------- */
.gh-content>*+*{margin-top:0}
.essay .gh-content p{margin:0 0 20px}
.essay .gh-content h2,.essay .gh-content h3,.essay .gh-content h4{font-family:var(--serif);letter-spacing:-.012em;line-height:1.22;font-variation-settings:"opsz" 72,var(--wonk);scroll-margin-top:70px}
.essay .gh-content h2{font-size:25px;font-weight:620;margin:44px 0 12px}
.essay .gh-content h3{font-size:21px;font-weight:600;margin:34px 0 10px}
.essay .gh-content h4{font-size:18px;font-weight:600;margin:28px 0 8px;font-family:var(--mono);letter-spacing:0;font-size:12px;text-transform:uppercase;color:var(--pal-5)}
.essay .gh-content h2::before{content:"## ";font-family:var(--mono);font-size:13px;color:var(--pal-4);font-weight:600;vertical-align:.15em}
.essay .gh-content h3::before{content:"### ";font-family:var(--mono);font-size:11px;color:var(--pal-5);font-weight:600;vertical-align:.15em}
.gh-content a{color:var(--accent);border-bottom:1px solid color-mix(in oklab,var(--accent) 40%,transparent);transition:border-color .15s}
.gh-content a:hover{border-bottom-color:var(--accent)}
.gh-content strong{font-weight:650}
.gh-content em{font-variation-settings:"opsz" 18,var(--wonk)}
.gh-content ul,.gh-content ol{padding-left:1.4em;margin:0 0 20px}
.gh-content li{margin:0 0 6px}
.gh-content li::marker{color:var(--pal-3);font-family:var(--mono);font-size:.85em}
.gh-content blockquote{margin:26px 0;padding:6px 0 6px 22px;border-left:2px solid;border-image:linear-gradient(180deg,var(--pal-7),var(--pal-6)) 1;color:var(--subtle);font-style:italic;font-variation-settings:"opsz" 24,var(--wonk)}
.gh-content blockquote p:last-child{margin-bottom:0}
.gh-content blockquote.kg-blockquote-alt{border:0;padding:8px 0;text-align:center;font-size:1.25em;line-height:1.4;color:var(--text);font-weight:340}
.gh-content hr{border:0;height:1px;margin:34px 0;background:var(--rainbow);opacity:.5}
.gh-content hr::after{content:none}
.gh-content img{border-radius:8px}
.gh-content figure{margin:26px 0}
.gh-content figcaption{font-family:var(--mono);font-size:10.5px;color:var(--muted);margin-top:8px;text-align:center}
.gh-content figcaption a{color:var(--foam)}
.gh-content code{font-family:var(--mono);font-size:.78em;background:var(--overlay);border:1px solid var(--border);border-radius:4px;padding:1px 5px;color:var(--pal-7)}
.gh-content pre{font-family:var(--mono);font-size:12px;background:var(--mantle);border:1px solid color-mix(in oklab,var(--pal-6) 40%,var(--border));box-shadow:inset 3px 0 0 var(--pal-6);border-radius:8px;padding:14px 16px;overflow-x:auto;line-height:1.6;color:var(--text);margin:0 0 22px;tab-size:2}
.gh-content pre code{background:none;border:0;padding:0;font-size:inherit;color:inherit}
.gh-content table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:11.5px;margin:0 0 22px;display:block;overflow-x:auto}
.gh-content th,.gh-content td{padding:8px 10px;border-bottom:1px dashed var(--border);text-align:left;vertical-align:top}
.gh-content th{color:var(--pal-3);font-weight:600}
.gh-content iframe{max-width:100%;border-radius:8px}
.gh-content .kg-image-card img,.gh-content .kg-gallery-image img{cursor:zoom-in}
.gh-content .kg-card{margin:26px 0}
.gh-content .kg-width-wide{width:calc(100% + 160px);margin-left:-80px;max-width:calc(100vw - 2 * var(--gap) - 8px)}
.gh-content .kg-width-full{width:calc(100% + 240px);margin-left:-120px;max-width:calc(100vw - 2 * var(--gap) - 8px)}
@media (max-width: 1100px){.gh-content .kg-width-wide,.gh-content .kg-width-full{width:100%;margin-left:0}}
.gh-content .kg-gallery-image img{border-radius:6px}
.gh-content .kg-bookmark-card{margin:26px 0}
.gh-content .kg-bookmark-container{display:flex;flex-direction:row-reverse;border:1.5px solid var(--border)!important;border-radius:var(--radius)!important;background:color-mix(in oklab,var(--surface) 90%,transparent)!important;color:var(--text)!important;text-decoration:none;border-bottom:1.5px solid var(--border);box-shadow:0 20px 40px -28px var(--shadow);overflow:hidden;transition:border-color .2s,transform .2s}
.gh-content .kg-bookmark-container:hover{border-color:var(--pal-5)!important;transform:translateY(-2px)}
.gh-content .kg-bookmark-content{padding:14px 16px!important;font-family:var(--mono);flex:1;min-width:0}
.gh-content .kg-bookmark-title{font-family:var(--serif)!important;font-size:18px!important;font-weight:600!important;line-height:1.25!important;color:var(--text)!important;font-variation-settings:"opsz" 24,var(--wonk)}
.gh-content .kg-bookmark-description{font-family:var(--serif)!important;font-size:14px!important;color:var(--subtle)!important;font-weight:380;margin-top:6px!important;line-height:1.45!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gh-content .kg-bookmark-metadata{font-size:10.5px!important;color:var(--pal-5)!important;margin-top:10px!important;font-family:var(--mono)}
.gh-content .kg-bookmark-metadata .kg-bookmark-author{color:var(--pal-3)}
.gh-content .kg-bookmark-icon{width:16px!important;height:16px!important;border-radius:3px}
.gh-content .kg-bookmark-thumbnail{flex:0 0 220px;max-width:38%}
.gh-content .kg-bookmark-thumbnail img{border-radius:0!important;height:100%;object-fit:cover}
@media (max-width: 600px){.gh-content .kg-bookmark-container{flex-direction:column}.gh-content .kg-bookmark-thumbnail{max-width:100%;flex:none;aspect-ratio:16/9}}
.gh-content .kg-callout-card{border-radius:10px;border:1px solid var(--border);font-family:var(--serif);font-size:16px;background:var(--overlay)!important;color:var(--text)!important}
.gh-content .kg-callout-card-accent{background:color-mix(in oklab,var(--accent) 16%,var(--surface))!important;border-color:color-mix(in oklab,var(--accent) 50%,var(--border))}
.gh-content .kg-callout-card-accent a{color:var(--accent)}
.gh-content .kg-callout-emoji{filter:drop-shadow(0 0 8px var(--accent))}
.gh-content .kg-toggle-card{background:var(--overlay)!important;border:1px solid var(--border);border-radius:10px;color:var(--text)!important}
.gh-content .kg-toggle-heading-text{font-family:var(--serif);font-weight:600;color:var(--text)!important}
.gh-content .kg-toggle-content{color:var(--subtle)!important}
.gh-content .kg-btn{font-family:var(--mono)!important;font-size:12px!important;border-radius:8px!important;padding:10px 16px!important;height:auto!important}
.gh-content .kg-btn-accent{background:var(--accent)!important;color:var(--base)!important;box-shadow:0 10px 24px -12px var(--accent)}
.gh-content .kg-header-card{border-radius:var(--radius);overflow:hidden}
.gh-content .kg-header-card h2,.gh-content .kg-header-card h3{font-variation-settings:"opsz" 144,var(--wonk)}
.gh-content .kg-header-card h2::before{content:none}
.gh-content .kg-file-card-container{border:1.5px solid var(--border)!important;border-radius:var(--radius)!important;background:var(--overlay)!important;color:var(--text)!important;font-family:var(--mono);text-decoration:none}
.gh-content .kg-file-card-container:hover{border-color:var(--pal-3)!important}
.gh-content .kg-file-card-title{font-family:var(--serif)!important;font-size:17px!important;color:var(--text)!important}
.gh-content .kg-file-card-caption{color:var(--subtle)!important;font-size:12px!important}
.gh-content .kg-file-card-metadata{color:var(--pal-3)!important;font-size:10.5px!important}
.gh-content .kg-file-card-icon svg{color:var(--pal-3)}
.gh-content .kg-product-card-container{border:1.5px solid var(--border)!important;border-radius:var(--radius)!important;background:var(--overlay)!important;color:var(--text)!important}
.gh-content .kg-video-card,.gh-content .kg-audio-card{border-radius:var(--radius);overflow:hidden}
.gh-content .kg-audio-card{background:var(--overlay)!important;border:1px solid var(--border)!important;color:var(--text)!important}
.gh-content .kg-embed-card{border-radius:var(--radius);overflow:hidden}
.gh-content .kg-signup-card{border-radius:var(--radius)}
.gh-content .kg-nft-card-container{border:1.5px solid var(--border)!important;border-radius:var(--radius)!important;background:var(--overlay)!important}

/* Prism — colores del rice */
.token.comment,.token.prolog,.token.doctype,.token.cdata{color:var(--muted);font-style:italic}
.token.punctuation{color:var(--subtle)}
.token.property,.token.tag,.token.boolean,.token.number,.token.constant,.token.symbol,.token.deleted{color:var(--pal-2)}
.token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted{color:var(--pal-4)}
.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string{color:var(--pal-5)}
.token.atrule,.token.attr-value,.token.keyword{color:var(--pal-7)}
.token.function,.token.class-name{color:var(--pal-3)}
.token.regex,.token.important,.token.variable{color:var(--pal-6)}
.token.important,.token.bold{font-weight:600}

/* comentarios */
.comments{margin-top:20px;font-family:var(--mono)}

/* Portal / sodo-search ajustes mínimos */
.gh-portal-triggerbtn-wrapper{font-family:var(--mono)!important}

/* =====================================================================
   FIX 1 — Portal / búsqueda / comentarios: iframes sin fondo opaco.
   El tema usa color-scheme:dark; los iframes de Ghost son "normal".
   Con esquemas distintos el navegador pinta un fondo blanco detrás.
   ===================================================================== */
#ghost-portal-root iframe,#sodo-search-root iframe,.gh-comments iframe,
iframe[title="portal-trigger"],iframe[title="portal-popup"],iframe[title="sodo-search"],iframe[title="comments-frame"]{
  color-scheme:normal!important;background:transparent!important}
#ghost-portal-root,#sodo-search-root{color-scheme:normal}

/* =====================================================================
   FIX 2 — Móvil: texto nítido y legible.
   Sin vidrio (backdrop-filter), sin 3D, menos blur de fondo y tamaños
   mayores. El GPU del teléfono rasterizaba el texto borroso.
   ===================================================================== */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (max-width: 900px){
  :root{--glass:100%}
  .win,.bar,.lb,.lb .tbar,.lb .foot,.keys{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .win{background:var(--surface);animation:none!important;transform:none!important;filter:none!important}
  .win.focus::after{animation:none!important}
  .ws-panel{transform-style:flat!important;backface-visibility:visible!important;animation:none!important;transform:none!important}
  .stage{perspective:none!important}
  .reader-win,.nav2 .win{animation:none!important}
  .avatar{animation:none!important}
  .blob{filter:blur(48px);opacity:calc(var(--blob) * .8)}
  .blob-d,.blob-e,.aurora{display:none}
  .wall{transform:none!important}
  .expose .win{transform:none;opacity:1}

  /* texto degradado → color sólido (Safari móvil lo pinta mal al animar) */
  .post.sel h2,.about h3,.essay h1,.kv .u,.essay .rule{background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;color:var(--text)!important;-webkit-text-fill-color:initial}
  .essay .rule{color:var(--muted)!important}

  /* tamaños */
  body{font-size:14px}
  .tbar{font-size:12px;height:34px}
  .filter input{font-size:15px}
  .filter,.filter .count{font-size:13px}
  .year{font-size:11.5px}
  .post{padding:14px 14px 16px 12px}
  .post .date{font-size:12px}
  .post .date .lang{font-size:11px}
  .post h2{font-size:20px;line-height:1.22}
  .post p{font-size:15.5px;line-height:1.5}
  .post .tags{font-size:11.5px}
  .more,.pager,.expand{font-size:12.5px}
  .kv{font-size:12.5px;gap:5px 12px}
  .kv .u{font-size:13.5px}
  .motd{font-size:16px}
  .log{font-size:13px}
  .log .msg{font-size:15.5px}
  .status{font-size:12px}
  .thumbs button span{font-size:11px}
  .gallery .cap{font-size:12px}
  .bat{font-size:12.5px}
  .hint{font-size:12px}
  .hint .copy{font-size:12px}
  .about p{font-size:15.5px}
  .about .rules{font-size:12.5px}
  .stats div{font-size:11.5px}
  .stats b{font-size:17px}
  .entry .e-ts{font-size:12px}
  .entry h3{font-size:20px}
  .entry h3 small{font-size:15px}
  .entry p{font-size:15.5px}
  .book .by,.app .by{font-size:12px}
  .pill{font-size:11px}
  .book h3,.app h3{font-size:20px}
  .book p,.app p{font-size:15.5px}
  .micro{font-size:16px}
  .keys table{font-size:13px}
  .kbd{font-size:11.5px;line-height:19px}
  .essay{padding:26px 18px 36px;font-size:17.5px;line-height:1.62}
  .essay .meta{font-size:12px}
  .essay h1{font-size:clamp(28px,7.5vw,36px)}
  .essay .lede{font-size:19px}
  .essay h2{font-size:23px}
  .essay .end{font-size:12px}
  .hero .fn{font-size:12px}
  .nav2 .body{font-size:15.5px}
  .nav2 .body small{font-size:11.5px}
  .gh-content pre{font-size:13px}
  .gh-content figcaption{font-size:12px}
  .gh-content table{font-size:13px}
  .gh-content .kg-bookmark-metadata,.gh-content .kg-file-card-metadata{font-size:12px!important}
  .lb .tbar{font-size:12.5px}
  .lb .foot{font-size:12.5px}
  .lb .foot .cap{font-size:15.5px}
  .expose-tag{font-size:12.5px}
}