:root{--paper-base: #f7f3e8;--paper-aged: #efe9da;--ink-black: #262626;--ink-gray: #2a2a2a;--ink-light: #444;--grid-pink: #e0b0b0;--grid-pink-light: #e8c4c4;--grid-red-center: #c04040;--cell-size: 38px;--font-size: 24px;--rows-per-column: 25}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px}body{min-height:100vh;background:radial-gradient(ellipse at top left,#907050,#6a4a35,#4a3020);background-attachment:fixed;font-family:Shippori Mincho,游明朝,Yu Mincho,ヒラギノ明朝 ProN,Hiragino Mincho ProN,serif;color:var(--ink-black);padding:1.5rem;line-height:1}body:before{content:"";position:fixed;inset:0;background-image:repeating-linear-gradient(88deg,transparent 0px,rgba(0,0,0,.015) 1px,transparent 2px,transparent 25px);pointer-events:none;z-index:0}.container{max-width:960px;margin:0 auto;position:relative;z-index:1}header{margin-bottom:1.5rem;padding:.8rem 1.5rem;background:var(--paper-base);border-radius:2px;box-shadow:0 3px 15px #0003,inset 0 0 60px #7864460a;position:relative}header .header-main{display:flex;align-items:center;justify-content:center;gap:.8rem}header .header-icon{width:28px;height:28px;color:var(--ink-gray);flex-shrink:0}header .header-text{text-align:left}header h1{font-size:1.3rem;font-weight:600;letter-spacing:.4em;color:var(--ink-black);margin-bottom:.1rem}header .subtitle{font-size:.8rem;font-weight:400;color:var(--ink-gray);letter-spacing:.15em}.genkoyoshi-wrapper{background:var(--paper-base);border-radius:2px;padding:1.5rem;box-shadow:0 5px 25px #00000040,0 0 0 1px #00000005;position:relative;overflow:hidden}.genkoyoshi-wrapper:before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none}.title-section{border-bottom:2px solid var(--grid-pink);padding-bottom:1.2rem;margin-bottom:1rem;text-align:center}.book-title{font-size:1.3rem;font-weight:600;letter-spacing:.15em;margin-bottom:.5rem;color:var(--ink-black)}.book-title ruby rt{font-size:.5em;font-weight:400;color:var(--ink-light)}.author-info{font-size:.95rem;font-weight:400;color:var(--ink-gray);letter-spacing:.25em}.genkoyoshi{direction:rtl;display:flex;flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:1rem .5rem;background:var(--paper-base);border:2px solid var(--grid-pink);height:calc(var(--cell-size) * var(--rows-per-column) + 2rem);-webkit-overflow-scrolling:touch;scroll-behavior:smooth}.genkoyoshi::-webkit-scrollbar{height:10px}.genkoyoshi::-webkit-scrollbar-track{background:var(--paper-aged);border-radius:5px}.genkoyoshi::-webkit-scrollbar-thumb{background:var(--grid-pink);border-radius:5px}.genkoyoshi::-webkit-scrollbar-thumb:hover{background:var(--grid-red-center)}.genko-column{direction:ltr;display:flex;flex-direction:column;border-right:1px solid var(--grid-pink);flex-shrink:0}.genko-column:first-child{border-right:none}.genko-column.center-line{border-right:2px solid var(--grid-red-center)}.genko-cell{width:var(--cell-size);height:var(--cell-size);border-bottom:1px solid var(--grid-pink-light);display:flex;align-items:center;justify-content:center;font-size:var(--font-size);font-weight:400;color:var(--ink-black);position:relative;writing-mode:vertical-rl;text-orientation:upright}.genko-cell:last-child{border-bottom:none}.genko-cell.empty{background:transparent}.genko-cell.punctuation .char-inner{transform:translate(6px) translateY(-6px)}.genko-cell.open-bracket .char-inner{transform:translateY(-4px)}.genko-cell.close-bracket .char-inner{transform:translateY(4px)}.genko-cell:nth-child(3n) .char-inner{transform:rotate(-.3deg)}.genko-cell:nth-child(3n+1) .char-inner{transform:rotate(.2deg)}.genko-cell:nth-child(3n+2) .char-inner{transform:rotate(.1deg) translate(.3px)}.genko-cell.punctuation .char-inner{transform:translate(6px) translateY(-6px)!important}.char-inner{display:inline-block}.genko-column:nth-child(odd) .genko-cell{color:var(--ink-black)}.genko-column:nth-child(2n) .genko-cell{color:var(--ink-gray)}.writer-section{margin-top:1.2rem;padding-top:1rem;border-top:1px dashed var(--grid-pink);display:flex;justify-content:flex-end;align-items:center;gap:.8rem}.writer-label{font-size:.85rem;font-weight:400;color:var(--ink-light)}.writer-name{font-size:1.1rem;font-weight:500;letter-spacing:.4em;padding:.2em .8em;border-bottom:1px solid var(--ink-black);color:var(--ink-black)}.scroll-hint{display:none;text-align:center;margin-top:.8rem;font-size:.75rem;color:var(--ink-light);letter-spacing:.1em}.scroll-hint:before{content:"← "}.scroll-hint:after{content:" →"}.affiliate-section{margin-top:2rem;margin-bottom:1.5rem;padding:1.5rem;background:linear-gradient(160deg,#fdfbf6 0%,var(--paper-base) 100%);border:1px solid var(--grid-pink);border-radius:4px;position:relative}.affiliate-section-label{position:absolute;top:-.8em;left:1.2rem;background:linear-gradient(180deg,#fdfbf6,var(--paper-base));padding:0 .6em;font-size:1.02rem;font-weight:500;color:var(--grid-red-center);letter-spacing:.1em;display:flex;align-items:center;gap:.35em}.affiliate-section-label svg{width:19px;height:19px}.affiliate-content{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:1.5rem}.book-cover-link{text-decoration:none;display:block;transition:transform .2s ease}.book-cover-link:hover{transform:translateY(-3px)}.book-cover-link:hover .book-cover{box-shadow:6px 6px 16px #0006,inset -3px 0 8px #ffffff14}.book-cover{width:140px;height:200px;background:linear-gradient(135deg,#3a3a3a,#252525,#1a1a1a);border-radius:2px 5px 5px 2px;box-shadow:4px 4px 12px #00000059,inset -3px 0 8px #ffffff14;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:.4rem;color:#c9a84c;font-size:.8rem;font-weight:500;text-align:center;padding:.8rem .6rem .8rem 1rem;position:relative;flex-shrink:0}.book-cover .cover-title{writing-mode:vertical-rl;text-orientation:upright;letter-spacing:.05em;font-size:.72rem;line-height:1.6}.book-cover .cover-author{writing-mode:vertical-rl;text-orientation:upright;font-size:.55rem;opacity:.75;letter-spacing:.05em;position:absolute;left:18px;bottom:18px}.book-cover:before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(90deg,#2a2a2a,#4a4a4a 40%,#3a3a3a);border-radius:2px 0 0 2px}.book-cover:after{content:"";position:absolute;inset:8px 8px 8px 12px;border:1px solid rgba(201,168,76,.3);pointer-events:none}.affiliate-info{text-align:left}.affiliate-info h3{font-size:1.1rem;font-weight:600;margin-bottom:.4rem;color:var(--ink-black);letter-spacing:.15em}.affiliate-info .book-meta{font-size:.85rem;font-weight:400;color:var(--ink-gray);margin-bottom:.9rem;line-height:1.8}.kindle-button{display:inline-flex;align-items:center;gap:.4rem;background:linear-gradient(180deg,#f90,#e68a00);color:#fff;text-decoration:none;padding:.7rem 1.3rem;border-radius:4px;font-family:inherit;font-size:.9rem;font-weight:600;letter-spacing:.05em;box-shadow:0 3px 8px #ff990059;transition:all .2s ease;border:none;cursor:pointer}.kindle-button:hover{background:linear-gradient(180deg,#fa2,#f90);transform:translateY(-2px);box-shadow:0 5px 15px #ff990073}.kindle-button svg{width:18px;height:18px}.page-actions{display:flex;justify-content:center;gap:1rem;margin-top:1.5rem}.action-link{display:block;padding:.8rem 2rem;min-width:140px;text-align:center;background:var(--paper-base);color:var(--ink-black);text-decoration:none;font-size:.9rem;font-weight:500;letter-spacing:.2em;border:1px solid var(--grid-pink);border-radius:4px;box-shadow:0 2px 8px #0000001a;transition:all .2s ease}.action-link:hover{background:var(--paper-aged);transform:translateY(-2px);box-shadow:0 4px 12px #00000026}footer{margin-top:1.5rem;text-align:center;padding:.8rem;color:#ffffff80;font-size:.8rem;font-weight:400;letter-spacing:.15em}.affiliate-disclosure{margin-top:.5rem;font-size:.7rem;color:#fff6}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:768px){:root{--cell-size: 32px;--font-size: 20px}body,.genkoyoshi-wrapper{padding:1rem}header h1{font-size:1.3rem;letter-spacing:.4em}header .subtitle{font-size:.85rem}.book-title{font-size:1.1rem;letter-spacing:.1em}.scroll-hint{display:block}.genko-cell.punctuation .char-inner{transform:translate(5px) translateY(-5px)!important}}@media(max-width:480px){:root{--cell-size: 28px;--font-size: 17px}body{padding:.6rem}.genkoyoshi-wrapper{padding:.8rem}header{padding:1rem;margin-bottom:1rem}header{padding:.6rem 1rem}header .header-main{gap:.6rem}header .header-icon{width:22px;height:22px}header h1{font-size:1rem;letter-spacing:.3em}header .subtitle{font-size:.7rem}.title-section{padding-bottom:.8rem;margin-bottom:.8rem}.book-title{font-size:1rem;letter-spacing:.05em}.author-info{font-size:.85rem}.genkoyoshi{padding:.5rem .3rem;height:calc(var(--cell-size) * var(--rows-per-column) + 1rem)}.genko-cell.punctuation .char-inner{transform:translate(4px) translateY(-4px)!important}.writer-section{margin-top:.8rem;padding-top:.8rem;gap:.5rem}.writer-label{font-size:.75rem}.writer-name{font-size:.95rem;letter-spacing:.3em}.scroll-hint{font-size:.7rem;margin-top:.6rem}.affiliate-section{margin-top:1.5rem;padding:1.2rem 1rem}.affiliate-section-label{font-size:.96rem;left:.8rem}.affiliate-section-label svg{width:17px;height:17px}.affiliate-content{gap:1rem}.book-cover{width:130px;height:185px;font-size:.7rem;padding:.6rem .5rem .6rem .8rem}.book-cover .cover-title{font-size:.65rem}.book-cover .cover-author{font-size:.48rem;left:14px;bottom:14px}.affiliate-info h3{font-size:1rem}.affiliate-info .book-meta{font-size:.8rem;line-height:1.7}.kindle-button{padding:.6rem 1.1rem;font-size:.85rem}footer{margin-top:1rem;font-size:.7rem}}@media(max-width:360px){:root{--cell-size: 24px;--font-size: 14px}body{padding:.4rem}.genkoyoshi-wrapper{padding:.6rem}header h1{font-size:1rem;letter-spacing:.2em}.book-title{font-size:.9rem;letter-spacing:.02em}.genko-cell.punctuation .char-inner{transform:translate(3px) translateY(-3px)!important}}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.genkoyoshi-wrapper{animation:fadeIn .6s ease-out}.affiliate-section{animation:fadeIn .6s ease-out .2s both}@media print{body{background:#fff;padding:0}.genkoyoshi-wrapper{box-shadow:none;border:1px solid #ccc}.scroll-hint,.affiliate-section,footer{display:none}}
