/* The Library: everything Kikai has made, one catalog, one bar that changes it all. */
.lib{max-width:1120px;margin:0 auto;padding:clamp(60px,10vh,110px) clamp(20px,6vw,80px) 18svh;color:var(--ink,#191619)}
.lib-kicker{font-size:clamp(12px,1.5vw,15px);letter-spacing:.34em;text-transform:uppercase}
.lib-statement{max-width:720px;margin-top:clamp(22px,3vh,34px);font-size:clamp(19px,2.4vw,30px);line-height:1.55}
.lib-statement a{color:inherit;text-decoration:none;border-bottom:1px solid #b9b4b8}
.lib-statement a:hover{border-color:currentColor}
.lib-tools{display:flex;flex-wrap:wrap;align-items:baseline;gap:18px clamp(24px,4vw,52px);margin-top:clamp(35px,6vh,70px)}
.lib-sets{display:flex;flex-wrap:wrap;gap:10px clamp(16px,2.6vw,34px)}
.lib-sets button{font-family:inherit;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#5c575c;background:transparent;border:0;border-bottom:1px solid transparent;padding:0 0 4px;cursor:pointer;transition:color .2s,border-color .2s}
.lib-sets button:hover{color:var(--ink,#191619)}
.lib-sets button[aria-pressed="true"]{color:var(--ink,#191619);border-color:var(--ink,#191619)}
.lib-sets button:disabled{opacity:.35;cursor:default}
.lib-search{margin-left:auto;min-width:180px;font-family:inherit;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink,#191619);background:transparent;border:0;border-bottom:1px solid #b9b4b8;padding:0 0 5px;border-radius:0;-webkit-appearance:none;appearance:none}
.lib-search::placeholder{color:#5c575c}
.lib-search:focus{outline:none;border-color:var(--ink,#191619)}
.lib-count{font-size:10px;letter-spacing:1.7px;text-transform:uppercase;color:#5c575c;margin-top:18px}
.lib-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(24px,4vh,40px) clamp(10px,1.5vw,18px);margin-top:clamp(22px,3vh,34px)}
.lib-item{margin:0;min-width:0}
.lib-box{position:relative;display:block;width:100%;aspect-ratio:var(--format,var(--r,4/5));overflow:hidden;background:#c9c5c8;border:0;padding:0;cursor:pointer;color:inherit;text-align:left;font:inherit}
.lib-box img,.lib-box video{display:block;width:100%;height:100%;object-fit:cover;background:#c9c5c8}
.lib-box .lib-text{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:16px;background:#e6e1e5;font-size:13px;line-height:1.55;color:var(--ink,#191619);overflow:hidden}
.lib-box .lib-text b{display:block;font-weight:400;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#5c575c;margin-bottom:10px}
.lib-box .lib-text span{display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden}
.lib-cap{position:absolute;left:-8%;top:72%;width:116%;display:flex;align-items:center;transform:translateY(-50%) rotate(-10deg);pointer-events:none}
.lib-cap img{display:block;width:100%;height:auto;object-fit:contain;filter:url(#lib-caption-ink);opacity:.9}
.lib-cap.has-emoji img{width:85%}
.lib-cap span{font-family:Apple Color Emoji,Segoe UI Emoji,sans-serif;font-size:clamp(18px,3.2vw,34px);line-height:1;white-space:nowrap}
.lib[data-caption="off"] .lib-cap{display:none}
.lib-meta{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-size:10px;line-height:16px;letter-spacing:1.7px;text-transform:uppercase;color:#121212}
.lib-meta b{font-weight:400;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lib-meta time,.lib-meta i{font-style:normal;color:#777;font-size:9px;white-space:nowrap}
.lib-acts{display:flex;gap:16px;margin-top:6px;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;opacity:0;transition:opacity .2s}
.lib-item:hover .lib-acts,.lib-item:focus-within .lib-acts{opacity:1}
.lib-acts a,.lib-acts button{font-family:inherit;font-size:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--ink,#191619);background:transparent;border:0;padding:0;cursor:pointer;text-decoration:none;border-bottom:1px solid transparent}
.lib-acts a:hover,.lib-acts button:hover{border-color:currentColor}
.lib-empty{margin-top:clamp(22px,3vh,34px);font-size:clamp(17px,2vw,22px);line-height:1.55;max-width:560px}
.lib-empty a{color:inherit;text-decoration:none;border-bottom:1px solid #b9b4b8}

/* The bar: one control changes the whole library. Fixed while the library is on screen. */
.lib-bar{position:fixed;left:50%;bottom:0;z-index:60;transform:translate(-50%,110%);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px clamp(14px,2.4vw,30px);width:min(100%,1120px);padding:12px clamp(16px,3vw,32px) max(12px,env(safe-area-inset-bottom));background:rgb(253 248 252 / 92%);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid #b9b4b8;font-size:10px;letter-spacing:1.7px;text-transform:uppercase;color:#5c575c;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.lib-bar.is-on{transform:translate(-50%,0)}
.lib-bar .group{display:inline-flex;align-items:center;gap:10px}
.lib-bar .group>span{color:#5c575c}
.lib-bar button{font-family:inherit;font-size:inherit;letter-spacing:inherit;text-transform:inherit;color:#5c575c;background:transparent;border:0;border-bottom:1px solid transparent;padding:0 0 2px;cursor:pointer}
.lib-bar button:hover{color:var(--ink,#191619)}
.lib-bar button[aria-pressed="true"]{color:var(--ink,#191619);border-color:var(--ink,#191619)}
.lib-bar .reset{margin-left:clamp(0px,2vw,20px)}

/* Detail */
.lib-dialog{width:min(100vw,1180px);max-width:none;max-height:none;height:100dvh;margin:0 auto;padding:0;border:0;background:var(--bg,#fdf8fc);color:var(--ink,#191619)}
.lib-dialog::backdrop{background:rgb(25 22 25 / 55%)}
.lib-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr)}
.lib-dialog .top{display:flex;justify-content:space-between;align-items:center;padding:20px clamp(16px,3vw,32px) 0}
.lib-dialog .top button{font-family:inherit;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink,#191619);background:transparent;border:0;padding:4px 0;cursor:pointer}
.lib-dialog .body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(20px,3vw,40px);padding:20px clamp(16px,3vw,32px) 32px;min-height:0;overflow:auto}
.lib-dialog .stage{display:grid;place-items:center;min-height:0;background:#e6e1e5}
.lib-dialog .stage img,.lib-dialog .stage video{display:block;max-width:100%;max-height:calc(100dvh - 140px);width:auto;height:auto;object-fit:contain}
.lib-dialog .stage iframe{width:100%;aspect-ratio:16/9;border:0}
.lib-dialog .stage .lib-text{padding:clamp(20px,4vw,48px);font-size:clamp(17px,2vw,22px);line-height:1.55;white-space:pre-line;max-width:720px}
.lib-dialog aside{display:flex;flex-direction:column;gap:14px;font-size:13px;line-height:1.6}
.lib-dialog aside h2{font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:400;line-height:1.6}
.lib-dialog aside .sub{color:#5c575c;font-size:10px;letter-spacing:1.4px;text-transform:uppercase}
.lib-dialog aside .label{display:inline-flex;align-items:center;gap:.7em;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink,#191619);text-decoration:none;font-family:inherit;background:transparent;border:0;padding:0;cursor:pointer;text-align:left}
.lib-dialog aside .label:hover{color:#5c575c}
.lib-dialog aside .label:disabled{opacity:.4;cursor:default}
.lib-dialog aside .note{color:#5c575c;font-size:12px}
.lib-dialog aside .stack{display:flex;flex-direction:column;gap:12px;padding-top:6px;border-top:1px solid #b9b4b8}
@media(max-width:900px){.lib-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.lib-dialog .body{grid-template-columns:1fr}.lib-dialog .stage img,.lib-dialog .stage video{max-height:60dvh}}
@media(max-width:600px){.lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lib-search{margin-left:0;width:100%}.lib-acts{display:none}.lib-bar{gap:8px 14px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.lib-bar{transition:none}}
