/* Little 主题，令牌同 www.alittle.hk */
/* Little 家族共用令牌 + 零件，取自官网 alittle-site/src/styles/global.css */
:root{color-scheme:light dark;
--sky:#5bbeeb;--orange:#ff8a3d;--on-color:#0e2230;
--paper:#fff9f1;--card:#fff;--ink:#0e2230;--ink-2:#3d5566;--line:#0e2230;--shadow:#0e2230;--link:#1a6e9a;--tint:#e3f4fc;
--hero-bg:var(--sky);--hero-ink:#0e2230;--ok:#1d7a4f;
--r:18px;--gutter:16px;
--font:-apple-system,BlinkMacSystemFont,"PingFang SC","PingFang HK","Hiragino Sans GB",system-ui,"Microsoft YaHei",sans-serif;
--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace}
@media (prefers-color-scheme:dark){:root{--paper:#0b1620;--card:#12222f;--ink:#eaf4fa;--ink-2:#a9bfcd;--line:#eaf4fa;--shadow:#2e7fa8;--link:#7ccdf2;--tint:#13303f;--hero-bg:#0f2a3b;--hero-ink:#eaf4fa;--ok:#5fd39a}}
@media (min-width:768px){:root{--gutter:32px}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.75 var(--font);-webkit-font-smoothing:antialiased;overflow-x:clip}
h1,h2,h3,h4,h5,h6{margin:0;text-wrap:balance}p{margin:0}
a{color:var(--link);text-underline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:6px}
.logo{width:34px;height:34px;border-radius:9px;border:2px solid var(--line);flex:none}
.logo-bg{fill:var(--sky)}.logo-i{fill:#fff}.logo-dot{fill:var(--orange)}.logo-arc{fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round}.logo-arc.far{opacity:.6}
.mark{background:linear-gradient(transparent 12%,var(--orange) 12%,var(--orange) 92%,transparent 92%);color:var(--on-color);padding:0 .08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.eyebrow{display:inline-flex;font-size:14px;font-weight:800;letter-spacing:.04em;line-height:1.5;padding:4px 12px;border:2px solid currentColor;border-radius:999px}
/* 正式上线时这份就是 usr/themes/little/static/css/style.css，选择器对的是 classic-22 的真实结构 */
.container-fluid,.container{width:min(100% - 2*var(--gutter),1136px);margin-inline:auto}
.container-thin{width:min(100%,720px);margin-inline:auto}
ul{list-style:none;margin:0;padding:0}
.site-navbar{width:100%;border-bottom:3px solid var(--line);background:var(--paper);position:relative}
.site-nav{width:min(100% - 2*var(--gutter),1136px);margin-inline:auto;display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px;padding-block:12px}
.brand{display:flex;align-items:center;gap:10px;min-height:44px;color:var(--ink);text-decoration:none;font-weight:900;font-size:22px;letter-spacing:-.01em}
#nav-toggler{display:none}
.nav-toggler-btn{display:none;margin-left:auto;width:44px;height:40px;place-items:center;border:2px solid var(--line);border-radius:10px;cursor:pointer}
.nav-menu{display:flex;align-items:center;gap:20px;margin-left:auto}
.nav-menu a{color:var(--ink);font-weight:800;font-size:16px;text-decoration:none;padding:4px 0;border-bottom:3px solid transparent}
.nav-menu a:hover,.nav-menu a.active{border-bottom-color:var(--orange)}
input,textarea{font:inherit;color:var(--ink);background:var(--card);border:2px solid var(--line);border-radius:12px;padding:9px 12px;width:100%}
.nav-menu input[type=search]{width:150px;padding:4px 12px;border-radius:10px;font-size:14px}
.home-hero{background:var(--hero-bg);color:var(--hero-ink);border-bottom:3px solid var(--line);padding-block:44px 52px}
.home-hero .inner{width:min(100% - 2*var(--gutter),720px);margin-inline:auto}
.home-hero h1{font-size:clamp(36px,6.4vw,56px);font-weight:900;letter-spacing:-.02em;line-height:1.1;margin:14px 0}
.home-hero p.lede{font-size:18px;font-weight:600}
main.container{padding-block:44px 24px}
article.post{background:var(--card);border:3px solid var(--line);border-radius:var(--r);box-shadow:6px 6px 0 var(--shadow);padding:24px 26px;margin-bottom:26px}
.post-separator{display:none}
.entry-header.text-center{text-align:left}
.entry-title{font-size:25px;font-weight:900;line-height:1.3;letter-spacing:-.01em}
.entry-title a{color:var(--ink);text-decoration:none}
.entry-title a:hover{text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:3px}
.entry-meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin:8px 0 12px;font-size:13.5px;font-weight:700;color:var(--ink-2)}
.entry-meta a{color:inherit;text-decoration:none}
.fmt p{margin-bottom:1em}.fmt p:last-child{margin-bottom:0}
.fmt h2{font-size:22px;font-weight:900;margin:1.6em 0 .5em}
.fmt ul{list-style:disc;padding-left:1.4em;margin-bottom:1em}
.fmt code{font:.9em var(--mono);background:var(--tint);padding:1px 6px;border-radius:6px}
.fmt pre{font:14px/1.6 var(--mono);background:var(--tint);border:2px solid var(--line);border-radius:12px;padding:12px 14px;overflow-x:auto}
.fmt pre code{background:none;padding:0}
.fmt blockquote{margin:1em 0;padding:2px 0 2px 14px;border-left:4px solid var(--orange);color:var(--ink-2)}
.more a,.page-navigator a{font-weight:900;color:var(--ink);text-decoration-color:var(--orange);text-decoration-thickness:3px}
.post-nav{margin-bottom:34px}
.post-nav .page-navigator{display:flex;justify-content:space-between;gap:12px;font-size:15px;font-weight:700;color:var(--ink-2)}
#comments>h2{font-size:22px;font-weight:900;text-align:left;margin-bottom:14px}
.comment-list{list-style:none;padding:0;margin:0 0 22px}
.comment-body{background:var(--tint);border:3px solid var(--line);border-radius:var(--r);padding:14px 18px;margin-bottom:14px;font-size:15.5px}
.comment-author{display:flex;align-items:center;gap:8px;font-weight:900}
.comment-author .avatar{width:32px;height:32px;border-radius:50%;border:2px solid var(--line)}
.comment-author cite{font-style:normal}.comment-author a{color:var(--ink);text-decoration:none}
.comment-meta{font-size:12.5px}.comment-meta a{color:var(--ink-2);text-decoration:none}
.comment-reply{font-size:13.5px;font-weight:800}
.respond h5{font-size:19px;font-weight:900;margin-bottom:10px}
.respond .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:10px}
button[type=submit]{cursor:pointer;font:inherit;font-weight:900;padding:10px 20px;border-radius:14px;border:3px solid var(--on-color);background:var(--orange);color:var(--on-color);box-shadow:3px 3px 0 var(--on-color)}
.site-footer{width:100%;max-width:none;border-top:3px solid var(--line);margin-top:40px;padding:18px var(--gutter) 28px;font-size:13px;font-weight:600;color:var(--ink-2)}
.d-flex{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 18px;max-width:1136px;margin-inline:auto}
.list-inline{display:flex;flex-wrap:wrap;gap:4px 14px}
.site-footer a{color:inherit}
@media (max-width:640px){
.nav-toggler-btn{display:grid}
.nav-menu{display:none;width:100%;flex-direction:column;align-items:flex-start;gap:8px;margin-left:0;padding-top:6px}
#nav-toggler:checked~.nav-menu{display:flex}
.nav-menu li{width:100%}.nav-menu input[type=search]{width:100%}
.home-hero{padding-block:30px 38px}
article.post{padding:18px}
.entry-title{font-size:22px}}
.home-hero .ln{display:block}

.text-center{text-align:center}.text-muted{color:var(--ink-2)}
.entry-header.text-center,#comments>h2{text-align:left}
.container-thin>h1{font-size:34px;font-weight:900;margin-bottom:16px}
.container-thin>h6{font-size:15px;font-weight:800;color:var(--ink-2);margin-bottom:18px}
.container-thin>form{margin-bottom:14px}
.container-thin>.text-center .list-inline{justify-content:center;font-weight:800;margin-bottom:22px}
.fmt img{max-width:100%;height:auto;border-radius:12px}
.fmt h3{font-size:19px;font-weight:900;margin:1.4em 0 .4em}
.fmt ol{padding-left:1.4em;margin-bottom:1em}
.fmt table{border-collapse:collapse;width:100%;font-size:15px;margin-bottom:1em}.fmt th,.fmt td{border:2px solid var(--line);padding:6px 10px;text-align:left}
main nav:not(.post-nav)>ul{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:8px 0 18px}
main nav:not(.post-nav)>ul li a,main nav:not(.post-nav)>ul li span{display:grid;place-items:center;min-width:40px;height:38px;padding-inline:10px;border:2px solid var(--line);border-radius:10px;color:var(--ink);font-weight:800;font-size:14px;text-decoration:none;background:var(--card)}
main nav:not(.post-nav)>ul li.current a{background:var(--ink);color:var(--paper)}
.comment-children{margin-left:18px;margin-top:12px}
.cancel-comment-reply{font-size:13.5px;font-weight:800}
a[role=button]{display:inline-block;font-weight:900;color:var(--on-color);background:var(--orange);text-decoration:none;padding:10px 20px;border-radius:14px;border:3px solid var(--on-color);box-shadow:3px 3px 0 var(--on-color)}