/*
Theme Name: Origamiyama
Theme URI: https://origamiyama.com
Author: Origamiyama
Description: The paper studio — warm washi ground, sumi ink, vermillion mountain folds, folded corners on every sheet, real diagram notation.
Version: 1.1
License: GNU General Public License v2 or later
Text Domain: origamiyama
*/

:root{
	--ground:#F3EADA;--ground2:#EBDFC9;
	--paper:#FFFDF8;--paper2:#FAF3E6;
	--ink:#33291F;--muted:#7A6B58;--faint:#A2927C;
	--rule:#DCCFB8;--hair:#E9DECA;
	--shu:#E0472E;--ai:#3E63B0;--butter:#F2B33D;
	--disp:"Zen Maru Gothic",system-ui,sans-serif;
	--serif:"Source Serif 4",Georgia,"Times New Roman",serif;
	--mono:"Space Mono",ui-monospace,Menlo,monospace;
	--c:#E0472E;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font:400 17px/1.75 var(--serif);
	background-image:radial-gradient(rgba(51,41,31,.045) 1px,transparent 1.3px),radial-gradient(rgba(51,41,31,.03) 1px,transparent 1.3px);
	background-size:11px 13px,17px 19px;background-position:0 0,6px 8px}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{max-width:1280px;margin:0 auto;padding:0 24px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;z-index:99;background:var(--ink);color:#fff;padding:10px 16px;font:700 13px var(--disp);border-radius:7px}
.skip:focus{left:8px}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--disp);font-weight:900;line-height:1.14;letter-spacing:0;margin:0;text-wrap:balance}
.eyebrow,.g-k,.card-kind,.crumbs,.rail-k,.answer-k,.jump-k,.art-kind,.foot-h,.arch-count,.kit-h small,.pack-k,.band-k,.card-meta{font-family:var(--disp);font-weight:700;font-size:13px;letter-spacing:.04em}
.fig-no,.sec-no,.step-no,.legend summary span{font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase}

