/*
Theme Name: Sprue Tree
Description: A plain theme for a site of injection molding guides, built so that people and crawlers reach every guide in a link or two. The first page opens with a molded shot (the sprue, the runner and four parts in yellow polypropylene), then the guides the other guides link to, counted from the links inside the guides, then every guide newest first on a yellow runner, then the titles of the guides on the pages after it. A guide opens with a breadcrumb trail, its title once, its contents beside the text on wide screens and above it on a phone, a note at the end, the guides it links to and the guides that link to it, and the guides published on either side; the foot of every page links the guides the others link to, side by side. Breadcrumb, article and collection structured data. One stylesheet, no script, no web font, no image. Category, tag and author pages are not kept.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sprue-tree
*/

:root{
	--sp-sheet:#f6f7f4;--sp-plate:#eceeed;--sp-part:#fff6d6;--sp-field:#fff;
	--sp-ink:#15191d;--sp-dim:#4a525b;--sp-line:#d3d7da;--sp-steel:#7d868f;
	--sp-link:#0b56a3;--sp-resin:#f4ae00;--sp-resin-edge:#a77c00;
	--sp-sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
	--sp-mono:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;
	--sp-span:72rem;--sp-read:45rem;--sp-tap:2.75rem;
	color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
	:root{
		--sp-sheet:#111417;--sp-plate:#1a1f23;--sp-part:#2a2410;--sp-field:#161a1e;
		--sp-ink:#e8ebee;--sp-dim:#a9b2bb;--sp-line:#323a41;--sp-steel:#6f7a85;
		--sp-link:#94b4ff;--sp-resin:#e7a600;--sp-resin-edge:#ffd257;
	}
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;color:var(--sp-ink);background:var(--sp-sheet);font-family:var(--sp-sans);font-size:1.0625rem;line-height:1.65}
img,svg,video{max-width:100%;height:auto}
a{color:var(--sp-link);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--sp-link);outline-offset:2px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
.sp-jumpin:focus{position:fixed!important;top:.5rem;left:.5rem;z-index:10;width:auto;height:auto;margin:0;padding:.75rem 1rem;clip:auto;clip-path:none;background:var(--sp-ink);color:var(--sp-sheet);border-radius:.35rem}
.sp-wide{width:100%;max-width:var(--sp-span);margin-inline:auto;padding-inline:1rem}
@media (min-width:48rem){.sp-wide{padding-inline:1.5rem}}

/* The molded plastic: the shot on the first page and the mark beside the site name. */
.sp-plastic{fill:var(--sp-resin);stroke:var(--sp-resin-edge);stroke-width:1.2;stroke-linejoin:round}
.sp-hole{fill:var(--sp-sheet);stroke:var(--sp-resin-edge);stroke-width:1.2}
.sp-grip{fill:none;stroke:var(--sp-resin-edge);stroke-width:2;stroke-linecap:round}

/* Top bar: the site name, the menu, the search box. */
.sp-bar{border-bottom:1px solid var(--sp-line)}
.sp-bar-in{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.25rem;padding-block:.6rem}
.sp-name{display:inline-flex;align-items:center;gap:.6rem;min-height:var(--sp-tap);color:var(--sp-ink);font-weight:750;font-size:1.1rem;line-height:1.2;text-decoration:none}
.sp-mark{flex:0 0 auto;width:2.2rem}
.sp-mark .sp-plastic{stroke-width:.7}
.sp-headlinks ul,.sp-footlinks ul{display:flex;flex-wrap:wrap;gap:0 1.1rem;margin:0;padding:0;list-style:none}
.sp-headlinks a,.sp-footlinks a{display:inline-flex;align-items:center;min-height:var(--sp-tap)}
.sp-hopper{display:flex;flex:1 1 100%;min-width:0}
@media (min-width:44rem){.sp-hopper{flex:0 1 24rem;margin-left:auto}}
.sp-hopper-field{flex:1 1 auto;min-width:0;min-height:var(--sp-tap);padding:0 .8rem;color:var(--sp-ink);background:var(--sp-field);border:1px solid var(--sp-steel);border-right:0;border-radius:.35rem 0 0 .35rem;font:inherit}
.sp-hopper-go{flex:0 0 auto;min-height:var(--sp-tap);padding:0 1.05rem;color:var(--sp-sheet);background:var(--sp-ink);border:1px solid var(--sp-ink);border-radius:0 .35rem .35rem 0;font:inherit;font-weight:700;cursor:pointer}

