@import url('tokens/color.css');
@import url('tokens/spacing.css');
@import url('tokens/border.css');
@import url('tokens/pattern.css');
@import url('tokens/typography.css');
@import url('tokens/state.css');
@import url('tokens/filter.css');
:root{--font-size:18px}
@font-face{font-family:Galmuri11;src:url('fonts/galmuri11.woff2') format('woff2');font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:Galmuri11;src:url('fonts/galmuri11-bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:block}
*,*::before,*::after{box-sizing:border-box;border-radius:0!important}
html,body{margin:0;min-height:100%;background:var(--paper);color:var(--fg);font-family:var(--font-family)}
.filter-defs{position:absolute;width:0;height:0;overflow:hidden}
.screen{position:fixed;inset:0;overflow:auto;filter:var(--ink-filter) brightness(var(--screen-brightness));padding:var(--page-pad);display:flex;align-items:center;justify-content:center}
.content{width:min(100%,720px);margin:auto}
h1{height:var(--topbar);margin:0;display:flex;align-items:center;line-height:var(--font-line)}
nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
a{min-height:var(--ctl);display:flex;align-items:center;flex-wrap:wrap;gap:var(--gap);padding:var(--pad);border:var(--border-w) solid var(--line);box-shadow:var(--shadow-elevated);background:var(--card);color:var(--fg);text-decoration:none;line-height:var(--font-line)}

a svg{width:var(--icon);height:var(--icon);flex:none}
a span{flex:1;min-width:0}
a span.author{flex:none;white-space:nowrap}
a time{white-space:nowrap}
a:hover,a:focus-visible{background:var(--dither);text-shadow:var(--halo);outline:none}
a:hover svg,a:focus-visible svg{filter:var(--halo-icon)}
a:active{background:var(--accent);color:var(--accent-fg);text-shadow:none}

[hidden]{display:none!important}
.pagination{display:flex;justify-content:center;gap:var(--gap);margin-top:var(--gap)}
.pagination button{height:var(--ctl);min-width:var(--ctl);border:var(--border-w) solid var(--line);background:var(--surface);color:var(--fg);font-family:var(--font-family);line-height:var(--font-line);cursor:pointer}
.pagination button:hover,.pagination button:focus-visible{background:var(--dither);text-shadow:var(--halo);outline:none}
.pagination button[aria-current="page"]{background:var(--accent);color:var(--accent-fg);text-shadow:none}

@media(max-width:600px){a span:not(.author){flex:1 1 calc(100% - var(--icon) - var(--gap))}a span.author{margin-left:calc(var(--icon) + var(--gap))}a time{margin-left:auto}}