/* crease rules: valley = dashed, mountain = dash-dot. The site's two signature lines. */
.crease-v,.crease-m{display:inline-block;width:44px;height:2px;vertical-align:middle;border-radius:2px}
.crease-v{background:repeating-linear-gradient(90deg,currentColor 0 7px,transparent 7px 13px)}
.crease-m{background:repeating-linear-gradient(90deg,currentColor 0 12px,transparent 12px 17px,currentColor 17px 19px,transparent 19px 24px)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;font:700 14.5px/1 var(--disp);padding:13px 20px 14px;text-decoration:none;border:none;cursor:pointer;border-radius:8px;position:relative}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-shu{background:var(--shu);color:#fff}
.btn-line{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn:hover{transform:translateY(-1px)}
.btn-sm{padding:10px 14px 11px;font-size:13.5px}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}

.kami-strip{height:6px}

/* ---------- masthead ---------- */
.masthead{background:var(--paper);border-bottom:1px solid var(--rule)}
.mast-row{display:flex;align-items:center;gap:20px;padding:14px 24px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.brand-word{font:900 25px/1 var(--disp);letter-spacing:.01em}
.brand-word em{font-style:normal;color:var(--shu)}
.mast-search{flex:1;max-width:400px;margin-left:auto}
.mast-search input{width:100%;border:1.5px solid var(--rule);background:var(--paper2);padding:11px 16px;font:400 15px var(--serif);color:var(--ink);border-radius:999px}
.mast-search input:focus{outline:none;border-color:var(--ai)}
.mast-pin{flex:none}
.menu-btn{display:none;align-items:center;gap:8px;background:none;border:1.5px solid var(--ink);border-radius:8px;padding:10px 14px;font:700 13px var(--disp);color:var(--ink);cursor:pointer}
.menu-btn span{width:16px;height:2px;border-radius:2px;background:var(--ink);box-shadow:0 5px 0 var(--ink),0 -5px 0 var(--ink)}
.site-nav{background:var(--paper);border-bottom:1px solid var(--rule)}
.nav-list{list-style:none;margin:0;padding:8px 0;display:flex;flex-wrap:wrap;gap:2px 2px}
.nav-list a{display:inline-flex;align-items:center;gap:8px;font:700 13px/1 var(--disp);padding:9px 10px;color:var(--muted);text-decoration:none;border-radius:7px}
.nav-list a i{width:10px;height:10px;border-radius:2px;background:var(--c,var(--shu));transform:rotate(45deg);flex:none}
.nav-list a:hover{color:var(--ink);background:var(--paper2)}

/* ---------- folded corner ---------- */
.fold{position:relative}
.fold::after{content:"";position:absolute;top:0;right:0;width:26px;height:26px;transition:width .15s,height .15s;
	background:linear-gradient(225deg,var(--cut,var(--ground)) 0 48.5%,rgba(51,41,31,.28) 48.5% 51.5%,var(--flap,#F0E6D2) 51.5% 100%)}

/* ---------- hero ---------- */
.hero-dark{background:var(--ink);color:#F3EADA;border-bottom:none;position:relative;overflow:hidden;
	background-image:radial-gradient(rgba(243,234,218,.05) 1px,transparent 1.3px);background-size:13px 15px}
.hero-row{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:48px;align-items:center;padding-top:72px;padding-bottom:64px;position:relative}
.eyebrow{color:#CBBFA9;margin:0 0 18px;display:flex;align-items:center;gap:12px}
.eyebrow .crease-m{color:var(--butter)}
.hero-h{font-size:clamp(42px,5.4vw,74px);font-weight:900;color:#FFFDF8}
.hero-h em{font-style:normal;color:inherit}
.hero-dek{font-size:19px;line-height:1.7;color:#CBBFA9;max-width:50ch;margin:22px 0 30px}
.btn-paper{background:transparent;color:#F3EADA;box-shadow:inset 0 0 0 1.5px #F3EADA}
.btn-paper:hover{background:rgba(243,234,218,.1)}
.hero-note{margin:30px 0 0;font:700 13px/1.8 var(--disp);letter-spacing:.03em;color:#9A8C76;display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.hero-note span{display:inline-flex;align-items:center;gap:9px}
.hero-note .crease-v{color:#9DB8E8}.hero-note .crease-m{color:#FF9B82}
.hero-art{min-width:0}
.crane-big{width:100%;max-width:580px;height:auto;display:block;margin:0 auto}
/* the shelf: three plates pinned up on the dark wall */
.hero-shelf{position:relative;min-height:470px;display:flex;align-items:center;justify-content:center;min-width:0}
.hero-dark .plate{--cut:var(--ink);--flap:#E3D7C0;color:var(--ink)}
.shelf-lead .plate-cap{flex-direction:column;gap:5px;padding:12px 4px 4px}
.shelf-lead{display:block;width:min(100%,350px);transform:rotate(-1.4deg);z-index:2;text-decoration:none;box-shadow:0 26px 54px -26px rgba(0,0,0,.75)}
.shelf-lead:hover{transform:rotate(-.4deg)}
.shelf-mini{position:absolute;width:186px;padding:10px;background:var(--paper);border-radius:10px;box-shadow:0 18px 40px -22px rgba(0,0,0,.7);z-index:1}
.shelf-mini img{border-radius:5px;width:100%;height:auto}
.shelf-m1{left:-4px;top:-6px;transform:rotate(5deg)}
.shelf-m2{right:-6px;bottom:-2px;transform:rotate(-6deg)}
.shelf-mini:hover{z-index:3}
.kd{position:absolute;border-radius:3px;transform:rotate(45deg)}
.kd1{width:22px;height:22px;background:#3FA7DC;left:8%;bottom:14%}
.kd2{width:14px;height:14px;background:#F2B33D;left:20%;top:6%}
.kd3{width:17px;height:17px;background:#27A295;right:4%;top:30%}
@media(prefers-reduced-motion:no-preference){
.kd1{animation:kfloat 8s ease-in-out infinite alternate}
.kd2{animation:kfloat 10s ease-in-out 1.2s infinite alternate}
.kd3{animation:kfloat 9s ease-in-out .6s infinite alternate}
}
@media(prefers-reduced-motion:no-preference){
	.kami-floats .fl1{animation:kfloat 7s ease-in-out infinite alternate}
	.kami-floats .fl2{animation:kfloat 9s ease-in-out 1s infinite alternate}
	.kami-floats .fl3{animation:kfloat 8s ease-in-out .5s infinite alternate}
	.kami-floats .fl4{animation:kfloat 10s ease-in-out 1.6s infinite alternate}
	@keyframes kfloat{from{translate:0 0}to{translate:0 14px}}
}

/* the featured plate: a photo mounted in a diagram book */
.plate{background:var(--paper);border:1px solid var(--rule);border-radius:10px;padding:14px}
.plate img{width:100%;border-radius:5px}
.hero-plate{display:block;text-decoration:none;max-width:460px;justify-self:end;transform:rotate(-1.2deg);box-shadow:0 20px 44px -24px rgba(51,41,31,.5)}
.plate-cap{display:flex;gap:12px;align-items:baseline;padding:12px 2px 2px}
.fig-no{color:var(--shu);flex:none}
.plate-cap b{font:700 16px/1.4 var(--disp)}

/* ---------- band headings ---------- */
.band-h{display:flex;align-items:center;gap:20px;font-size:clamp(25px,3vw,34px);font-weight:900;margin:0 0 10px}
.band-h::after{content:"";flex:1;height:2px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--shu) 0 12px,transparent 12px 17px,var(--shu) 17px 19px,transparent 19px 24px);opacity:.3}
.band-k{color:var(--shu);display:block;margin:0 0 8px}
.sec{padding:64px 0 10px}
.more-link{font:700 14px/1 var(--disp);white-space:nowrap;text-decoration:none;color:var(--ai)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px}

/* ---------- the paper pack: real sheets of colored paper ---------- */
.pack-grid{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.pack-grid li{min-width:0}
.pack-tile{display:flex;flex-direction:column;gap:7px;background:var(--c);color:#FFFDF8;border-radius:6px;padding:20px 20px 16px;min-height:168px;text-decoration:none;height:100%;--cut:var(--ground);--flap:#FFFDF8;overflow:hidden;box-shadow:0 10px 24px -16px rgba(51,41,31,.55);transition:transform .18s,box-shadow .18s}
.pack-tile::after{width:34px;height:34px}
.pack-tile.t1{transform:rotate(-.7deg)}.pack-tile.t2{transform:rotate(.6deg)}.pack-tile.t3{transform:rotate(-.4deg)}.pack-tile.t0{transform:rotate(.8deg)}
.pack-tile:hover{transform:rotate(0deg) translateY(-3px);box-shadow:0 16px 30px -16px rgba(51,41,31,.65)}
.pack-tile:hover::after{width:48px;height:48px}
.pack-ink{color:var(--ink)}
.pack-name{font:900 18px/1.2 var(--disp)}
.pack-desc{font:400 13.5px/1.55 var(--serif);opacity:.92;flex:1}
.pack-go{font:900 17px/1 var(--disp);align-self:flex-end;opacity:.85}

/* ---------- cards ---------- */
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
.card-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--paper);border:1px solid var(--rule);border-radius:10px;display:flex;flex-direction:column;min-width:0;position:relative;overflow:hidden}
.card::after{content:"";position:absolute;top:0;right:0;width:22px;height:22px;z-index:2;transition:width .15s,height .15s;
	background:linear-gradient(225deg,var(--ground) 0 48.5%,rgba(51,41,31,.28) 48.5% 51.5%,#F0E6D2 51.5% 100%)}
.card:hover::after{width:34px;height:34px}
.card:hover{border-color:var(--c)}
.card-img{position:relative;aspect-ratio:1/1;overflow:hidden;border-bottom:1px solid var(--hair)}
.card-img img,.thumb-empty{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.thumb-empty{display:grid;place-items:center;background:var(--paper2)}
.card-cat{position:absolute;left:0;bottom:0;display:inline-flex;align-items:center;gap:7px;font:700 12px/1 var(--disp);letter-spacing:.02em;padding:8px 11px;background:var(--paper);color:var(--ink);text-decoration:none;border-top-right-radius:9px;border-top:1px solid var(--hair);border-right:1px solid var(--hair);max-width:calc(100% - 40px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-cat::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--c);transform:rotate(45deg);flex:none}
.pin-mini{position:absolute;right:10px;top:36px;width:34px;height:34px;display:grid;place-items:center;background:var(--shu);color:#fff;z-index:1;border-radius:8px}
.pin-mini svg{width:16px;height:16px}
.card-body{padding:15px 18px 17px}
.card-kind{color:var(--shu);margin:0 0 7px;font-size:12.5px}
.card-kind b{color:var(--muted);font-weight:700}
.card-title{font-size:19px;line-height:1.3;margin:0;font-weight:900}
.card-title a{text-decoration:none}
.card-title a:hover{color:var(--ai)}
.card-meta{color:var(--faint);margin:8px 0 0;font-size:12.5px}

/* ---------- the diagrams showcase ---------- */
.atlas-sheet{background:var(--paper);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-top:72px}
.atlas-row{display:grid;grid-template-columns:minmax(0,.74fr) minmax(0,1.26fr);gap:56px;align-items:center;padding-top:72px;padding-bottom:72px}
.atlas-copy h2{font-size:clamp(26px,3.2vw,38px);margin:0 0 14px}
.atlas-copy p{color:var(--muted);max-width:50ch}
.atlas-copy .btn{margin-top:10px}
.legend-line{display:flex;gap:24px;flex-wrap:wrap;font:700 13px var(--disp);color:var(--faint);margin:18px 0 20px}
.legend-line span{display:inline-flex;align-items:center;gap:9px}
.legend-line .crease-v{color:var(--ai)}.legend-line .crease-m{color:var(--shu)}
.atlas-plates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:center}
.atlas-plates .plate{padding:10px;--cut:var(--paper);--flap:#EDE2CC}
.atlas-plates .plate svg{width:100%;height:auto;display:block}
.atlas-plates .plate-cap{padding:8px 2px 0}
.atlas-plates .p1{transform:rotate(-1.6deg)}
.atlas-plates .p2{transform:rotate(.9deg) translateY(18px)}
.atlas-plates .p3{transform:rotate(-.6deg)}

/* ---------- meaning strip ---------- */
.mean-row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start;background:var(--paper);border:1px solid var(--rule);border-left:6px solid var(--c);border-radius:12px;padding:40px;margin-top:72px;--flap:#F0E6D2;overflow:hidden}
.mean-intro h2{font-size:clamp(24px,3vw,34px)}
.mean-kanji{font:400 100px/1 var(--serif);color:var(--c,#B5468E);margin:6px 0 0}
.mean-list{list-style:none;margin:0;padding:0;counter-reset:mn}
.mean-list li{counter-increment:mn;border-top:1px dashed var(--rule)}
.mean-list li:first-child{border-top:none}
.mean-list a{display:flex;gap:16px;align-items:baseline;padding:13px 2px;text-decoration:none;font:700 17px/1.4 var(--disp)}
.mean-list a::before{content:counter(mn,decimal-leading-zero);font:700 12px var(--mono);color:var(--shu)}
.mean-list a:hover{color:var(--ai)}

/* ---------- article ---------- */
.art-head{border-bottom:1px solid var(--rule);background:var(--paper2);position:relative;overflow:hidden}
.art-head .cp{position:absolute;right:-90px;bottom:-110px;color:var(--faint);opacity:.3;transform:rotate(8deg)}
.art-head-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:52px;align-items:center;padding-top:44px;padding-bottom:52px;position:relative}
.crumbs{color:var(--faint);margin:0 0 16px;font-weight:700}
.crumbs a{text-decoration:none}
.crumbs span{margin:0 6px;color:var(--rule)}
.art-kind{display:inline-flex;align-items:center;gap:9px;color:var(--shu);margin:0 0 12px}
.art-kind i{width:10px;height:10px;border-radius:2px;background:var(--c);transform:rotate(45deg)}
.art-h{font-size:clamp(30px,4vw,48px);font-weight:900}
.art-dek{font-size:18px;line-height:1.65;color:var(--muted);margin:16px 0 0;max-width:58ch}
.glance{list-style:none;display:flex;flex-wrap:wrap;margin:24px 0 0;padding:0;border:1px solid var(--rule);border-radius:10px;background:var(--paper);overflow:hidden}
.glance li{padding:12px 18px;border-right:1px dashed var(--rule);min-width:0}
.glance li:last-child{border-right:none}
.g-k{display:block;color:var(--faint);margin-bottom:2px;font-size:12px}
.g-v{font:700 15.5px/1.3 var(--disp)}
.art-head .btn-row{margin:26px 0 0}
.art-hero{margin:0;justify-self:end;max-width:440px;width:100%;transform:rotate(1deg);box-shadow:0 20px 44px -24px rgba(51,41,31,.5);position:relative}
.art-hero .pin-save{position:absolute;right:22px;top:22px}
.pin-save{display:inline-flex;align-items:center;gap:7px;background:var(--shu);color:#fff;font:700 13px/1 var(--disp);letter-spacing:.02em;padding:9px 13px;border-radius:8px;text-decoration:none}

.sheet{background:var(--paper);border-bottom:1px solid var(--rule)}
.art-body{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;padding-top:52px;padding-bottom:64px}
.entry{min-width:0;max-width:700px}
.entry>p,.entry li{font-size:17px}
.entry .intro>p:first-child{font-size:19px;line-height:1.7}
.entry h2{font-size:26px;margin:46px 0 16px;display:flex;align-items:center;gap:14px}
.oy-sec>h2::after,.part>h2::after{content:"";flex:1;height:2px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--rule) 0 7px,transparent 7px 13px)}
.entry h3{font-size:19px;margin:30px 0 10px}
.entry a{color:var(--ai);text-decoration-color:rgba(62,99,176,.4)}
.entry blockquote{margin:28px 0;padding:4px 0 4px 22px;border-left:3px solid var(--shu);font-style:italic;color:var(--muted)}
.entry table{width:100%;border-collapse:collapse;margin:24px 0;font-size:15px;line-height:1.5}
.entry th,.entry td{border:1px solid var(--hair);padding:10px 12px;text-align:left}
.entry th{background:var(--paper2);font:700 13px/1.4 var(--disp);letter-spacing:.02em}
.entry code{font:400 .88em var(--mono);background:var(--paper2);padding:1px 6px;border-radius:4px}
.entry ul{padding-left:22px}
.entry ul li{margin:7px 0}
.entry ul li::marker{color:var(--shu)}

/* fold steps: diamonds on a dashed crease */
.oy-steps{list-style:none;counter-reset:st;margin:26px 0;padding:0;position:relative}
.oy-steps::before{content:"";position:absolute;left:21px;top:22px;bottom:22px;border-left:2px dashed var(--rule)}
.oy-steps>li{counter-increment:st;position:relative;margin:0 0 18px;padding:14px 18px 14px 66px;background:var(--paper2);border:1px solid var(--hair);border-radius:10px}
.oy-steps>li:last-child{margin-bottom:0}
.oy-steps>li::before{content:"";position:absolute;left:8px;top:15px;width:27px;height:27px;background:var(--paper);border:2px solid var(--ink);border-radius:5px;transform:rotate(45deg)}
.oy-steps>li::after{content:counter(st,decimal-leading-zero);position:absolute;left:8px;top:21px;width:27px;text-align:center;font:700 11px/1.4 var(--mono)}

/* kit card */
.kit{background:var(--paper2);border:1px solid var(--rule);border-radius:10px;padding:22px 26px;margin:30px 0;position:relative;--cut:var(--paper);--flap:#EDE2CC;overflow:hidden}
.kit-h{font-size:20px;margin:0 0 6px;display:flex;align-items:baseline;gap:12px}
.kit-h small{color:var(--faint);font-size:13px}
.kit ul{list-style:none;margin:10px 0 0;padding:0}
.kit li{position:relative;padding:7px 0 7px 30px;border-top:1px dashed var(--hair);font-size:16px}
.kit li:first-child{border-top:none}
.kit li::before{content:"";position:absolute;left:2px;top:14px;width:12px;height:12px;border:2px solid var(--ink);border-radius:3px;background:var(--paper)}

/* legend */
.legend{border:1px solid var(--rule);border-radius:10px;background:var(--paper);margin:30px 0;overflow:hidden}
.legend summary{cursor:pointer;padding:14px 18px;display:flex;gap:12px;align-items:baseline;color:var(--ink);font:700 16px var(--disp)}
.legend summary span{color:var(--faint);font-weight:400}
.legend dl{margin:0;padding:4px 18px 16px;display:grid;gap:10px}
.legend dl div{display:flex;gap:16px;align-items:center;border-top:1px dashed var(--hair);padding-top:10px}
.legend dt{flex:none;width:52px;color:var(--ink);display:grid;place-items:center}
.legend dt .crease-v{color:var(--ai)}.legend dt .crease-m{color:var(--shu)}
.legend dd{margin:0;font-size:15px;line-height:1.55}
.legend dd b{font-family:var(--disp)}
.legend dd span[lang]{color:var(--muted);margin-left:4px}

/* tutorial parts & numbered figures */
.part{margin-top:8px}
.sec-no,.step-no{color:var(--shu)}
.tut-start{border:1.5px solid var(--ink);border-radius:10px;padding:20px 24px;margin:34px 0;background:var(--paper);position:relative;--flap:#F0E6D2;overflow:hidden}
.tut-start .pack-k{color:var(--shu);display:block;margin-bottom:6px}
.tut-start p{margin:6px 0 0;font-size:15.5px;color:var(--muted)}

/* in-body plates */
figure.pin{margin:30px 0;position:relative}
figure.pin img{width:100%}
figure.pin .pin-save{position:absolute;right:26px;top:26px}
figure.pin figcaption{display:flex;gap:12px;align-items:baseline;padding:11px 2px 0;font-size:13.5px;line-height:1.5;color:var(--muted)}
figure.pin svg{width:100%;height:auto;background:var(--paper)}

/* diagram grids */
.diag-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:26px 0}
.diag-grid figure.pin{margin:0}
.diag-grid figcaption{font-size:13px}
@media(max-width:620px){.diag-grid{grid-template-columns:minmax(0,1fr)}}

/* answer / symbol boxes */
.answer{background:var(--paper2);border:1px solid var(--rule);border-left:4px solid var(--shu);border-radius:0 10px 10px 0;padding:20px 24px;margin:0 0 30px;position:relative;--cut:var(--paper);--flap:#EDE2CC;overflow:hidden}
.answer-k{color:var(--shu);display:block;margin-bottom:4px}
.answer p{margin:0;font-size:18px;line-height:1.6}
.symbol{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center;background:var(--paper2);border:1px solid var(--rule);border-radius:10px;padding:22px 26px;margin:0 0 30px;--cut:var(--paper);--flap:#EDE2CC;overflow:hidden}
.symbol-kanji{font:400 72px/1 var(--serif);color:var(--c)}
.symbol-copy .answer-k{color:var(--c)}
.symbol-copy p{margin:4px 0 0;font-size:16.5px}

/* roundup ideas */
.jump{border:1px solid var(--rule);border-radius:10px;background:var(--paper2);padding:18px 22px;margin:28px 0;--cut:var(--paper);--flap:#EDE2CC;overflow:hidden}
.jump-k{color:var(--shu);display:block;margin-bottom:8px}
.jump ol{margin:0;padding:0;list-style:none;columns:2;column-gap:28px}
.jump li{margin:5px 0;break-inside:avoid}
.jump a{text-decoration:none;font:700 14.5px/1.5 var(--disp)}
.jump a:hover{color:var(--ai)}
.idea{position:relative;margin-top:14px}
.idea-no{float:right;font:700 52px/1 var(--mono);color:transparent;-webkit-text-stroke:1.5px var(--c);margin:40px 0 8px 18px}
.idea h2{clear:none}

/* rail */
.rail{min-width:0}
.rail-box{border:1px solid var(--rule);border-radius:10px;background:var(--paper2);padding:20px 22px;margin-bottom:20px;position:relative;--cut:var(--paper);--flap:#EDE2CC;overflow:hidden}
.rail-k{display:block;color:var(--faint);margin-bottom:10px}
.toc ol{margin:0;padding:0;list-style:none;counter-reset:tc}
.toc li{counter-increment:tc;border-top:1px dashed var(--hair)}
.toc li:first-child{border-top:none}
.toc a{display:flex;gap:10px;padding:9px 0;text-decoration:none;font:700 14px/1.45 var(--disp)}
.toc a::before{content:counter(tc,decimal-leading-zero);font:700 11px/1.7 var(--mono);color:var(--shu)}
.toc a:hover{color:var(--ai)}
.rail-save p{margin:0 0 14px;font-size:15px}
.rail-save .oy-mark{margin-bottom:10px}
.rail-cat{display:flex;align-items:center;gap:14px;text-decoration:none;font-size:15px}
.rail-cat:hover{border-color:var(--c)}
@media(min-width:1101px){.rail-sticky{position:sticky;top:20px}}

/* related */
.related{padding:56px 0 72px}

/* ---------- archive ---------- */
.arch-head{border-bottom:1px solid var(--rule);background:var(--paper2);position:relative;overflow:hidden}
.arch-head::before{content:"";position:absolute;right:-120px;top:-180px;width:420px;height:420px;border-radius:40px;background:var(--c,var(--butter));opacity:.12;transform:rotate(45deg)}
.arch-row{display:flex;gap:28px;align-items:center;padding-top:44px;padding-bottom:44px;position:relative}
.arch-h{font-size:clamp(30px,4vw,46px);font-weight:900}
.arch-dek{color:var(--muted);margin:12px 0 0;max-width:60ch;font-size:17px}
.arch-count{color:var(--faint);margin:10px 0 0}
.arch-body{padding-bottom:72px}
.pager{display:flex;gap:8px;justify-content:center;margin-top:44px}
.pager .page-numbers{font:700 13.5px/1 var(--disp);padding:12px 15px;border:1.5px solid var(--rule);border-radius:8px;color:var(--ink);text-decoration:none;background:var(--paper)}
.pager .current,.pager a:hover{border-color:var(--ink)}
.empty{text-align:center;padding:40px 0;color:var(--muted)}

/* ---------- pages ---------- */
.pg-head{padding-top:44px;padding-bottom:28px}
.pg-body{padding-top:48px;padding-bottom:64px}
.pg-body .entry{max-width:760px;margin:0 auto}

/* ---------- 404 ---------- */
.notfound{text-align:center;padding:90px 24px}
.notfound p{color:var(--muted);max-width:46ch;margin:16px auto 34px}
.pack-grid-sm{grid-template-columns:repeat(4,minmax(0,1fr));text-align:left}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:#CBBFA9;margin-top:0}
.foot a{color:#F7F0E2}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr .8fr;gap:48px;padding-top:56px;padding-bottom:40px}
.foot-brand p{font-size:15px;line-height:1.7;margin:16px 0 0;max-width:46ch}
.foot .brand-word{color:#F7F0E2}
.foot-mail a{color:var(--butter);text-decoration-color:rgba(242,179,61,.4)}
.foot-h{color:#9A8C76;margin:0 0 14px;font-size:14px}
.foot-cats ul,.foot-links{list-style:none;margin:0;padding:0}
.foot-cats li{margin:7px 0}
.foot-cats a{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:700 14.5px/1.5 var(--disp)}
.foot-cats a i{width:9px;height:9px;border-radius:2px;background:var(--c);transform:rotate(45deg);flex:none}
.foot-cats a:hover{color:var(--butter)}
.foot-links li{margin:9px 0}
.foot-links a{text-decoration:none;font-size:15px}
.foot-links a:hover{color:var(--butter)}
.foot-base{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:20px;padding-bottom:36px;border-top:1px solid #4A3E30;font:700 12.5px/1.7 var(--disp);letter-spacing:.03em;color:#9A8C76}
.foot-base span:last-child{display:inline-flex;gap:22px;flex-wrap:wrap}
.foot-base span:last-child span{display:inline-flex;align-items:center;gap:8px}
.foot-base .crease-v{color:#9DB8E8}.foot-base .crease-m{color:#FF9B82}

/* ---------- responsive ---------- */
@media(max-width:1100px){
	.card-grid,.card-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
	.pack-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.atlas-row{grid-template-columns:minmax(0,1fr)}
	.art-body{grid-template-columns:minmax(0,1fr)}
	.rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
}
@media(max-width:860px){
	.art-head .cp{opacity:.12}
	.hero-row,.art-head-row,.mean-row{grid-template-columns:minmax(0,1fr)}
	.hero-row{padding-top:52px;padding-bottom:40px}
	.crane-big{max-width:440px}
	.hero-shelf{min-height:0;margin-top:34px;padding:0 10px}
	.shelf-lead{width:min(100%,320px)}
	.shelf-mini{width:140px}
	.shelf-m1{left:-2px;top:-26px}
	.shelf-m2{right:-2px;bottom:-22px}
	.art-hero{justify-self:start;max-width:420px}
	.mast-search{display:none}
	.menu-btn{display:inline-flex}
	.site-nav{display:none}
	.site-nav.open{display:block}
	.nav-list{flex-direction:column;gap:0;padding:10px 0}
	.nav-list a{padding:11px 6px;font-size:15px}
	.atlas-plates{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
	.foot-grid{grid-template-columns:1fr;gap:36px}
}
@media(max-width:620px){
	.card-grid,.card-grid-4,.pack-grid,.pack-grid-sm{grid-template-columns:minmax(0,1fr)}
	.rail{grid-template-columns:minmax(0,1fr)}
	.jump ol{columns:1}
	.hero-row{padding-top:44px;padding-bottom:52px}
	.mast-pin{display:none}
	.glance{flex-wrap:wrap}
	.glance li{flex:1 1 40%;border-top:1px dashed var(--rule)}
	.glance li:nth-child(-n+2){border-top:none}
	.wrap{padding:0 20px}
	.mean-row{padding:26px}
	.mean-kanji{font-size:72px}
	.idea-no{font-size:40px;margin-top:44px}
}