*{box-sizing:border-box}body{margin:0;direction:rtl;font-family:Noto Nastaliq Urdu,serif;background:#d9bd8b;color:#2b2b2b;line-height:2.2}h1{font-weight:400}.home-page{min-height:100vh;display:grid;place-items:center;padding:1.5rem}.home-link{padding:.6rem 2.5rem;border:1px solid #7c2924;background:#b16f70;color:#28110f;font:1.25rem Arial,sans-serif;text-decoration:none}.home-link:hover{background:#a85f61}.home-link:focus-visible{outline:3px solid #7c2924;outline-offset:3px}.search-page{min-height:100vh;display:grid;grid-template-columns:minmax(300px,44%) minmax(0,56%);direction:ltr;overflow:hidden}.search-panel{min-height:100vh;background:#d9bd8b;direction:rtl}.search-toolbar{height:62px;display:flex;direction:ltr;border:1px solid #7c2924;background:#eee6e4}.search-back{width:120px;flex:0 0 120px;display:grid;place-items:center;padding:0;border:0;background:#b16f70;color:#681a17;border-right:1px solid #7c2924;text-decoration:none;font-family:Arial,sans-serif;font-size:3.5rem;line-height:1;cursor:pointer}.search-back:hover{background:#a85f61}.piece-page{direction:ltr}.piece-toolbar{width:fit-content;border-right:0}.search-box{flex:1;display:flex;align-items:center;gap:.75rem;padding:0 1rem;direction:ltr}.search-box input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#4a302b;font:inherit;font-size:1rem;direction:rtl}.search-box input::placeholder{color:#9b9290}.search-box input::-webkit-search-cancel-button{cursor:pointer}.search-icon{width:19px;height:19px;flex:0 0 19px;position:relative;border:3px solid #8b1e19;border-radius:50%}.search-icon:after{content:"";position:absolute;width:8px;height:3px;right:-6px;bottom:-3px;background:#8b1e19;transform:rotate(48deg);border-radius:2px}.search-status{margin:1rem 1.25rem;color:#604c35}.bookcase{min-height:100vh;padding:1.6rem 1.4rem 2rem;border-left:8px solid #f3ca52;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(25vh - 10px),rgba(93,34,13,.8) calc(25vh - 10px),rgba(93,34,13,.8) calc(25vh - 5px),#e3a63e calc(25vh - 5px),#ffe074 25vh),repeating-linear-gradient(92deg,rgba(255,206,96,.14) 0 2px,transparent 2px 21px),linear-gradient(90deg,#9c481b,#d7802c 18%,#b75b20 48%,#df9139 77%,#9f491b);box-shadow:inset 0 0 0 5px #ffda5dcc,inset 0 0 18px #6c2b10;direction:rtl}.book-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(150px,22vh);align-items:start;justify-items:center;column-gap:clamp(.8rem,2.4vw,2.2rem);row-gap:1.25rem}.book-link{width:min(100%,116px);height:min(18vh,150px);min-height:116px;margin-top:.65rem;display:block;position:relative;color:inherit;text-decoration:none;perspective:500px}.book-link:before{content:none}.book-cover{position:relative;z-index:1;width:100%;height:100%;padding:1rem .75rem;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:transform .16s ease}.book-art{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:fill}.book-title{position:relative;z-index:1;max-width:100%;max-height:100%;overflow-wrap:anywhere;color:#311d23;text-align:center;font-size:clamp(1rem,1.6vw,1.35rem);line-height:1.8}.book-link:hover .book-cover,.book-link:focus-visible .book-cover{transform:translateY(-5px) rotate(-1deg)}.book-link:focus-visible{outline:3px solid #fff4bd;outline-offset:5px}.empty-shelf{margin:2rem 0;color:#fff1d4;text-align:center}.page{max-width:40rem;margin:0 auto;padding:2rem 1.25rem 4rem}.back{color:#3d5a50;text-decoration:none}.list{list-style:none;padding:0}.list li{border-bottom:1px solid #e3dccd}.list a{display:block;padding:.5rem 0;color:inherit;text-decoration:none;font-size:1.25rem}.list a:hover{color:#3d5a50}.piece-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,40rem) minmax(0,1fr);grid-template-areas:". title ." "left body right" ". comments .";gap:1.5rem;padding:0 clamp(1rem,3vw,2.5rem) 4rem}.piece-title{grid-area:title;margin:0 0 .5rem;text-align:center;overflow-wrap:anywhere}.piece-side{min-width:0;padding:1rem;background:#7c292412}.piece-side-left{grid-area:left}.piece-side-right{grid-area:right}.piece-side img{display:block;width:100%;height:auto}.piece{grid-area:body;min-width:0;aspect-ratio:1;padding:clamp(1.5rem,4vw,3rem);background:#fff;direction:rtl;overflow-wrap:anywhere;font-size:1.2rem}.piece img{max-width:100%;height:auto}.piece.poetry{text-align:center;white-space:pre-line}.piece.poetry p{margin:1.5rem 0}.comments{grid-area:comments;min-width:0;padding:clamp(1.5rem,4vw,3rem);background:#fff;overflow-wrap:anywhere}.comments h2{margin:0 0 1rem;font-weight:400}.comment-form{display:grid;gap:.4rem}.comment-form input,.comment-form textarea{width:100%;padding:.5rem;border:1px solid #bca9a2;background:#fff;color:inherit;font:inherit}.comment-form textarea{resize:vertical}.comments button{justify-self:start;padding:.35rem 1rem;border:1px solid #7c2924;background:#b16f70;color:#28110f;font:inherit;cursor:pointer}.comments button:disabled{opacity:.6;cursor:not-allowed}.comments button:focus-visible,.comment-form :focus-visible{outline:3px solid #7c2924;outline-offset:2px}.comment-trap{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.comment{border-top:1px solid #e3dccd;margin-top:1.5rem;padding-top:1rem}.comment-meta{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:baseline}.comment-meta time{color:#66544f;font-size:.85rem}.comment p{margin:.5rem 0 0;white-space:pre-wrap}.comment-error{color:#8b1e19}@media (max-width: 700px){.search-page{grid-template-columns:1fr;overflow:visible}.search-panel{min-height:0;position:sticky;top:0;z-index:2}.search-toolbar{height:58px}.search-back{width:76px;flex-basis:76px}.piece-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"title title" "body body" "left right" "comments comments";gap:1rem}.piece-side:empty{display:none}.bookcase{min-height:calc(100vh - 58px);padding:1.2rem 1rem 1.6rem;border-left:0;border-top:7px solid #f3ca52;background-size:auto,auto,auto}.book-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(150px,22vh);column-gap:.7rem}.book-link{width:min(100%,116px)}.book-title{font-size:1.1rem}}@media (max-width: 420px){.book-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (prefers-reduced-motion: reduce){.book-cover{transition:none}}
