:root{--ink:#292322;--ink2:#514032;--blue:#56b9ee;--cream:#fff4dc;--brown:#e3bf91;--pink:#f25d85;--shadow:0 5px 13px #6a503329}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#d6c5af;color:var(--ink);font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}button,a{cursor:pointer}a{color:inherit}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #168acc;outline-offset:3px}.app{width:min(100%,680px);min-height:100dvh;margin:0 auto;box-shadow:0 0 38px #4a382634;overflow:hidden;background:#fff1db url('assets/background.webp') center top/100% auto no-repeat}main{display:block}
.home-board{width:100%;aspect-ratio:941/1672;position:relative;isolation:isolate;overflow:hidden;background:#fcefdc url('assets/background.webp') center / 100% 100% no-repeat}
.art-layer,.art-link{position:absolute;display:block}.art-layer{pointer-events:none;object-fit:fill}.art-link{line-height:0;text-decoration:none;transition:filter .15s,transform .15s;transform-origin:center}.art-link img{display:block;width:100%;height:100%;object-fit:fill}.art-link:hover{filter:brightness(1.035) drop-shadow(0 2px 2px #51321636)}.art-link:active{transform:scale(.975)}.art-link:focus-visible{outline:3px solid #2686b5;border-radius:10px;outline-offset:2px}
.dynamic-note{position:absolute;inset:9% 4%;border-radius:8px 22px 6px 18px;background:#fdf2dd url('assets/background.webp') center/cover;padding:5% 8%;font-size:clamp(10px,2.7vw,22px);line-height:1.55;display:flex;flex-direction:column;gap:4px;align-items:flex-start;justify-content:center;box-shadow:0 2px 6px #70513622;border:2px dashed #cfac77;transform:rotate(-1deg)}.dynamic-note:before{content:'';position:absolute;top:-7%;left:30%;width:35%;height:13%;background:#7ac8f3a6;transform:rotate(-5deg)}.dynamic-note strong{font-size:1.23em;line-height:1.2;font-weight:900;overflow-wrap:anywhere}.dynamic-note small{font-size:.68em;line-height:1.4;overflow-wrap:anywhere}.dynamic-note .go-arrow{margin-left:auto;font-size:1em;color:white;background:#282628;border-radius:50%;width:1.55em;height:1.55em;display:grid;place-items:center}.hero-label-edit{position:absolute;left:4%;bottom:3%;width:62%;background:#fff3dcee;padding:1.6% 3%;font-weight:900;font-size:clamp(15px,4vw,28px);transform:rotate(-2deg);border-bottom:3px solid var(--blue);box-shadow:var(--shadow)}
.board-bottom{height:clamp(8px,2vw,16px)}
.page{background:#fff0d8 url('assets/background.webp') center top/100% auto repeat-y;min-height:100dvh;padding:0 3.8% 44px;position:relative;overflow:hidden}
.page:before{content:'✦  ☆  ♡';position:absolute;top:110px;right:2%;color:#d99b53;font-size:17px;transform:rotate(12deg);pointer-events:none}
.page-top{display:flex;align-items:center;gap:14px;padding:24px 5px 18px}.back{display:inline-flex;align-items:center;justify-content:center;background:#2c2524;color:white;border-radius:8px 13px 6px 11px;padding:12px 15px;text-decoration:none;font-size:13px;font-weight:800;box-shadow:4px 4px 0 #ddba8e;white-space:nowrap;transform:rotate(-2deg)}.page-top .brand{margin-left:auto;color:#5d493d;font-style:italic;font-size:14px;letter-spacing:.04em}
.detail-header{position:relative;padding:20px 20px 18px;margin:12px 4px 18px;background:#fffbf1;border:2px solid #e8cba4;border-radius:9px 18px 12px 13px;box-shadow:4px 5px 0 #c89e6d3c;transform:rotate(-.6deg)}.detail-header:before{content:'';position:absolute;top:-10px;left:28%;width:75px;height:22px;background:repeating-linear-gradient(90deg,#65b9f1c4 0 13px,#b8e2fac9 13px 26px);transform:rotate(-6deg)}.detail-header .kicker{color:#1d8dc4;font-weight:800;font-style:italic;letter-spacing:.09em;font-size:12px}.detail-header h1{margin:7px 0 10px;font-size:clamp(22px,5.3vw,32px);line-height:1.35;letter-spacing:.01em;font-weight:900}.detail-header p{margin:0;font-size:14px;line-height:1.9;white-space:pre-wrap}.detail-header .dino{position:absolute;right:5px;bottom:-14px;width:65px;opacity:.92;pointer-events:none}
.note-paper{padding:20px;margin:17px 4px;background:#fffaf0;border:2px solid #e9cba6;border-radius:17px 7px 15px 7px;box-shadow:3px 4px 0 #bb90644b;position:relative;transform:rotate(.2deg)}.note-paper:before{content:'';position:absolute;left:42%;top:-11px;width:64px;height:19px;background:#68bdfa9a;transform:rotate(-9deg)}.note-paper h2{font-size:19px;margin:0 0 13px;line-height:1.45}.note-paper p{font-size:14px;line-height:1.85;white-space:pre-wrap;margin:0 0 12px}.note-paper p:last-child{margin-bottom:0}.note-paper .caption{font-size:12px;color:#736459}.note-paper .muted{color:#7b6e63;font-size:12px}.note-paper img{max-width:100%;border-radius:10px;height:auto;display:block}
.external-btn,.secondary-btn,.mini-btn{display:flex;width:100%;align-items:center;justify-content:center;gap:8px;padding:14px 15px;border:0;text-align:center;border-radius:9px 15px 9px 14px;text-decoration:none;font-size:14px;font-weight:800;transition:transform .15s;box-shadow:2px 4px 0 #b69a794b}.external-btn{background:#302a2b;color:white}.secondary-btn{background:#caeefa;color:#203841}.mini-btn{background:#ffe7d5;color:#55382c;padding:10px;font-size:13px}.external-btn:hover,.secondary-btn:hover,.mini-btn:hover{transform:translateY(-2px)}.external-btn[aria-disabled="true"],button:disabled{opacity:.48;cursor:not-allowed;pointer-events:none}.external-btn:after{content:'↗';font-size:18px;font-weight:400}
.nav-home{text-align:center;margin-top:30px;font-size:13px}.nav-home a{text-decoration:underline;text-underline-offset:4px}
.secret-items{display:grid;gap:10px}.scribble-head{font-size:14px;font-weight:800;color:#137faf;transform:rotate(-1deg);display:inline-block;margin:2px 0 5px}.dot-point{display:flex;gap:13px;margin:10px 0;line-height:1.6;font-size:14px}.dot-point:before{content:'★';color:#f5b355}
.form-row{display:flex;flex-direction:column;gap:7px;margin:13px 0}.form-row label{font-size:13px;font-weight:800}.form-row input,.form-row textarea,.form-row select{width:100%;padding:12px 11px;background:#fff;border:1.5px solid #d6b990;border-radius:9px;color:var(--ink);font-size:15px}.form-row textarea{min-height:85px;resize:vertical}.two-buttons{display:grid;grid-template-columns:1fr 1fr;gap:9px}.feedback{min-height:22px;color:#236d8e;font-size:12px;font-weight:700;margin:10px 0 0}
.preview-frame{border:2px dashed #cbb394;background:#fff4e1;border-radius:13px;display:grid;place-items:center;overflow:hidden;min-height:200px}.preview-frame img{width:100%;max-height:650px;object-fit:contain}.placeholder{text-align:center;padding:26px 15px;color:#715e52;line-height:1.8}.placeholder .huge{font-size:45px;display:block;margin-bottom:12px}.small-alert{padding:12px 14px;font-size:12px;line-height:1.6;color:#5d4d43;background:#fbe9cd;border-left:4px solid #5cbbdf;border-radius:6px;margin-top:12px}
.schedule-row{display:flex;justify-content:space-between;gap:10px;padding:11px;border:1px dashed #e5c298;border-radius:8px;margin:7px 0;font-size:13px}.schedule-row span:last-child{font-weight:800}.prices label{display:flex;align-items:center;gap:9px;padding:13px 5px;border-bottom:1px dashed #dbb991;font-size:13px}.prices label span{flex:1}.prices input{width:18px;height:18px;accent-color:#35a4d8}.price-total{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:17px 0}.price-total strong{font-size:29px}.sound-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.sound-grid button{padding:15px 5px;background:#302729;border:1px solid #514543;color:white;border-radius:10px;font-weight:750;font-size:12px}.sound-grid button:active{background:#1c83a2;transform:scale(.97)}
.creator-image{min-height:170px;background:#fbeed7;border-radius:13px;border:2px dashed #c7a57d;display:grid;place-items:center;color:#776452;text-align:center;padding:25px;font-size:13px;line-height:1.65}
.footer-note{text-align:center;font-size:13px;color:#7b6451;padding:18px 10px 34px;font-style:italic;letter-spacing:.04em}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media(min-width:681px){.dynamic-note{font-size:19px}}

/* v6 LINE scrapbook: faithful illustration, split into independently replaceable sections. */
.line-scrap-page{margin:0;padding:0;overflow:hidden;background:#fff1dc;color:#24201d}
.line-scrap-art{width:100%;position:relative;isolation:isolate;aspect-ratio:941/1672;background:#fff2de}
.line-scrap-slice{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none;pointer-events:none}
.line-art-hit{position:absolute;z-index:3;display:block;text-decoration:none;border-radius:18px;outline-offset:3px;touch-action:manipulation;transition:transform .17s ease,box-shadow .17s ease,background .17s ease}
.line-art-hit:hover{background:#ffffff13;box-shadow:inset 0 0 0 2px #c4f4ff66,0 2px 16px #ffecc45e}
.line-art-hit:active{transform:scale(.972);background:#ffffff2b}
.line-art-hit:focus-visible{outline:4px solid #147cac;background:#ffffff20}
.line-art-hit.unavailable{cursor:not-allowed;opacity:.5}
/* The join artwork occupies x~=79..854, y~=980..1164 on the 941x1672 drawing */
.line-art-join{left:7.5%;top:58.6%;width:84.5%;height:10.7%;border-radius:12% / 35%}
/* Wooden TOP sign, right of the rules card */
.line-art-return{left:62%;top:80.2%;width:35%;height:8.4%;transform:rotate(-2deg)}
.line-art-return:active{transform:rotate(-2deg) scale(.97)}
.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(prefers-reduced-motion:reduce){.line-art-hit{transition:none}}