/* First page: the shot, above a dashed parting line. */
.sp-shot{display:grid;gap:1.75rem;padding:2.5rem 0 2.25rem;border-bottom:1px dashed var(--sp-steel)}
@media (min-width:52rem){.sp-shot{grid-template-columns:minmax(0,1fr) 22rem;align-items:center;gap:3rem}}
.sp-headline{margin:0 0 .8rem;font-size:clamp(2rem,5.2vw,3.15rem);font-weight:800;line-height:1.07;letter-spacing:-.02em}
.sp-standfirst{max-width:38rem;margin:0;color:var(--sp-dim);font-size:1.15rem}
.sp-jumps{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.4rem 0 0;padding:0;list-style:none}
.sp-jump{display:inline-flex;align-items:center;min-height:var(--sp-tap);padding:.45rem 1rem;color:var(--sp-ink);border:1px solid var(--sp-ink);border-radius:999px;font-weight:650;line-height:1.25;text-decoration:none}
.sp-jump:hover{background:var(--sp-ink);color:var(--sp-sheet)}
.sp-tree{display:block;width:100%;max-width:19rem;justify-self:center}
@media (min-width:52rem){.sp-tree{max-width:22rem}}

.sp-head2{margin:2.75rem 0 .45rem;font-size:1.45rem;font-weight:750;line-height:1.2;letter-spacing:-.01em}
.sp-note{max-width:var(--sp-read);margin:0 0 1.3rem;color:var(--sp-dim);font-size:.98rem}
.sp-none{color:var(--sp-dim)}
.sp-subject{font-weight:700}
.sp-angle{font-weight:400;color:var(--sp-dim)}

/* The guides the others link to: parts hanging from a runner, one yellow pellet for each guide that links here. */
.sp-gates{display:grid;grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:2.4rem 1rem;margin:0;padding:1.4rem 0 0;list-style:none}
.sp-gate{position:relative;display:flex;flex-direction:column;gap:.55rem;padding:1rem 1rem 1.05rem;background:var(--sp-part);border:1.5px solid var(--sp-resin-edge);border-radius:.55rem}
.sp-gate::before{content:"";position:absolute;left:-.5rem;right:-.5rem;top:-1.35rem;height:.45rem;background:var(--sp-resin);border:1px solid var(--sp-resin-edge);border-radius:999px}
.sp-gate::after{content:"";position:absolute;left:50%;top:-.95rem;width:.6rem;height:.95rem;transform:translateX(-50%);background:var(--sp-resin-edge);clip-path:polygon(15% 0,85% 0,62% 100%,38% 100%)}
.sp-gate-name{margin:0;font-size:1.04rem;line-height:1.32}
.sp-gate-name a{display:block;min-height:var(--sp-tap);color:var(--sp-ink);text-decoration:none}
.sp-gate-name a:hover{text-decoration:underline}
.sp-pellets{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:auto}
.sp-pellet{width:.7rem;height:.52rem;background:var(--sp-resin);border:1px solid var(--sp-resin-edge);border-radius:50%}
.sp-gate-count{margin:0;color:var(--sp-dim);font-family:var(--sp-mono);font-size:.84rem}

