@font-face{font-family:ForestPen;src:url('./assets/notebook/NanumPenScript-Regular.ttf') format('truetype');font-display:swap}
dialog.forest-paper{color-scheme:light;box-sizing:border-box;width:min(420px,calc(100vw - 28px));max-height:84dvh;margin:auto;padding:24px;border:1px solid #ac9575;border-radius:14px;background:#fff8e8;color:#393d32;box-shadow:0 14px 50px #21312955;overflow:auto;font-size:calc(16px * var(--garden-text-scale,1))}
.forest-paper::backdrop{background:#1e302979;backdrop-filter:blur(3px)}
.forest-paper header,.forest-paper .bench-actions,.forest-paper footer{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.forest-paper h2{color:#414839;font-size:1.35em;margin:0;line-height:1.25}
.forest-paper button,.forest-paper input{background:#fffaf0;border:1px solid #cbb99c;color:#394836;border-radius:10px;min-height:42px;font-size:.95em}
.forest-paper button{padding:6px 13px;cursor:pointer}
.forest-paper [data-close]{position:static;flex:none}
.forest-paper header [data-close]{width:42px;border:0;font-size:1.35em}
.forest-paper button:disabled{opacity:.5;cursor:default}
.forest-paper .forest-primary{background:#4d6859;color:white;border-color:#435a4c}
.forest-door .bench-actions{justify-content:flex-end;margin-top:24px}
dialog.forest-notebook{padding:22px 18px 18px 25px;border-radius:6px 16px 14px 6px;border-left:7px solid #997278;background:linear-gradient(90deg,#dccaac,#fbefd5 12px,#fff6e2 25px);box-shadow:3px 3px 0 #e7d7bb,5px 5px 0 #a68477,0 16px 45px #252c2859}
.forest-notebook:before{content:'';position:absolute;right:70px;top:0;background:#aa7177;width:13px;height:19px;clip-path:polygon(0 0,100% 0,100% 100%,50% 76%,0 100%)}
.forest-notebook h2,.forest-notebook .ruled-page{font-family:ForestPen,'Malgun Gothic',sans-serif;font-weight:400}
.forest-notebook h2{font-size:2em}
.forest-notebook .private-note,.forest-paper [role=status]{font-size:.84em;line-height:1.5;color:#5d6252}
.ruled-page{
 --row:1.45em;
 --ink-bottom:1.11em;
 --ruling:repeating-linear-gradient(to bottom,transparent 0 calc(var(--ink-bottom) - 1px),#d6cbb8 calc(var(--ink-bottom) - 1px) var(--ink-bottom),transparent var(--ink-bottom) var(--row));
 font-size:1.55em;
 line-height:var(--row);
 padding:0 5px 14px;
}
.ruled-page ul{list-style:none;padding:0;margin:0}
.ruled-page li{padding:0;margin:0;line-height:var(--row)}
.ruled-page li label{
 display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start;gap:8px;
 margin:0;padding:0;color:#403d37;font:inherit;background-image:var(--ruling);
}
.ruled-page li span{white-space:pre-wrap;overflow-wrap:anywhere}
.ruled-page li input{box-sizing:border-box;margin:calc((var(--row) - 18px)/2) 0 0;min-height:0;width:18px;height:18px;font:inherit;accent-color:#73816c}
.ruled-page input:checked+span{text-decoration:line-through;color:#6d7164}
.ruled-page form{display:grid;gap:.18em;margin-top:.6em}
.ruled-page form label{font:inherit;color:#58624c}
.ruled-page textarea{
 box-sizing:border-box;display:block;width:100%;min-height:calc(2 * var(--row));margin:0;padding:0 4px;
 background:transparent var(--ruling) left top local;border:0;border-radius:3px;color:#403d37;
 resize:vertical;font:inherit;line-height:var(--row);
}
.ruled-page .ink-button{justify-self:end;font:inherit;font-size:.86em;background:#f4ead1}
.forest-notebook footer{margin-top:16px}
.forest-clock{text-align:center}
.forest-clock .clock-face{display:grid;place-items:center;width:8em;height:8em;max-width:100%;margin:18px auto;border-radius:50%;background:#fffbeb;border:5px solid #88a497;box-shadow:0 0 0 2px #b29c78,inset 0 0 0 2px #dbceb6}
.clock-face output{font-variant-numeric:tabular-nums;font-size:2em;color:#394c40}
.forest-clock form{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}
.forest-clock input{width:4em;text-align:center;padding:0}
.forest-clock [hidden]{display:none!important}
#forestUI .bench-tools{position:fixed;top:calc(85px + env(safe-area-inset-top,0px));right:14px;display:flex;gap:5px;pointer-events:auto}
@media(max-width:700px){#forestUI .bench-tools{top:calc(60px + env(safe-area-inset-top,0px));bottom:auto;left:12px;right:auto;flex-wrap:wrap;max-width:60vw}#forestUI .bench-tools button{padding:5px 10px;min-height:44px}}


.forest-paper header [data-close]{width:auto;min-height:44px;font-size:1em;border:1px solid #cbb99c}
dialog.forest-guide[open]{display:grid;grid-template-rows:minmax(0,1fr) auto;align-items:end;justify-items:center;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;overflow:hidden;border:0;border-radius:0;background:transparent;color:#344638;box-shadow:none}
.forest-guide::backdrop{background:rgba(32,45,34,.12);backdrop-filter:none}
body:has(.forest-guide[open]) :is(#forestUI,#mobileMenuToggle,#joystick,.bottom,.top,#forestMusicShortcut){visibility:hidden!important}
.guide-view{position:relative;align-self:stretch;width:100%;pointer-events:none}
.guide-view .guide-ring{pointer-events:auto;background:transparent;padding:0;cursor:pointer;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);box-sizing:border-box;border:3px solid #fff5d6;border-radius:50%;box-shadow:0 0 0 2px #7d593b,0 0 14px #fff8c9a8}
.guide-card{box-sizing:border-box;width:min(420px,calc(100% - 24px));max-height:68dvh;overflow:auto;margin:0 0 max(12px,env(safe-area-inset-bottom));padding:14px 18px;background:#fff9ec;border:1px solid #cbbc99;border-radius:14px;color:#394738;font:calc(16px * var(--garden-text-scale,1))/1.45 system-ui,sans-serif}
.guide-heading,.guide-card nav{display:flex;align-items:center;justify-content:space-between;gap:8px}
.guide-card .guide-heading small{font:inherit;font-size:.85em;color:#656c5d}
.guide-card h2{font:1.8em/1.05 ForestPen,system-ui,sans-serif;color:#364b3d;margin:3px 0 7px}
.guide-card p{color:#405043;font:inherit;margin:0 0 14px;word-break:keep-all;overflow-wrap:anywhere}
.guide-card button{min-height:44px;padding:5px 14px;border:1px solid #bfbda6;border-radius:9px;background:transparent;color:#394937;font:inherit}
.guide-card [data-skip]{border:0;padding:3px 0}
.guide-card [data-next]{background:#49674f;color:white;border-color:#49674f}
.guide-card button:disabled{visibility:hidden}
