:root{--hg-ink: #1c1917;--hg-muted: #57534e;--hg-bg: #faf7f2;--hg-sheet: #ffffff;--hg-line: #e7e0d6;--hg-tag: #c2410c;--hg-tag-deep: #9a3412;--hg-tag-soft: #fff1e6;--hg-green: #15803d;--hg-green-soft: #ecfdf3;--hg-red: #b91c1c;--hg-red-soft: #fef2f2;--hg-code-bg: #1f2430;--hg-code-ink: #e6e1cf;--hg-code-tag: #5ccfe6;--hg-code-attr: #ffd580;--hg-code-str: #bae67e;--hg-code-com: #8a93a5;--hg-radius: 14px;--hg-shadow: 0 14px 36px rgb(28 25 23 / 0.07);--hg-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;}
body.hg-markup,body.hg-markup .main-header{background: var(--hg-bg);}
.hg-page{background: var(--hg-bg);color: var(--hg-ink);padding: 1rem 0 4rem;}
.hg-page a{color: var(--hg-tag-deep);text-underline-offset: 3px;}
.hg-page a:hover{color: var(--hg-tag);}
.hg-page code{font-family: var(--hg-mono);font-size: 0.88em;background: var(--hg-tag-soft);color: var(--hg-tag-deep);padding: 0.1em 0.35em;border-radius: 5px;}
.hg-hero{display: grid;grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);gap: clamp(1.5rem, 4vw, 3rem);align-items: center;padding: 2rem 0;border-bottom: 1px solid var(--hg-line);}
.hg-kicker{font-family: var(--hg-mono);font-size: 0.85rem;color: var(--hg-tag);letter-spacing: 0.02em;margin-bottom: 0.75rem;}
.hg-hero h1{font-size: clamp(1.9rem, 4vw, 2.85rem);line-height: 1.12;font-weight: 800;letter-spacing: -0.02em;margin-bottom: 1rem;}
.hg-lede{font-size: clamp(1.05rem, 2vw, 1.2rem);color: var(--hg-ink);}
.hg-hero-copy p{color: var(--hg-muted);line-height: 1.7;}
.hg-hero-copy .hg-lede{color: var(--hg-ink);}
.hg-byline{display: flex;flex-wrap: wrap;gap: 0.5rem 1.25rem;margin-top: 1.25rem;padding-top: 1rem;border-top: 1px dashed var(--hg-line);font-size: 0.9rem;color: var(--hg-muted);}
.hg-byline a{font-weight: 600;}
.hg-pipe{margin: 0;background: var(--hg-code-bg);color: var(--hg-code-ink);border-radius: var(--hg-radius);box-shadow: 0 24px 50px rgb(31 36 48 / 0.28);overflow: hidden;font-family: var(--hg-mono);font-size: 0.9rem;}
.hg-pipe figcaption{display: flex;align-items: center;gap: 0.4rem;padding: 0.7rem 1rem;background: rgb(255 255 255 / 0.05);border-bottom: 1px solid rgb(255 255 255 / 0.08);}
.hg-dot{width: 10px;height: 10px;border-radius: 50%;background: #f28779;}
.hg-dot:nth-child(2){background: #ffd580;}
.hg-dot:nth-child(3){background: #bae67e;}
.hg-file{margin-left: 0.6rem;color: var(--hg-code-com);font-size: 0.8rem;}
.hg-pipe ol{list-style: none;counter-reset: hgline;margin: 0;padding: 1rem 1rem 0.5rem;}
.hg-pipe li{counter-increment: hgline;padding: 0.2rem 0;white-space: nowrap;overflow-x: auto;}
.hg-pipe li::before{content: counter(hgline);display: inline-block;width: 1.6rem;color: var(--hg-code-com);opacity: 0.6;}
.hg-pipe .hg-c{color: var(--hg-code-com);}
.hg-pipe .hg-t{color: var(--hg-code-tag);}
.hg-pipe .hg-a{color: var(--hg-code-attr);}
.hg-pipe a.hg-s{color: var(--hg-code-str);text-decoration: underline dotted;}
.hg-pipe a.hg-s:hover{color: #d7f5a8;}
.hg-stats{display: grid;grid-template-columns: repeat(3, 1fr);margin: 0;border-top: 1px solid rgb(255 255 255 / 0.08);}
.hg-stats div{padding: 0.85rem 1rem;text-align: center;border-right: 1px solid rgb(255 255 255 / 0.08);}
.hg-stats div:last-child{border-right: 0;}
.hg-stats dt{font-size: 1.5rem;font-weight: 700;color: #fff;}
.hg-stats dd{margin: 0;font-size: 0.75rem;color: var(--hg-code-com);text-transform: uppercase;letter-spacing: 0.08em;}
.hg-toc{display: flex;flex-wrap: wrap;gap: 0.5rem;padding: 1.25rem 0;position: sticky;top: 0;z-index: 5;background: var(--hg-bg);}
.hg-toc a{font-size: 0.85rem;padding: 0.35rem 0.8rem;border: 1px solid var(--hg-line);border-radius: 999px;background: var(--hg-sheet);color: var(--hg-ink);text-decoration: none;}
.hg-toc a:hover{border-color: var(--hg-tag);color: var(--hg-tag);}
.hg-sec{padding: clamp(1.75rem, 4vw, 2.75rem) 0;border-bottom: 1px solid var(--hg-line);scroll-margin-top: 70px;}
.hg-sec h2{font-size: clamp(1.45rem, 3vw, 1.9rem);font-weight: 800;letter-spacing: -0.01em;margin-bottom: 0.85rem;}
.hg-sec h3{font-size: 1.12rem;font-weight: 700;margin: 1.6rem 0 0.6rem;}
.hg-sec p,.hg-sec li{line-height: 1.75;color: #3b3632;}
.hg-pasted{display: grid;grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));gap: 0.85rem;margin-top: 1.25rem;}
.hg-paste{display: flex;flex-direction: column;gap: 0.35rem;padding: 1rem 1.1rem;background: var(--hg-sheet);border: 1px solid var(--hg-line);border-left: 4px solid var(--hg-tag);border-radius: 10px;text-decoration: none;color: var(--hg-ink);transition: transform 0.15s ease, box-shadow 0.15s ease;}
.hg-page a.hg-paste{color: var(--hg-ink);}
.hg-paste:hover{transform: translateY(-2px);box-shadow: var(--hg-shadow);}
.hg-paste-in{font-weight: 700;line-height: 1.3;}
.hg-paste-note{font-size: 0.88rem;color: var(--hg-muted);flex: 1;}
.hg-paste-go{font-size: 0.85rem;font-weight: 600;color: var(--hg-tag-deep);}
.hg-paste-go i{font-size: 0.75rem;margin-left: 0.2rem;}
.hg-table-wrap{overflow-x: auto;margin: 1rem 0;border: 1px solid var(--hg-line);border-radius: 10px;background: var(--hg-sheet);}
.hg-table{width: 100%;border-collapse: collapse;font-size: 0.93rem;}
.hg-table th{text-align: left;font-size: 0.78rem;text-transform: uppercase;letter-spacing: 0.06em;color: var(--hg-muted);padding: 0.75rem 1rem;background: #f5f0e8;border-bottom: 1px solid var(--hg-line);}
.hg-table td{padding: 0.75rem 1rem;border-bottom: 1px solid var(--hg-line);vertical-align: top;color: #3b3632;}
.hg-table tr:last-child td{border-bottom: 0;}
.hg-table td code{white-space: nowrap;}
.hg-lvl{display: inline-block;font-size: 0.75rem;font-weight: 700;padding: 0.15rem 0.5rem;border-radius: 5px;}
.hg-lvl-error{background: var(--hg-red-soft);color: var(--hg-red);}
.hg-lvl-warning{background: #fffbeb;color: #92400e;}
.hg-code{background: var(--hg-code-bg);color: var(--hg-code-ink);font-family: var(--hg-mono);font-size: 0.88rem;line-height: 1.7;padding: 1rem 1.15rem;border-radius: 10px;overflow-x: auto;margin: 0.75rem 0 1rem;white-space: pre;}
.hg-code code{background: none;color: inherit;padding: 0;font-size: inherit;}
.hg-code .hg-c{color: var(--hg-code-com);user-select: none;}
.hg-trips{display: grid;grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));gap: 0.85rem;margin: 1.25rem 0;}
.hg-trip{background: var(--hg-sheet);border: 1px solid var(--hg-line);border-radius: 10px;padding: 1rem 1.1rem;}
.hg-trip h3{font-size: 1rem;margin: 0 0 0.6rem;}
.hg-trip h3 a{text-decoration: none;}
.hg-trip p{font-size: 0.9rem;line-height: 1.55;margin: 0.4rem 0 0;}
.hg-trip p span{display: inline-block;font-size: 0.7rem;font-weight: 700;text-transform: uppercase;letter-spacing: 0.06em;padding: 0.1rem 0.45rem;border-radius: 4px;margin-right: 0.45rem;vertical-align: 1px;}
.hg-keep span{background: var(--hg-green-soft);color: var(--hg-green);}
.hg-drop span{background: var(--hg-red-soft);color: var(--hg-red);}
.hg-rule{background: var(--hg-tag-soft);border-left: 4px solid var(--hg-tag);padding: 0.9rem 1.1rem;border-radius: 0 10px 10px 0;}
.hg-list{padding-left: 1.1rem;}
.hg-list li{margin-bottom: 0.7rem;}
.hg-list li::marker{color: var(--hg-tag);}
.hg-list strong{font-weight: 700;}
.hg-filter{display: flex;flex-wrap: wrap;gap: 0.45rem;margin: 1.1rem 0 0.85rem;}
.hg-chip{font-size: 0.85rem;padding: 0.4rem 0.8rem;border: 1px solid var(--hg-line);border-radius: 999px;background: var(--hg-sheet);color: var(--hg-ink);cursor: pointer;}
.hg-chip span{font-family: var(--hg-mono);font-size: 0.75rem;color: var(--hg-muted);margin-left: 0.2rem;}
.hg-chip:hover{border-color: var(--hg-tag);}
.hg-chip.is-on{background: var(--hg-ink);border-color: var(--hg-ink);color: #fff;}
.hg-chip.is-on span{color: #d6d3d1;}
.hg-chip:focus-visible,.hg-search input:focus-visible{outline: 3px solid rgb(194 65 12 / 0.35);outline-offset: 2px;}
.hg-search{position: relative;display: block;max-width: 420px;}
.hg-search i{position: absolute;left: 0.85rem;top: 50%;transform: translateY(-50%);color: var(--hg-muted);font-size: 0.85rem;}
.hg-search input{width: 100%;padding: 0.6rem 0.9rem 0.6rem 2.3rem;border: 1px solid var(--hg-line);border-radius: 10px;background: var(--hg-sheet);font-size: 0.95rem;color: var(--hg-ink);}
.hg-count{font-size: 0.85rem;color: var(--hg-muted);margin: 0.75rem 0 0.5rem;}
.hg-dir{list-style: none;margin: 0;padding: 0;border: 1px solid var(--hg-line);border-radius: 10px;background: var(--hg-sheet);overflow: hidden;}
.hg-row{display: grid;grid-template-columns: 2.2rem minmax(150px, 220px) 120px 1fr;gap: 0.4rem 0.9rem;align-items: baseline;padding: 0.75rem 1rem;border-bottom: 1px solid var(--hg-line);}
.hg-row:last-child{border-bottom: 0;}
.hg-row[hidden]{display: none;}
.hg-num{font-family: var(--hg-mono);font-size: 0.8rem;color: var(--hg-muted);}
.hg-row a{font-weight: 700;text-decoration: none;}
.hg-row a:hover{text-decoration: underline;}
.hg-tag{font-size: 0.72rem;font-weight: 600;color: var(--hg-tag-deep);background: var(--hg-tag-soft);padding: 0.12rem 0.5rem;border-radius: 5px;justify-self: start;white-space: nowrap;}
.hg-tag[data-kind="check"]{background: #eef2ff;color: #3730a3;}
.hg-tag[data-kind="see"]{background: #ecfeff;color: #155e75;}
.hg-tag[data-kind="in"]{background: var(--hg-green-soft);color: var(--hg-green);}
.hg-tag[data-kind="table"]{background: #f5f3ff;color: #5b21b6;}
.hg-tag[data-kind="build"]{background: #fdf4ff;color: #86198f;}
.hg-tag[data-kind="text"]{background: #f1f5f9;color: #334155;}
.hg-tag[data-kind="write"]{background: #fffbeb;color: #92400e;}
.hg-note{font-size: 0.9rem;color: var(--hg-muted);line-height: 1.5;}
.hg-empty{padding: 1rem;color: var(--hg-muted);font-style: italic;}
.hg-faq details{background: var(--hg-sheet);border: 1px solid var(--hg-line);border-radius: 10px;margin-bottom: 0.6rem;}
.hg-faq summary{cursor: pointer;font-weight: 700;padding: 0.95rem 1.1rem;list-style: none;position: relative;padding-right: 2.5rem;}
.hg-faq summary::-webkit-details-marker{display: none;}
.hg-faq summary::after{content: "+";position: absolute;right: 1.1rem;top: 50%;transform: translateY(-50%);font-family: var(--hg-mono);font-size: 1.2rem;color: var(--hg-tag);}
.hg-faq details[open] summary::after{content: "−";}
.hg-faq details p{padding: 0 1.1rem 1rem;margin: 0;}
.hg-exit{border-bottom: 0;}
.hg-out{display: flex;flex-wrap: wrap;gap: 0.55rem;margin-top: 1rem;}
.hg-out a{padding: 0.5rem 0.9rem;border: 1px solid var(--hg-line);border-radius: 8px;background: var(--hg-sheet);font-size: 0.9rem;text-decoration: none;}
.hg-page .hg-out a.hg-out-main{background: var(--hg-tag);border-color: var(--hg-tag);color: #fff;font-weight: 700;}
.hg-page .hg-out a.hg-out-main:hover{background: var(--hg-tag-deep);color: #fff;}
@media (max-width: 991px){.hg-hero{grid-template-columns: 1fr;}.hg-toc{position: static;}}
@media (max-width: 720px){.hg-row{grid-template-columns: 2rem 1fr;}.hg-row .hg-tag{grid-column: 2;}.hg-row .hg-note{grid-column: 2;}.hg-pipe{font-size: 0.8rem;}}
@media (prefers-reduced-motion: reduce){.hg-paste{transition: none;}.hg-paste:hover{transform: none;}}