/* Every guide: one yellow runner down the list, a branch to each title; two runners side by side on a wide screen. */
.sp-runner{margin:0;padding:0;list-style:none}
@media (min-width:64rem){.sp-runner{columns:2;column-gap:3rem}}
.sp-cavity{position:relative;break-inside:avoid;padding:.8rem 0 .95rem 2.2rem;background:linear-gradient(var(--sp-line),var(--sp-line)) 2.2rem 100%/calc(100% - 2.2rem) 1px no-repeat}
.sp-cavity::before{content:"";position:absolute;left:.55rem;top:0;bottom:0;width:.5rem;background:var(--sp-resin);border-inline:1px solid var(--sp-resin-edge)}
.sp-cavity::after{content:"";position:absolute;left:1.05rem;top:1.55rem;width:.95rem;height:.34rem;background:var(--sp-resin);border-block:1px solid var(--sp-resin-edge)}
.sp-cavity-name{margin:0;font-size:1.1rem;line-height:1.35}
.sp-cavity-name a{display:block;min-height:var(--sp-tap);padding-top:.35rem;color:var(--sp-ink);text-decoration:none}
.sp-cavity-name a:hover .sp-subject{text-decoration:underline}
.sp-cavity-meta{display:flex;flex-wrap:wrap;gap:.15rem .9rem;margin:.15rem 0 0;color:var(--sp-dim);font-family:var(--sp-mono);font-size:.82rem}

.pagination{margin:1.75rem 0 0}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:.45rem}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sp-tap);min-height:var(--sp-tap);padding:0 .8rem;color:var(--sp-ink);background:var(--sp-field);border:1px solid var(--sp-line);border-radius:.35rem;text-decoration:none}
.pagination .page-numbers.current{color:var(--sp-sheet);background:var(--sp-ink);border-color:var(--sp-ink)}
.pagination .page-numbers.dots{background:none;border:0}

/* The titles of the guides on the pages after the first, so every guide is one link from here. */
.sp-backlog-list{margin:0;padding:0;list-style:none}
@media (min-width:40rem){.sp-backlog-list{columns:2;column-gap:2.5rem}}
@media (min-width:64rem){.sp-backlog-list{columns:3}}
.sp-backlog-list li{break-inside:avoid;border-bottom:1px solid var(--sp-line)}
.sp-backlog-list a{display:block;min-height:var(--sp-tap);padding:.6rem 0;line-height:1.35}

