/* The shared graphite palette applies to the workspace, never printed documents. */
@media screen{
 :root{font-family:Inter,"Helvetica Neue",Arial,sans-serif;background:#090d13;color:#eef3f8;--cyan:#b6eff1;--line:#344352}
 body{background:radial-gradient(ellipse at 85% 0%,#1d344655,transparent 45%),#090d13}
 header{background:#0c121bee;border-bottom:1px solid #344352;gap:1.5rem}
 header .brand{padding:.5rem .75rem;border-radius:.6rem;background:linear-gradient(130deg,#fff,#cddfe5)}
 header .brand img{filter:none;width:10rem;max-width:100%;height:auto}
 header nav a{color:#d0e0ee;text-decoration:none;font-size:.88rem}
 header nav a:hover{color:#b6eff1;text-decoration:underline}
 .intro{padding-block:3.5rem 2.5rem}
 .intro .kicker{font-size:.75rem;color:#9fbccc;letter-spacing:.09em}
 .intro h1{font-size:clamp(2.4rem,5vw,4.3rem);font-weight:500;letter-spacing:-.05em;line-height:1.1;max-width:20ch;text-wrap:balance;margin-block:1.3rem}
 html[dir=rtl] .intro h1{letter-spacing:0;line-height:1.3}
 .intro p{color:#b0c1cf;line-height:1.8;max-width:48rem}
 .panel,.personal-tools,.tool-card,.entry-card,.metric{background:linear-gradient(140deg,#16222e,#0e1721);border:1px solid #354758;border-radius:.85rem;box-shadow:inset 0 1px 0 #ffffff08}
 .tool-card{padding:1.75rem;transition:border-color .2s,background .2s}
 .tool-card:hover{border-color:#769aae;background:#1a2b3a}
 .tool-card h2{font-size:1.4rem;letter-spacing:-.025em;font-weight:500}
 .tool-card p{color:#b6c7d5;line-height:1.75}
 .tool-card>a{color:#ecf6fc;text-decoration:none}
 h2,h3{line-height:1.3}
 button,.button-link{border-radius:.5rem;box-shadow:inset 0 1px 0 #ffffff35;letter-spacing:0}
 button.secondary{box-shadow:none;color:#c9eef4;border-color:#5a7c90}
 input,select,textarea{background:#0a131d;color:#eef6fc;border-color:#526e83;border-radius:.5rem}
 label{color:#c6d8e5}
 .quick-links a{border-radius:.5rem;background:#172735;color:#ccecf4}
 footer{border-top:1px solid #344352;color:#a1b6c6;padding-block:2rem}
 :where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #b6eff1;outline-offset:4px}
}
@media screen and (max-width:42rem){header{gap:.8rem}.intro{padding-block:2.25rem 1.75rem}.intro h1{font-size:clamp(2.3rem,9vw,3.5rem)}.tool-card{padding:1.25rem}}
@media(prefers-reduced-motion:reduce){.tool-card{transition:none}}