.motion-opening{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:32px;align-content:start;position:relative;padding:64px 0 80px}
.motion-opening .article-header{grid-column:1}
.motion-opening>p{grid-column:1;font:400 18px/28px Arial,sans-serif;max-width:44ch;margin:0 0 24px;text-wrap:pretty}
.motion-opening>p:first-of-type{font-size:24px;line-height:32px;letter-spacing:-.025em}
.motion-opening>p:last-of-type{color:var(--soft);font-size:16px;line-height:24px;margin-bottom:0}
.essay .motion-opening .motion-coat-inline{grid-column:2;grid-row:1/7;align-self:center;position:relative;width:100%;max-width:none;margin:0;padding:0}
.motion-opening .coat-slot{aspect-ratio:3/2;width:100%}
.motion-opening .ink-coat-art{width:100%;height:100%}
.ink-coat-art[data-ready=true] .ink-coat-canvas{opacity:1}
.ink-coat-art[data-ready=true] .ink-coat-fallback{visibility:hidden}
.ink-coat-art[data-ready=fallback] .ink-coat-canvas{opacity:0}
.ink-coat-art[data-ready=fallback] .ink-coat-fallback{visibility:visible}
.motion-opening .ink-coat-grab{top:12%;left:72%;width:23%;height:70%}
.motion-opening .ink-coat-grab:focus-visible{border-radius:4px;outline-offset:0}
.coat-detail{display:flex;align-items:center;gap:16px;margin:24px 0 0 auto;padding:8px 0;min-height:44px;border:0;background:transparent;color:var(--soft);font:500 12px/16px Arial,sans-serif;touch-action:manipulation;transition:color .3s var(--curve),transform .5s var(--curve)}
.coat-detail[hidden]{display:none}
.coat-detail span{font-size:18px}
.coat-detail:hover{color:var(--ink)}
.coat-detail:active{transform:translateY(2px)}
.coat-detail-dialog{width:100%;max-width:none;height:100dvh;max-height:none;padding:24px 48px;border:0;margin:0;background:var(--paper);color:var(--ink);overflow:auto;overscroll-behavior:contain}
.coat-detail-dialog[open]{display:flex;flex-direction:column}
.coat-detail-dialog::backdrop{background:#181818}
body:has(.coat-detail-dialog[open]){overflow:hidden}
.coat-detail-bar{display:flex;justify-content:space-between;align-items:center;gap:24px;font:400 12px/20px Arial,sans-serif;color:var(--soft)}
.coat-detail-close{display:flex;align-items:center;gap:24px;min-height:44px;padding:8px 12px;border:1px solid var(--rule);border-radius:4px;background:transparent;color:var(--ink);font:500 14px/20px Arial,sans-serif;touch-action:manipulation;transition:background .3s var(--curve),transform .5s var(--curve)}
.coat-detail-close:hover{background:var(--rule)}
.coat-detail-close:active{transform:scale(.98)}
.coat-detail-mount{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;padding-block:24px;overflow:hidden}
.coat-detail-mount .ink-coat-art{width:min(100%,calc((100dvh - 180px)*1.5));flex:none}
.coat-detail-dialog[data-view=detail] .ink-coat-art{width:min(2400px,240vw,calc((100dvh - 180px)*2.1));transform:translate(-30%,5%)}
.coat-detail-note{display:flex;justify-content:space-between;align-items:center;gap:16px;font:400 12px/20px Arial,sans-serif;color:var(--soft);padding:8px}
.coat-detail-dialog:has(.ink-coat-art[data-ready=fallback]) .coat-detail-note>span{visibility:hidden}
.coat-view-toggle{min-height:44px;padding:8px 0;border:0;background:transparent;color:var(--ink);font:500 12px/20px Arial,sans-serif;text-decoration:underline;text-underline-offset:4px;touch-action:manipulation}
.coat-view-toggle:hover{color:#a43e20}
.coat-view-toggle:active{transform:translateY(2px)}
@media(min-width:1600px){.motion-opening{column-gap:48px}}
@media(max-width:1100px){
 .motion-opening{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:16px;padding-block:48px 64px}
 .motion-opening>p{font-size:16px;line-height:24px}
 .motion-opening>p:first-of-type{font-size:20px;line-height:28px}
}
@media(max-width:900px){
 .motion-opening{display:flex;flex-direction:column;padding-block:40px 48px;gap:0}
 .motion-opening .article-header{margin-bottom:32px;order:0}
 .motion-opening>p{font-size:18px;line-height:28px;max-width:44ch;order:2}
 .motion-opening>p:first-of-type{font-size:24px;line-height:32px}
 .motion-opening>p:last-of-type{font-size:16px;line-height:24px}
 .essay .motion-opening .motion-coat-inline{margin:0 0 32px;width:100%;order:1}
 .coat-detail{margin-top:8px}
}
@media(max-width:750px){
 .coat-detail-dialog{padding:16px}
 .coat-detail-bar{gap:8px;align-items:start}
 .coat-detail-bar>span{max-width:14ch}
 .coat-detail-close{font-size:12px;gap:12px}
 .coat-detail-mount{padding:24px 0}
 .coat-detail-mount .ink-coat-art{width:100%}
}
@media(prefers-reduced-motion:reduce){
 .coat-detail,.coat-detail-close{transition:none}
}
@media print{
 .motion-opening{display:block;padding:0}
 .motion-opening>p{font-size:12pt;line-height:1.5}
 .essay .motion-opening .motion-coat-inline{width:100mm;margin:16pt auto}
 .motion-opening .ink-coat-art{height:auto}
 .coat-detail,.coat-detail-dialog{display:none!important}
}