/* Flint and Feather: the showcase. The library's own hand: the passport's tan to the edge, one sheet within one
   hairline, Georgia, ink. Mobile first. Light only. No bullets: lists are marked with the library's marks. */
@font-face{font-family:"Flint and Feather Flint";src:url("ff-showcase.woff2") format("woff2");font-weight:400;font-style:normal;font-display:block}
.ff-hand-offering::before{content:"\e3d2"}.ff-calendar::before{content:"\e04f"}.ff-chevron-left::before{content:"\e254"}.ff-chevron-right::before{content:"\e255"}.ff-magnifying-glass::before{content:"\e49d"}.ff-tag::before{content:"\e65d"}.ff-circle-check::before{content:"\e263"}.ff-feather::before{content:"\e34b"}.ff-link::before{content:"\e034"}.ff-book-open::before{content:"\e1d4"}.ff-newspaper::before{content:"\e4f2"}
:root{--tan:#E4D7BA;--sheet:#FBFAF6;--ink:#1A1C20;--text:#352E13;--rule:#CBBD9A;--deep:#5E4410;--soft:#F1EADA;--green:#2E6B3A;--plum:#624152;color-scheme:light only}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--tan);color:var(--text);font:17px/1.55 Georgia,"Times New Roman",serif}
a{color:var(--deep);text-underline-offset:2px}a:hover{color:var(--ink)}img{max-width:100%;height:auto}
.ff{font-family:"Flint and Feather Flint";font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;display:inline-block;speak:never;-webkit-font-smoothing:antialiased;margin-right:.45em}.ff.r{margin:0 0 0 .45em}
.sheet{background:var(--sheet);border:1px solid var(--rule);margin:10px;min-height:calc(100vh - 90px);padding:20px 16px 36px}
@media(min-width:760px){.sheet{margin:18px;padding:34px 34px 48px}}@media(min-width:1218px){.sheet{max-width:1180px;margin-left:auto;margin-right:auto}}
.top{font-size:15px;margin:0 0 14px}
.k{font-variant:small-caps;letter-spacing:.08em;color:var(--deep);font-size:15px;margin:0 0 4px}.k a{color:inherit}
h1{font:400 clamp(36px,8vw,64px)/1.02 Georgia,serif;letter-spacing:-.012em;color:var(--ink);margin:0 0 12px}
h2{font:400 28px/1.15 Georgia,serif;color:var(--ink);margin:0 0 12px}
.lead{font-size:clamp(17px,2.4vw,20px);line-height:1.5;max-width:40em;color:var(--text)}.lead p{margin:0 0 10px}.lead:empty{display:none}
.hd{margin:0 0 22px;padding:0 0 18px;border-bottom:1px solid var(--rule)}
section{margin:0 0 26px}section+section{padding-top:22px;border-top:1px solid var(--rule)}
/* the button, and "add yours" */
.btn{display:inline-flex;align-items:center;background:var(--ink);color:#fff;border:1px solid var(--ink);padding:12px 18px;font:17px Georgia,serif;text-decoration:none;min-height:48px}.btn:hover{color:#fff;background:#000}
.btn.alt{background:#fff;color:var(--ink)}.btn.alt:hover{background:var(--soft);color:var(--ink)}
.add{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:16px 0 0}.add span{font-size:15.5px}
.sheet>.add{margin:6px 0 0;padding:18px 0 0;border-top:1px solid var(--rule)}
/* the cards: one sheet, one border, the picture, the name said once */
.cards{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin:0 0 20px}
@media(min-width:560px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:960px){.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}}
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule);border-top:5px solid var(--ink);color:var(--ink);text-decoration:none}
a.card:hover{border-color:var(--ink)}a.card:focus-visible{outline:2px solid var(--deep);outline-offset:2px}
.card .pic{display:block;background:var(--soft);aspect-ratio:3/2;overflow:hidden}.card .pic img{display:block;width:100%;height:100%;object-fit:cover}
.card .cn{display:block;font:400 21px/1.2 Georgia,serif;padding:12px 14px 2px}.card .cm{display:block;font-size:14.5px;color:var(--deep);padding:0 14px 12px;min-height:1em}.card .cn:last-child{padding-bottom:14px}
.card .cw{display:block;font-size:15px;color:var(--text);padding:0 14px 14px;margin-top:-6px}
.pieces .card{border-top-color:var(--plum)}
.empty{font-size:19px;padding:22px 18px;background:var(--soft);border-left:3px solid var(--rule);max-width:40em}
/* one piece */
.piece{margin:0 0 20px}.piece>a,.piece>img{display:block}.piece img{display:block;margin:0 auto;border:1px solid var(--rule);background:#fff;max-height:82vh;width:auto}
.piece figcaption{margin:14px 0 0}.meta{font-size:15px;color:var(--deep);margin:8px 0 0}
.pn{display:flex;justify-content:space-between;gap:12px;margin:0 0 6px}
.taglist,.taglist ul{list-style:none;margin:10px 0 0;padding:0;font-size:15px}.taglist li{display:inline}.tl{font-variant:small-caps;letter-spacing:.07em;color:var(--deep)}
/* page numbers */
div.pagelist{margin:8px 0 0}ul.pagelist{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;font-size:16px}
ul.pagelist li a,ul.pagelist li span,ul.pagelist li.current{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 12px;border:1px solid var(--rule);background:#fff;color:var(--ink);text-decoration:none}
ul.pagelist li.current,ul.pagelist li.current a{background:var(--ink);color:#fff;border-color:var(--ink)}ul.pagelist .disabledlink{color:#9A917C;background:none}
/* the search box */
#search{margin:16px 0 0;max-width:34em}#search form>div{display:flex;gap:8px;flex-wrap:wrap}#search .tagSuggestContainer{flex:1 1 12em;display:block}
#search_input{width:100%;font:17px Georgia,serif;padding:11px 12px;border:1px solid var(--rule);background:#fff;color:var(--ink);border-radius:0;min-height:48px}
#search_submit{font:17px Georgia,serif;padding:11px 18px;background:#fff;color:var(--ink);border:1px solid var(--ink);border-radius:0;cursor:pointer;min-height:48px}
#search a.toggle_searchextrashow,#search #searchextrashow,#search .clear_search{font-size:14px}#searchfields_icon{display:none}
/* by date, and the cloud of words */
.dates ul,.cloud ul{list-style:none;margin:0;padding:0}.dates li{margin:0 0 4px}.dates>ul>li{font:400 22px Georgia,serif;color:var(--ink);margin:14px 0 4px}.dates ul ul li{font-size:16px;display:inline-block;margin:0 14px 4px 0}
.cloud li{display:inline-block;margin:0 12px 6px 0}
/* forms the program writes (password, contact, sign up, comments) */
.form,.quiet{max-width:34em}.form label,.quiet label{display:block;margin:10px 0 4px;color:var(--ink)}
.form input[type=text],.form input[type=password],.form input[type=email],.form textarea,#commentform input[type=text],#commentform textarea{width:100%;font:17px Georgia,serif;padding:11px 12px;border:1px solid var(--rule);background:#fff;color:var(--ink);border-radius:0}
.form button,.form input[type=submit],#commentform input[type=submit],#commentform button{font:17px Georgia,serif;padding:12px 18px;background:var(--ink);color:#fff;border:1px solid var(--ink);border-radius:0;cursor:pointer;margin-top:10px}
fieldset{border:1px solid var(--rule);padding:14px;margin:0 0 14px}legend{font-variant:small-caps;letter-spacing:.07em;color:var(--deep);padding:0 6px}
/* the foot */
.made{max-width:1180px;margin:0 auto;padding:12px 28px 24px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;font:14px Georgia,"Times New Roman",serif;color:var(--text)}
.made a{color:inherit;text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center}.made a span{text-decoration:underline}.made svg{width:32px;height:21.4px;flex:none;margin-right:10px;fill:currentColor}.made .ff{font-size:22px;margin-right:8px}
@media print{body{background:#fff}.sheet{border:0;margin:0}.top,.add,.pn,#search,.made,div.pagelist{display:none!important}}
.meta.by span{display:inline-block;margin-right:20px}.meta.by .ff{margin-right:7px}
.meta a{color:inherit}.meta.filed .tl{font-variant:small-caps;letter-spacing:.06em;margin-right:4px}.meta.filed .ff{margin-right:7px}
.kinds{margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.kinds .ff{margin-right:2px;color:var(--deep)}.kinds a{display:inline-block;border:1px solid var(--rule);background:#fff;padding:7px 14px;text-decoration:none;color:var(--ink);font-size:16px}.kinds a:hover{border-color:var(--ink)}
.marks{margin:18px 0 0;border-top:1px solid var(--rule);padding-top:14px}.marks .k{margin:0 0 8px}.mks{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0}
.mk{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);font-size:15px}.mk:hover span{text-decoration:underline}
.ffa{font-family:"Flint and Feather All";font-style:normal;font-weight:400;font-size:24px;line-height:1;display:inline-block;min-width:24px;text-align:center}
.piece .part{display:block;margin:14px 0 0}.piece .part img{display:block;width:100%;height:auto;border:1px solid var(--rule)}
/* 6.669.0 pictures at their own shape */
.card .pic img{object-fit:contain}.card .pic.long img{object-fit:cover;object-position:top}
.piece.tall>a>img,.piece.tall>img{max-width:min(440px,100%)}.piece.long>a>img,.piece.long>img{max-height:none;width:100%}
.shots{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start;margin:14px 0 0}.piece .shots .part{margin:0;flex:1 1 100%}.piece .shots .part.tall{flex:0 1 300px;max-width:calc(50% - 7px)}.piece .shots .part img{max-height:none;width:100%}
.piece a[data-view]{cursor:zoom-in}
.new{font:normal 12.5px Georgia,serif;font-variant:small-caps;letter-spacing:.08em;color:var(--green);border:1px solid var(--green);padding:1px 6px 2px;margin-left:6px;vertical-align:.18em;white-space:nowrap}
.newest{margin-bottom:22px}@media(max-width:559px){.newest .card:nth-child(n+3){display:none}}
.maker{margin:6px 0 0}.maker .ml{display:block;max-height:84px;max-width:260px;width:auto;margin:0 0 12px}
#viewer{border:0;padding:0;margin:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;background:var(--sheet);color:var(--ink)}#viewer::backdrop{background:var(--sheet)}
#viewer[open]{display:flex;flex-direction:column}#viewer .vb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:10px 14px;border-bottom:1px solid var(--rule);font-size:15px}#viewer .vn{margin-right:auto;color:var(--deep)}
#viewer button{font:16px Georgia,serif;min-height:44px;padding:8px 14px;border:1px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer;display:inline-flex;align-items:center}#viewer button.vc{background:var(--ink);color:#fff}
#viewer .vi{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:12px;overflow:auto}#viewer .vi img{max-width:100%;max-height:100%;width:auto;height:auto;border:1px solid var(--rule);background:#fff}
#viewer .vi img{max-height:calc(100vh - 92px);max-height:calc(100dvh - 92px)}
.card .pic.none{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--ink)}.card .pic.none .ffa{font-size:64px;min-width:0}.card .pic.none b{font:normal 14.5px Georgia,serif;font-variant:small-caps;letter-spacing:.08em;color:var(--deep)}
