@charset "UTF-8";
:root{--board:#193a31;--wood:#674126;--paper:#eadfbd;--ink:#33291f;--chalk:#f2ecd5;--red:#d35c55;--blue:#5793bd;--yellow:#e0ca55;--shadow:0 9px 25px rgba(0,0,0,.38)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#1b120c;color:var(--ink);font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif}
a{text-decoration:none;color:inherit}
.site{min-height:100vh;background:repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 1px,transparent 1px 9px)}
.hero-board{margin:0;padding:0;width:100%;background:linear-gradient(#9b6a40,#51311e 17%,#815332 84%,#3f2516);box-shadow:0 8px 20px #000b}
.board-frame{position:relative;width:100%;border:12px solid var(--wood);border-top-width:8px;border-bottom-width:17px;overflow:hidden;box-shadow:inset 0 0 0 3px #c18a57,inset 0 0 55px #000b}
#heroCanvas{display:block;width:100%;height:min(49vw,500px);min-height:285px;background:var(--board);touch-action:none;cursor:crosshair}
.board-overlay{position:absolute;inset:10px;pointer-events:none;box-shadow:inset 0 0 42px #0009}
.date-column{
position:absolute;right:14px;top:9px;width:58px;color:#eee7cf;
font-family:"Klee One","Yu Mincho","Hiragino Mincho ProN",serif;font-weight:700;font-style:italic;
text-align:center;font-size:clamp(15px,1.9vw,23px);line-height:1.15;letter-spacing:0;
text-shadow:1px 1px #000,0 0 4px #d6d0bd;opacity:.84;padding:5px 3px 8px;
border-left:1px solid rgba(238,231,207,.35)
}.date-line{display:block;white-space:nowrap}.date-line+.date-line{margin-top:3px}
.chalk-tools{position:absolute;left:17px;bottom:13px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.chalk{width:47px;height:13px;border:0;border-radius:5px;box-shadow:0 2px 4px #0009;cursor:pointer}
.chalk-white{background:#f2ecd5}.chalk-red{background:var(--red)}.chalk-blue{background:var(--blue)}.chalk-yellow{background:var(--yellow)}
.tool{border:1px solid #d4b987;background:#4b3020;color:#fff1cf;border-radius:7px;padding:7px 11px;cursor:pointer;box-shadow:0 2px 5px #0009}.tool:hover{transform:translateY(-2px)}
.link-bar{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;padding:16px 12px;background:linear-gradient(#8e603a,#5b3823)}
.link-box{min-width:190px;min-height:62px;padding:10px 16px;border:3px solid #dbc69a;border-radius:15px;background:#213d35;color:#f2ead4;display:flex;align-items:center;justify-content:center;text-align:center;box-shadow:inset 0 0 16px #0008,0 4px 9px #0008;transition:.2s;position:relative}.link-box:before{content:"";position:absolute;inset:5px;border:1px dashed #bda77c;border-radius:10px;opacity:.65}.link-box:hover{transform:translateY(-4px) rotate(-.7deg);background:#2b4b40}
.counter-slot{height:20px;width:100%;display:flex;align-items:center;justify-content:center;background:#4a2d1d;color:#e7dbc0;font-size:10px;letter-spacing:.08em}
main{max-width:1240px;margin:auto;padding:28px 18px 62px}
.paper{position:relative;background:var(--paper);border:7px solid #6a472c;padding:28px;box-shadow:var(--shadow)}.paper:after{content:"";position:absolute;inset:9px;border:1px solid #b99e71;pointer-events:none}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
h1,h2,h3{font-weight:normal}.section-title{margin:0 0 16px;color:#29423a;font-size:clamp(28px,4vw,46px);transform:rotate(-1deg)}.section-title:after{content:"";display:block;width:170px;border-bottom:4px dashed #b85b50;margin-top:7px}
.lead{font-size:20px;line-height:1.9}.photo{width:100%;border:9px solid #624026;box-shadow:var(--shadow);transform:rotate(.5deg)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.card{min-height:170px;background:#203c34;color:#f3ecd8;border:6px solid #69442a;padding:22px;box-shadow:var(--shadow);transition:.2s}.card:nth-child(1){transform:rotate(-.7deg)}.card:nth-child(2){transform:rotate(.6deg)}.card:nth-child(3){transform:rotate(-.4deg)}.card:hover{transform:translateY(-5px) rotate(0deg)}.card h3{margin:0 0 10px;color:#e3cd5a;font-size:25px}
.notice{margin-top:23px;background:#e1d4b2;border-left:9px solid var(--red);padding:17px 20px;box-shadow:0 5px 12px #0002}


footer{background:#15100c;color:#eee2c5;text-align:center;padding:34px 20px;border-top:8px solid #6c4529}footer .slogan{font-size:23px}
@media(max-width:820px){.intro,.cards{grid-template-columns:1fr}.link-box{min-width:150px}}
@media(max-width:520px){.board-frame{border-width:7px;border-bottom-width:12px}.date-column{right:5px;width:46px;font-size:13px}.chalk-tools{left:7px;bottom:6px}.tool{font-size:12px;padding:5px 7px}main{padding:16px 8px 45px}.paper{padding:18px}.lead{font-size:17px}}

.chalk-size{display:flex;align-items:center;gap:5px;background:#4b3020;color:#fff1cf;
border:1px solid #d4b987;border-radius:7px;padding:5px 8px;font-size:12px;
box-shadow:0 2px 5px #0009}
.chalk-size input{width:90px;accent-color:#e0ca55;cursor:pointer}
.chalk-size output{display:inline-block;min-width:22px;text-align:center}
@media(max-width:520px){.chalk-size{font-size:11px;padding:4px 6px}.chalk-size input{width:70px}}