@import url('https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&family=Gowun+Dodum&family=Nanum+Pen+Script&display=swap');
:root{--ink:#625c58;--muted:#9b938c;--purple:#a89abb;--line:#e9e4dc;--ui:'Gowun Dodum',sans-serif;--paper:'Gowun Batang',serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#f6f4ef;font-family:var(--ui);font-size:13px}button,a,input{font:inherit}button{border:0;background:none;color:inherit;cursor:pointer}button{border-radius:7px;transition:background .18s,transform .18s}button:hover{background:#eae5ee}button:focus-visible,a:focus-visible{outline:2px solid #aa97bd;outline-offset:3px}a{color:inherit;text-decoration:none}.svg-library{position:absolute;width:0;height:0}.topbar{height:75px;background:#fbfaf7;border-bottom:1px solid #e9e5df;display:flex;align-items:center;justify-content:space-between;padding:0 36px}.brand{font-family:var(--paper);font-weight:700;display:flex;align-items:center;gap:12px;font-size:24px;letter-spacing:2px}.brand-mark{color:#aa99bb;font-size:36px}.brand-sub{font-family:var(--ui);font-weight:400;letter-spacing:0;font-size:11px;color:#a39a92;margin-left:14px}.header-right{display:flex;gap:24px;align-items:center}.saved{color:#9a9b8a;font-size:11px}.avatar{border:1px solid #e2d9df;background:#ebe3e8;width:33px;height:33px;border-radius:50%;font-family:var(--paper)}.app-layout{display:flex;min-height:calc(100vh - 75px)}.rail{width:87px;flex-shrink:0;background:#fbfaf7;border-right:1px solid #e9e5df;display:flex;align-items:center;flex-direction:column;padding:27px 8px 15px;gap:13px}.rail-item{display:flex;align-items:center;flex-direction:column;gap:6px;width:64px;padding:10px 0;color:#a59a92}.rail-item>span{font-size:24px;line-height:25px}.rail-item small{font-size:10px}.rail-item.active{background:#eee8f2;color:#9581a5}.rail-line{width:25px;border-top:1px solid #eae4de;margin:7px 0}.rail-spacer{flex:1}.rail-bunny{width:47px;height:64px;opacity:.65}main{padding:30px 54px 0;flex:1;min-width:0;max-width:1600px;margin:auto}.workspace-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.eyebrow{font-family:Arial,sans-serif;font-size:9px;letter-spacing:2.2px;color:#a2978c}.eyebrow span{border-left:1px solid #d5c9bb;padding-left:10px;margin-left:8px}h1{font-size:23px;font-family:var(--paper);font-weight:700;margin:7px 0 0;letter-spacing:-1px}h1 span{color:#c4ada8;font-weight:400;margin-left:8px}.quiet-button{border:1px solid #ddd6cd;padding:9px 14px;font-size:11px}.toolbar{border:1px solid #e5dfd7;background:#fcfbf8;border-radius:11px;display:flex;justify-content:space-between;align-items:center;height:54px;padding:0 13px;gap:10px;box-shadow:0 2px 3px #89765a03}.date-control{display:flex;align-items:center;gap:9px}.date-control>button{font-size:22px;width:24px;color:#9e9288}.date-control label{position:relative;cursor:pointer;font-size:12px}.date-control input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.date-control input::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:100%;height:100%;cursor:pointer}.date-control small{color:#aaa097;margin-left:6px;font-size:10px}.paper-tabs{display:flex;gap:5px}.paper-tabs button{padding:8px 12px;font-size:11px;color:#9d938b}.paper-tabs .selected{background:#eee8f1;color:#8b779a}.tool-actions{display:flex;border-left:1px solid #e5ded5;padding-left:14px;gap:8px}.tool-actions button{font-size:19px;padding:6px;display:flex;align-items:center;gap:6px}.tool-label{font-size:10px}.desk{position:relative;padding:35px 39px 0;background:radial-gradient(ellipse at 50% 45%,#eae5db55,transparent 70%)}.notebook{--zoom:1;position:relative;display:flex;width:min(100%,1000px);margin:0 auto;background:#f9f7ed;border-radius:4px 12px 12px 4px;box-shadow:0 16px 34px #7b6d5724,0 2px 5px #79654a16;isolation:isolate;transform:scale(var(--zoom));transform-origin:top center;transition:transform .2s}.page{width:50%;aspect-ratio:720/960;position:relative;padding:7% 5.4% 6%;font-family:var(--paper);background-color:#fffcf4;background-image:repeating-linear-gradient(0deg,transparent,transparent 31px,#e7e3d891 31px,#e7e3d891 32px);background-size:100% 32px;background-position:0 12px;overflow:hidden}.left-page{border-radius:4px 0 0 4px;background-image:linear-gradient(90deg,transparent 90%,#b6a48213),repeating-linear-gradient(0deg,transparent,transparent 31px,#e7e3d891 31px,#e7e3d891 32px)}.right-page{border-radius:0 8px 8px 0;background-image:linear-gradient(90deg,#98846413,transparent 9%),repeating-linear-gradient(0deg,transparent,transparent 31px,#e7e3d891 31px,#e7e3d891 32px)}.book-seam{position:absolute;top:0;bottom:0;left:50%;width:25px;transform:translateX(-50%);z-index:3;pointer-events:none;background:linear-gradient(90deg,transparent,#a78c6b18 40%,#86725820 49%,#fff9eb55 54%,transparent)}.book-edge{position:absolute;inset:7px -5px -7px 5px;border-radius:4px 10px 10px 4px;border:1px solid #d9d1c4;background:repeating-linear-gradient(#efebe1 0 2px,#dcd5c9 3px 4px);z-index:-1;box-shadow:2px 2px 0 #d8cbbd}.page-top{display:flex;align-items:center;justify-content:space-between;position:absolute;top:6%;left:11%;right:11%}.page-kicker{font:8px Arial,sans-serif;letter-spacing:2px;color:#a59b8e}.heart{font-size:22px;color:#b4a4bc;line-height:22px}.heart.favorited{color:#c38d9a}.day-heading{display:flex;align-items:center;gap:17px;margin:3% 0 15px}.day-heading>#day-number{font-family:Georgia,serif;font-size:65px;font-weight:400;line-height:1;color:#7d7769}.month-label{font-family:Georgia,serif;font-style:italic;letter-spacing:1px;font-size:19px;color:#a59a87}.weather{display:flex;align-items:center;gap:7px;color:#b09c74;font-size:20px;margin-top:5px}.weather span{font-size:9px;color:#a49b8d}h2{font-size:19px;font-weight:700;line-height:1.7;margin:20px 0 21px;letter-spacing:-.5px}.writing{font-size:12px;line-height:32px;color:#777064;min-height:260px;outline:none;overflow-wrap:anywhere}.page [contenteditable]:focus{outline:1px dashed #b8a9bf88;outline-offset:5px}.little-note{font-family:var(--ui);font-size:10px;background:#eeeddf;color:#92947d;padding:12px 16px;width:90%;transform:rotate(-2deg);margin-top:20px;line-height:1.9;box-shadow:1px 3px 2px #786b4b08}.little-note span{float:right;font-size:19px}.little-note b{font-weight:400;color:#7e806c}.page-number{position:absolute;bottom:3.5%;left:50%;font-family:Georgia,serif;font-size:10px;color:#b6aa97}.small-flower{font-size:27px;color:#d3c3a3}.photo-card{position:absolute;width:66%;padding:10px 10px 0;background:#fffefa;box-shadow:0 3px 8px #76624524;transform:rotate(var(--rotate));z-index:2;touch-action:none}.washi{position:absolute;width:45%;height:25px;background:repeating-linear-gradient(90deg,#cfbed459 0 5px,#c7b3ce50 5px 10px);top:-12px;left:29%;transform:rotate(4deg);clip-path:polygon(3% 0,100% 3%,96% 100%,0 94%);z-index:4}.cafe-scene{aspect-ratio:1.15;background:linear-gradient(0deg,#c7aa8866,#c7aa8800 60%),#ddd2ba;position:relative;overflow:hidden}.window{position:absolute;left:0;top:0;height:66%;width:64%;background:linear-gradient(90deg,#c2c7af77,#eeeaca88),repeating-linear-gradient(90deg,#a0b09b 0 25px,#b4bca3 25px 45px);border-right:9px solid #f1e9d6;border-bottom:9px solid #f1e9d6;box-shadow:4px 5px 12px #624e3d22}.window:after{content:'';position:absolute;top:43%;height:6px;background:#ede7d3;width:100%;box-shadow:65px -40px 0 0 #ede7d3}.sun-patch{position:absolute;width:140%;height:100%;background:#fff9d733;transform:rotate(-37deg);left:-20%;top:53%}.coffee{position:absolute;width:30%;height:29%;background:linear-gradient(90deg,#d7d9c9,#f4f1df 45%,#c9ceba);border-radius:15% 15% 45% 45%;left:24%;bottom:16%;box-shadow:7px 10px 10px #65574033}.coffee:before{content:'';position:absolute;width:130%;height:40%;background:#e8e5d1;left:-15%;bottom:-7%;border-radius:50%;z-index:-1}.coffee:after{content:'';position:absolute;border:7px solid #d4d7c4;border-left:0;width:31%;height:48%;left:95%;top:13%;border-radius:0 50% 50% 0}.coffee span{position:absolute;inset:3px 4px auto;height:25%;background:#ac7850;border-radius:50%;border:3px solid #f3eedb}.coffee span:after{content:'♡';display:block;text-align:center;color:#f3dab8;font-family:Georgia;font-size:22px;line-height:15px}.vase{position:absolute;right:14%;top:43%;width:12%;height:24%;background:#a09074;border-radius:20% 20% 40% 40%}.vase i{position:absolute;bottom:85%;left:40%;width:3px;height:65px;background:#7b8769;transform:rotate(20deg);transform-origin:bottom}.vase i:before{content:'';position:absolute;top:-7px;left:-5px;width:13px;height:14px;background:#cbb47d;border-radius:50%;box-shadow:0 0 0 4px #e2d2aa}.vase i:nth-child(2){transform:rotate(-24deg);height:48px}.vase i:nth-child(3){transform:rotate(0deg);height:75px}.book-art{position:absolute;width:35%;height:20%;background:#a4ac95;right:-5%;bottom:1%;transform:rotate(-18deg);box-shadow:0 3px 0 #e7dfca,0 6px 0 #b0b69d}.photo-caption{font-family:'Nanum Pen Script',var(--paper);text-align:center;font-size:20px;line-height:2.1;min-height:40px;color:#8e8577}.handwritten{position:absolute;top:56%;left:14%;font-family:'Nanum Pen Script',var(--paper);font-size:25px;color:#a28d88;line-height:1.4;transform:rotate(-5deg)}.bunny-sticker{position:absolute;width:29%;transform:rotate(var(--rotate));text-align:center;touch-action:none;z-index:2}.bunny-sticker svg{width:100%;height:auto;aspect-ratio:130/150;filter:drop-shadow(0 2px 1px #5b492012)}.bunny-sticker span{font-family:'Nanum Pen Script',var(--paper);font-size:16px;white-space:nowrap;color:#a68f86}.tiny-stars{position:absolute;left:15%;top:77%;font-size:25px;color:#cbbb8c;transform:rotate(-10deg)}.tiny-stars span{font-size:16px;margin:0 10px}.right-bottom{position:absolute;bottom:11%;left:14%;font-size:10px;color:#a39b8c}.page-tabs{position:absolute;right:-24px;top:10%;display:flex;flex-direction:column;gap:13px;z-index:-2}.page-tabs span{writing-mode:vertical-rl;letter-spacing:4px;padding:15px 7px 15px 8px;font-size:10px;border-radius:0 5px 5px 0;background:#d4c7df;color:#8e7c9b}.page-tabs span+span{background:#e6cabd;color:#ac8a78}.desk-flower{position:absolute;right:10px;top:8px;font-size:55px;color:#d7cab1;transform:rotate(12deg);opacity:.6}.desk-bottom{display:flex;justify-content:space-between;align-items:center;max-width:1000px;margin:22px auto 0;color:#a39a90;font-size:10px;gap:10px}.desk-bottom>span{display:flex;gap:7px;align-items:center}.desk-bottom i{width:5px;height:5px;background:#b8b5a1;border-radius:50%}.desk-bottom>div{display:flex;align-items:center;gap:10px}.desk-bottom button{font-size:15px}footer{display:flex;justify-content:space-between;align-items:center;max-width:1000px;margin:20px auto 22px;font-size:10px;color:#b3a79a}footer>span:first-child{font-family:var(--paper);font-style:italic}.pagination{display:flex;align-items:center;gap:20px;color:#8c8175;font-size:11px}.pagination>button{font-size:18px;padding:5px 8px}.pagination small{margin-left:10px;color:#b0a69a}.pagination .add-page{font-size:10px;border-left:1px solid #ddd4c8;border-radius:0;padding-left:20px}.footer-flower{color:#b9a9c3;font-size:25px}.popover{position:fixed;right:68px;top:224px;background:#fffdf8;border:1px solid #e4dce7;box-shadow:0 8px 35px #5e4b6d20;padding:19px;border-radius:13px;width:265px;z-index:10}.panel-title{display:flex;justify-content:space-between;font-size:12px}.panel-title button{font-size:19px}.sticker-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:15px}.sticker-grid button{font-size:30px;background:#f6f1f3;padding:10px}.popover p{font-size:10px;color:#a4978b;line-height:1.8}.more-panel{width:200px}.more-panel>button{display:block;text-align:left;width:100%;padding:10px;font-size:12px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:#786b7e;color:white;padding:12px 22px;border-radius:24px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:25}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid #e0d6e4;border-radius:17px;background:#fffcf5;color:var(--ink);width:min(90vw,430px);padding:30px;box-shadow:0 20px 80px #5b476626}dialog::backdrop{background:#63587544;backdrop-filter:blur(3px)}dialog h2{margin-top:0}.dialog-close{position:absolute;right:15px;top:10px;font-size:24px}#dialog-body{line-height:2;font-size:13px}#dialog-body textarea,#dialog-body input:not([type=checkbox]):not([type=radio]){width:100%;padding:12px;border:1px solid #ded4e2;border-radius:7px;background:#fffefa;color:var(--ink);font:inherit}#dialog-body textarea{height:200px;resize:vertical}.dialog-action{background:#e8dfed;padding:9px 15px;margin-top:12px;float:right}.movable{cursor:grab}.movable:active{cursor:grabbing}.movable:hover{outline:1px dashed #bfaeca}.added-sticker{position:absolute;font-size:48px;line-height:1.2;z-index:5;touch-action:none;user-select:none}.added-sticker svg{width:90px;height:105px}.uploaded-photo{position:absolute;width:45%;padding:8px 8px 25px;background:#fff;transform:rotate(-4deg);box-shadow:0 2px 10px #68563825;z-index:4;touch-action:none}.uploaded-photo img{width:100%;display:block;pointer-events:none}.dot .page{background-image:radial-gradient(#cfc9bc 1px,transparent 1px);background-size:16px 16px}.plain .page{background-image:none}.single .right-page{display:none}.single .left-page{width:100%}.single.notebook{max-width:500px}.single .book-seam{display:none}.page:empty:before{content:'오늘의 이야기를 적어보세요';color:#b9ada2}.blank-writing{height:85%;font-size:13px;line-height:32px;outline:none}.search-result{display:block;width:100%;text-align:left;padding:12px;border-bottom:1px solid #ece4dd}.search-result small{display:block;color:#a69b90}.mobile-page-nav{display:none}
@media(min-width:1450px){main{padding-left:80px;padding-right:80px}.desk{padding-top:40px}.notebook{max-width:1020px}}
@media(max-width:1150px){main{padding:25px 30px 0}.desk{padding:30px 12px 0}.tool-label{display:none}.page{padding-left:5%;padding-right:5%}.writing{font-size:11px;line-height:28px;min-height:225px}h2{font-size:16px;margin:15px 0}.day-heading>#day-number{font-size:54px}.little-note{margin-top:10px;padding:10px}.photo-caption{font-size:17px}.handwritten{font-size:23px}}
@media(max-width:850px){.brand-sub{display:none}.rail{width:68px}.rail-item{width:52px}main{padding:22px 20px 0}.paper-tabs button{padding:8px}.date-control{gap:2px}.date-control small{display:none}.tool-actions{gap:2px;padding-left:6px}.page{padding-top:8%}.writing{font-size:10px;line-height:25px;min-height:200px}.day-heading{gap:8px;margin-bottom:10px}.day-heading>#day-number{font-size:45px}.month-label{font-size:15px}h2{font-size:14px;margin:8px 0 12px}.little-note{font-size:9px;margin-top:10px;padding:8px}.page-kicker{font-size:6px;letter-spacing:1.3px}.handwritten{font-size:20px}.photo-caption{font-size:14px}.bunny-sticker span{font-size:12px}footer>span:first-child{display:none}.desk-bottom>span{font-size:8px}.popover{right:25px;top:215px}}
@media(max-width:600px){.topbar{height:61px;padding:0 19px}.brand{font-size:22px;gap:7px}.brand-mark{font-size:30px}.saved{font-size:9px}.header-right{gap:12px}.app-layout{min-height:calc(100vh - 61px)}.rail{display:none}main{padding:20px 16px 0}.workspace-heading{margin-bottom:18px}h1{font-size:21px}.eyebrow{font-size:8px}.quiet-button{padding:8px 10px}.toolbar{flex-wrap:wrap;height:auto;min-height:89px;padding:8px 10px;gap:6px}.date-control{order:0}.tool-actions{order:1;border:0;margin-left:auto}.paper-tabs{order:2;width:100%;justify-content:center;border-top:1px solid #eee8df;padding-top:5px}.paper-tabs button{padding:5px 15px}.desk{padding:24px 9px 0 0}.notebook{display:block;max-width:440px}.page{width:100%;padding:17% 11% 10%;aspect-ratio:720/1000}.right-page{display:none}.notebook.mobile-right .left-page{display:none}.notebook.mobile-right .right-page{display:block}.book-seam{display:none}.page-top{top:6%}.day-heading>#day-number{font-size:63px}.day-heading{gap:15px;margin:0 0 19px}.month-label{font-size:20px}.weather span{font-size:10px}h2{font-size:18px;margin:15px 0 20px}.writing{font-size:12px;line-height:30px;min-height:260px}.little-note{font-size:10px;padding:12px;margin-top:16px}.page-kicker{font-size:8px;letter-spacing:1.8px}.photo-caption{font-size:20px}.handwritten{font-size:27px}.bunny-sticker span{font-size:17px}.desk-bottom{margin-top:18px}.desk-bottom>span{max-width:190px;font-size:9px;line-height:1.7}.desk-bottom>div{gap:6px}footer{margin:20px 0}.pagination{gap:10px;margin:auto}.pagination .add-page{padding-left:12px}.footer-flower{display:none}.page-tabs{right:-20px}.page-tabs span{padding:12px 5px;font-size:9px}.popover{top:210px;right:18px}.single .right-page{display:none}.notebook.single.mobile-right .right-page{display:block}.notebook.single.mobile-right .left-page{display:none}}
@media print{body{background:white}.topbar,.rail,.workspace-heading,.toolbar,.desk-bottom,footer,.popover,.toast,.desk-flower,.page-tabs{display:none!important}main,.desk{padding:0;margin:0}.notebook{box-shadow:none;width:100%;display:block;transform:none}.page{width:100%!important;display:block!important;break-after:page;aspect-ratio:720/960;print-color-adjust:exact;-webkit-print-color-adjust:exact}.book-seam,.book-edge{display:none}.app-layout{display:block}.page [contenteditable]{outline:none!important}@page{size:A5;margin:12mm}}
/* Keep the handwritten caption clear of the photo frame. */
.handwritten{top:63%;font-size:23px}
@media(max-width:850px){.handwritten{font-size:20px}}
@media(max-width:600px){.handwritten{font-size:25px}}
.blank-writing:empty:before{content:attr(data-placeholder);color:#b5aa9a;font-family:var(--paper);font-size:12px;pointer-events:none}
button:disabled{opacity:.32;cursor:default}button:disabled:hover{background:none}