/* One guide. */
.sp-piece{padding-top:.75rem}
.sp-flowpath-steps{display:flex;flex-wrap:wrap;gap:0 .45rem;margin:0;padding:0;list-style:none;font-size:.93rem}
.sp-flowpath-steps li+li::before{content:"/";margin-right:.45rem;color:var(--sp-steel)}
.sp-flowpath-steps a{display:inline-flex;align-items:center;min-height:var(--sp-tap)}
.sp-piece-top{margin:0 0 1.75rem;padding:0 0 1.4rem;border-bottom:1px dashed var(--sp-steel)}
.sp-piece-name{max-width:52rem;margin:.35rem 0 .7rem;font-size:clamp(1.9rem,4.6vw,2.85rem);font-weight:800;line-height:1.1;letter-spacing:-.02em}
.sp-piece-name .sp-subject{font-weight:800}
.sp-piece-name .sp-angle{display:block;margin-top:.4rem;font-size:.55em;font-weight:500;line-height:1.3;letter-spacing:0}
.sp-piece-when{display:flex;flex-wrap:wrap;gap:0 1rem;margin:0;color:var(--sp-dim);font-family:var(--sp-mono);font-size:.85rem}
.sp-piece-grid{display:grid;gap:2rem}
@media (min-width:64rem){.sp-piece-grid-rail{grid-template-columns:15.5rem minmax(0,var(--sp-read));gap:3.5rem}}
.sp-piece-main{min-width:0;max-width:var(--sp-read)}
.sp-onpage{align-self:start;padding:.9rem 1rem 1rem;background:var(--sp-plate);border-left:.4rem solid var(--sp-resin);border-radius:0 .45rem .45rem 0}
@media (min-width:64rem){.sp-onpage{position:sticky;top:1rem;max-height:calc(100vh - 2rem);overflow-y:auto}}
.sp-onpage-title{margin:0 0 .3rem;color:var(--sp-dim);font-family:var(--sp-mono);font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.sp-onpage-list{margin:0;padding:0;list-style:none;counter-reset:sp-part}
.sp-onpage-list li{counter-increment:sp-part}
.sp-onpage-list a{display:grid;grid-template-columns:1.9rem minmax(0,1fr);align-items:center;min-height:var(--sp-tap);padding:.25rem 0;color:var(--sp-ink);font-size:.95rem;line-height:1.3;text-decoration:none}
.sp-onpage-list a::before{content:counter(sp-part,decimal-leading-zero);color:var(--sp-dim);font-family:var(--sp-mono);font-size:.8rem}
.sp-onpage-list a:hover{color:var(--sp-link);text-decoration:underline}
.sp-onpage-more{margin:.45rem 0 0;padding-top:.35rem;border-top:1px solid var(--sp-line)}
.sp-onpage-more a{display:flex;align-items:center;min-height:var(--sp-tap);font-weight:650;font-size:.95rem}

.sp-piece-body{font-size:1.0625rem;line-height:1.72;overflow-wrap:break-word}
.sp-piece-body>*:first-child{margin-top:0}
.sp-piece-body h2{position:relative;margin:2.6rem 0 .75rem;padding-top:.85rem;font-size:1.5rem;line-height:1.22;letter-spacing:-.01em;scroll-margin-top:1rem}
.sp-piece-body h2::before{content:"";position:absolute;left:0;top:0;width:2.4rem;height:.3rem;background:var(--sp-resin);border-radius:999px}
.sp-piece-body h3{margin:1.9rem 0 .5rem;font-size:1.18rem;line-height:1.3;scroll-margin-top:1rem}
.sp-piece-body p,.sp-piece-body ul,.sp-piece-body ol{margin:0 0 1.1rem}
.sp-piece-body li{margin:.3rem 0}
.sp-piece-body table{display:block;max-width:100%;overflow-x:auto;margin:0 0 1.4rem;border-collapse:collapse;font-size:.94rem;line-height:1.5}
.sp-piece-body th,.sp-piece-body td{padding:.5rem .7rem;border:1px solid var(--sp-line);text-align:left;vertical-align:top}
.sp-piece-body th{background:var(--sp-plate)}
.sp-piece-body blockquote{margin:0 0 1.2rem;padding:.1rem 0 .1rem 1rem;border-left:.3rem solid var(--sp-steel);color:var(--sp-dim)}
.sp-piece-body pre{overflow-x:auto;padding:.8rem 1rem;background:var(--sp-plate);border-radius:.35rem}
.sp-piece-body .alignwide,.sp-piece-body .alignfull{max-width:none}
.sp-piece-body .aligncenter{margin-inline:auto}
.sp-piece-body .alignleft{float:left;margin:.3rem 1.25rem 1rem 0}
.sp-piece-body .alignright{float:right;margin:.3rem 0 1rem 1.25rem}
.sp-piece-body figure{margin:0 0 1.3rem}
.sp-piece-pages{margin:1rem 0}

.sp-caution{margin:2.5rem 0 0;padding:1rem 1.2rem 1.1rem;background:var(--sp-plate);border-left:.4rem solid var(--sp-steel);border-radius:0 .45rem .45rem 0;font-size:.95rem}
.sp-caution-title{margin:0 0 .4rem;font-size:1rem}
.sp-caution p{margin:0 0 .6rem}
.sp-caution p:last-child{margin:0}

/* The guides this one links to and the guides that link to it, each list hanging from its own runner. */
.sp-links-cols{display:grid;gap:1.5rem}
@media (min-width:40rem){.sp-links-cols{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:2rem}}
.sp-links-name{margin:0 0 .4rem;font-size:1rem}
.sp-links-list{margin:0;padding:0 0 0 .1rem;list-style:none;border-left:.38rem solid var(--sp-resin)}
.sp-links-list a{position:relative;display:block;min-height:var(--sp-tap);padding:.55rem 0 .55rem 1.05rem;color:var(--sp-ink);font-size:.97rem;line-height:1.35;text-decoration:none}
.sp-links-list a::before{content:"";position:absolute;left:0;top:1.1rem;width:.65rem;height:.26rem;background:var(--sp-resin)}
.sp-links-list a:hover .sp-subject{text-decoration:underline}

.sp-replies{margin-top:3rem}
.sp-replies-list{padding-left:1.2rem}
.comment-form label{display:block;margin-bottom:.25rem;font-weight:600}
.comment-form input:not([type=checkbox]):not([type=submit]),.comment-form textarea{width:100%;min-height:var(--sp-tap);padding:.5rem .7rem;color:var(--sp-ink);background:var(--sp-field);border:1px solid var(--sp-steel);border-radius:.35rem;font:inherit}
.comment-form-cookies-consent{display:flex;gap:.5rem;align-items:flex-start}
.comment-form-cookies-consent label{font-weight:400}
.comment-form-cookies-consent input{width:1.25rem;height:1.25rem;margin-top:.2rem}
.form-submit .submit{min-height:var(--sp-tap);padding:0 1.25rem;color:var(--sp-sheet);background:var(--sp-ink);border:0;border-radius:.35rem;font:inherit;font-weight:700;cursor:pointer}

.sp-sides{display:grid;gap:.75rem;margin:3rem 0 0}
@media (min-width:40rem){.sp-sides{grid-template-columns:repeat(2,minmax(0,1fr))}.sp-side-later{grid-column:2;text-align:right}}
.sp-side{display:block;min-height:var(--sp-tap);padding:.85rem 1rem;color:var(--sp-ink);border:1px solid var(--sp-line);border-radius:.45rem;line-height:1.35;text-decoration:none}
.sp-side:hover{border-color:var(--sp-ink)}
.sp-side-k{display:block;margin-bottom:.25rem;color:var(--sp-dim);font-family:var(--sp-mono);font-size:.76rem;letter-spacing:.06em;text-transform:uppercase}

/* Pages of the site and the missing address. */
.sp-leaf-in{max-width:calc(var(--sp-read) + 3rem);padding-block:2rem 1rem}
.sp-leaf-name{margin:0 0 1rem;font-size:clamp(1.8rem,4vw,2.5rem);font-weight:800;line-height:1.12;letter-spacing:-.02em}

/* The foot: below a dashed parting line, the guides the others link to, side by side. */
.sp-base{margin-top:4rem;padding:2rem 0 2.5rem;background:var(--sp-plate);border-top:1px dashed var(--sp-steel);font-size:.95rem}
.sp-feeds{margin:0 0 1.5rem;padding:0 0 1.4rem;border-bottom:1px solid var(--sp-line)}
.sp-feeds-name{margin:0 0 .7rem;font-weight:700;font-size:1.02rem}
.sp-feeds-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin:0;padding:0;list-style:none}
.sp-feeds-row>li{display:flex}
@media (min-width:48rem){.sp-feeds-row{display:flex;flex-wrap:wrap}.sp-feeds-row>li{flex:0 1 auto;min-width:0}}
.sp-feed{flex:1 1 auto;display:flex;align-items:center;min-height:var(--sp-tap);padding:.4rem .85rem;color:var(--sp-ink);background:var(--sp-part);border:1px solid var(--sp-resin-edge);border-radius:.45rem;font-weight:600;font-size:.9rem;line-height:1.25;text-decoration:none}
.sp-feed:hover{text-decoration:underline}
.sp-feed[aria-current]{color:var(--sp-sheet);background:var(--sp-ink);border-color:var(--sp-ink)}
.sp-feed-all{background:transparent;border-color:var(--sp-ink)}
.sp-base-name{margin:0;font-weight:750}
.sp-base-note{max-width:var(--sp-read);margin:.25rem 0 .5rem;color:var(--sp-dim)}
.sp-base-year{margin:.75rem 0 0;color:var(--sp-dim);font-family:var(--sp-mono);font-size:.8rem}

@media (forced-colors:active){
	.sp-jump,.sp-hopper-go,.sp-side,.sp-feed,.sp-gate{border:2px solid LinkText}
	.sp-cavity::before,.sp-cavity::after,.sp-gate::before,.sp-gate::after,.sp-links-list a::before,.sp-piece-body h2::before{background:CanvasText}
}
@media print{
	.sp-hopper,.sp-onpage,.sp-sides,.sp-replies,.sp-feeds,.sp-jumps{display:none}
	.sp-base{background:none}
}
