@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Gowun+Batang:wght@400;700&display=swap");
:root{
  --ink:#5f5559;
  --pink:#ef9fbd;
  --pink2:#ffd7e6;
  --paper:#fffdf8;
  --line:#c6adb6;
  --shadow:rgba(87,67,76,.18);
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif;color:var(--ink);background:#fff8fb}
button,input{font:inherit}
button{color:inherit}
.hidden{display:none!important}
body{cursor:url('assets/cursor.png') 18 18, auto}
button,a,input{cursor:url('assets/cursor.png') 18 18, pointer}

.boot-screen,.shutdown,.screensaver{position:fixed;inset:0;z-index:9999;background:#fff9fc;display:grid;place-items:center}
.boot-box{width:min(560px,86vw);border:1px solid #ccbac2;background:rgba(255,255,255,.86);box-shadow:0 12px 45px var(--shadow);padding:22px}
.boot-title{font-weight:700;font-size:clamp(24px,4vw,38px);margin-bottom:18px;color:#8c6275;letter-spacing:.6px}
#bootLog{min-height:150px;white-space:pre-wrap;line-height:1.7;font-size:13px}

.desktop{position:relative;width:100vw;height:100dvh;min-height:0;background-image:linear-gradient(rgba(255,255,255,.16),rgba(255,255,255,.16)),url('assets/desktop-bg.jpg');background-size:cover;background-position:center;isolation:isolate;overflow:hidden}
.desktop::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 56% 45%,transparent 0 55%,rgba(255,255,255,.28) 100%);z-index:-1}

.desktop-icons{position:absolute;left:20px;top:20px;bottom:24px;width:150px;display:flex;flex-direction:column;justify-content:flex-start;gap:8px;z-index:10}
.folder-icon{border:0;background:transparent;width:128px;padding:0;display:flex;flex-direction:column;align-items:center;gap:1px;text-shadow:0 1px #fff;transition:.12s transform}
.folder-icon:hover{transform:translateY(-2px) scale(1.02)}
.folder-icon.nudge{margin-left:8px}
.folder-icon img{width:95px;height:78px;object-fit:contain;filter:drop-shadow(0 5px 4px rgba(87,67,76,.12))}
.folder-icon span{font-size:14px;letter-spacing:.8px;font-weight:600;background:rgba(255,255,255,.55);padding:1px 4px;font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif}

.window-lite{background:rgba(255,255,255,.72);border:1px solid rgba(143,111,126,.55);box-shadow:4px 5px 0 rgba(229,188,205,.44),0 10px 24px var(--shadow);backdrop-filter:blur(3px)}
.system-panel{position:absolute;right:30px;top:24px;width:200px;padding:15px 17px;z-index:12;line-height:1.7}
.system-panel::before{content:"";position:absolute;top:-8px;left:-8px;width:26px;height:26px;background:#f6aec9;border-radius:60% 30% 50% 40%;transform:rotate(-25deg);opacity:.82}
.system-line{font-size:15px;letter-spacing:.6px;font-weight:500;font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif}
.text-button,.exit-link{border:0;background:transparent;padding:0;text-decoration:none}
.text-button:hover,.exit-link:hover{text-decoration:underline;color:#d46491}
.exit-link{display:block;margin-top:5px;color:#c35483}

.desktop-object{position:absolute;border:0;background:transparent;padding:0;z-index:7;filter:drop-shadow(0 9px 8px rgba(84,66,74,.13));transition:.15s transform,.15s filter}
.desktop-object:hover{transform:translateY(-3px) rotate(-1deg);filter:drop-shadow(0 12px 10px rgba(84,66,74,.18))}
.desktop-object img{display:block;width:100%;height:100%;object-fit:contain}
 .memo-object{right:5vw;top:24%;width:min(280px,24vw);height:min(360px,36vh);z-index:6;pointer-events:none}
.memo-object img{opacity:.95;pointer-events:none;user-select:none}
.memo-text{position:absolute;left:24%;right:15%;top:40%;font-size:clamp(14px,1.2vw,19px);line-height:1.28;font-weight:700;color:#7e626a;transform:rotate(-1deg);word-break:break-all;overflow-wrap:anywhere;text-align:left;pointer-events:none}
.memo-hitbox{position:absolute;left:23%;right:12%;top:33%;bottom:13%;border:0;background:transparent;padding:0;pointer-events:auto;z-index:3}
.bottle-object{left:43%;bottom:5%;width:min(180px,15vw);height:260px;transform:rotate(-7deg)}
.bottle-object:hover{transform:translateY(-3px) rotate(-9deg)}
.cassette-object{left:58%;bottom:6%;width:min(210px,18vw);height:190px}
.jukebox-object{right:3.5%;bottom:2%;width:min(300px,25vw);height:250px}
#jukeboxState{position:absolute;left:50%;bottom:-4px;transform:translateX(-50%);background:rgba(255,255,255,.75);padding:2px 8px;font-size:13px;white-space:nowrap;font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif}
.ambient-object{position:absolute;left:35%;top:55%;opacity:.58;z-index:1;transform:rotate(-8deg);user-select:none;pointer-events:none}
.ambient-star{font-size:44px;color:#c58aa5}.ambient-label{font-size:9px;display:block;margin-left:12px;margin-top:-10px}

.ppimppi-placeholder{border:1px dashed #bd8da4;background:rgba(255,255,255,.62);color:#a17789;display:grid;place-items:center;text-align:center;padding:10px}

.calendar-widget{position:absolute;right:28%;top:16%;width:230px;padding:9px;z-index:5}
.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px;color:#8b6877}
.calendar-header button{width:25px;height:22px;border:1px solid #d6b8c6;background:#fff9fc}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.weekdays{font-size:9px;margin-bottom:4px;color:#aa8192}
.days button{height:24px;border:0;background:rgba(255,255,255,.56);font-size:10px;position:relative}
.days button.today{outline:2px solid #e690b0;border-radius:50%}
.days button.has-event::after{content:"";width:4px;height:4px;border-radius:50%;background:#ed90b5;position:absolute;bottom:2px;left:50%;transform:translateX(-50%)}

.app-window{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(900px,88vw);height:min(760px,83dvh);z-index:100;background:rgba(255,255,255,.94);border:1px solid #9b858e;box-shadow:8px 10px 0 rgba(234,197,212,.65),0 18px 60px rgba(88,66,76,.3);overflow:hidden}
.titlebar{height:34px;background:linear-gradient(90deg,#f6a7c4,#ffd8e6);border-bottom:1px solid #aa8d99;display:flex;align-items:center;justify-content:space-between;padding:0 8px;font-weight:bold;letter-spacing:.8px;user-select:none}
.titlebar button{width:25px;height:23px;border:1px solid #9f7f8c;background:#fff5fa}
.window-content{height:calc(100% - 34px);overflow:auto;padding:20px;background-image:linear-gradient(rgba(255,255,255,.84),rgba(255,255,255,.84)),url('assets/desktop-bg.jpg');background-size:700px auto}
.profile-layout{display:grid;grid-template-columns:250px 1fr;gap:24px}
.portrait{height:330px;margin-bottom:12px}.profile-facts{margin:0}.profile-facts>div{display:flex;border-bottom:1px dotted #c9aeb9;padding:6px 0}.profile-facts dt{width:62px;font-weight:bold}.profile-facts dd{margin:0}.profile-copy{font-size:14px;line-height:1.72}.profile-copy h3{font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif;color:#a66180;margin:22px 0 6px;font-weight:700;letter-spacing:.2px}

.dream-page{font-size:14px;line-height:1.68}.dream-intro{padding:14px;border:1px dashed #d4a9bb;background:#fff8fb;margin-bottom:16px}.dream-page details{margin:9px 0;border:1px solid #dbc3cd;background:rgba(255,255,255,.72)}.dream-page summary{padding:9px 12px;font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif;font-weight:700;cursor:pointer;letter-spacing:.2px}.dream-page article{border-top:1px dotted #dbc3cd;padding:8px 14px 12px}.dream-page h4{margin:3px 0 5px}.dream-page p{margin:0 0 5px}.tags{font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif;color:#b3597f;font-size:12px;word-break:break-all}

.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-content:start}.gallery-card{border:1px solid #cbaeb9;background:#fff9fc;padding:8px;text-align:left}.gallery-placeholder{aspect-ratio:1/1;background:linear-gradient(135deg,#ffe6ef,#fff);display:grid;place-items:center;border:1px dashed #d4a9ba;color:#aa7c8f;margin-bottom:7px}.gallery-card span{font-size:11px}

.guestbook-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:16px}.guestbook-toolbar button,.login-actions button{border:1px solid #b99aa8;background:#fff3f8;padding:5px 12px}.guestbook-toolbar span{font-size:11px}.guest-entry{border:1px solid #cab0ba;background:rgba(255,255,255,.78);padding:12px;margin-bottom:12px}.guest-entry header{display:flex;gap:10px;align-items:center;font-size:11px}.guest-entry header strong{flex:1}.dots{border:0;background:transparent;font-size:18px}.owner-reply{margin:10px 0 0 24px;border-left:3px solid #f0b1c9;padding:6px 10px;background:#fff7fb;font-size:12px}.backend-note{font-size:10px;color:#8f7781;margin-top:12px;padding:8px;border:1px dashed #cdb4be;background:rgba(255,255,255,.55)}

.log-entry{border-bottom:1px dotted #c8aeb9;padding:12px 0;font-size:13px}.log-entry p{margin:0 0 9px}.log-image-placeholder{width:180px;height:110px;display:grid;place-items:center;background:#ffeaf2;border:1px dashed #d3a9ba;color:#9e7184}

.modal-backdrop{position:fixed;inset:0;background:rgba(98,75,84,.24);z-index:500;display:grid;place-items:center;padding:20px}.modal-card{position:relative;width:min(560px,88vw);max-height:82dvh;overflow:auto;background:#fffdfd;border:1px solid #a98c98;box-shadow:8px 8px 0 rgba(242,195,213,.7);padding:24px;line-height:1.7}.modal-x{position:absolute;right:8px;top:7px;border:1px solid #bc9da9;background:#fff5f9}.modal-card blockquote{margin:10px 0;padding:12px 14px;border-left:4px solid #eaa8c1;background:#fff6fa;white-space:pre-wrap}.login-card{font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif}.login-card h2{font-size:19px;font-weight:700}.login-card label{display:block;font-size:13px;margin:10px 0}.login-card input{display:block;width:100%;margin-top:4px;padding:8px;border:1px solid #c8acb7;background:#fffafd}.login-actions{display:flex;gap:8px;margin-top:13px}.signup-fields p{font-size:10px;line-height:1.5}

.popup-system{font-family:"Cormorant Garamond","Gowun Batang","Iropke Batang","Nanum Myeongjo","Times New Roman",serif}.popup-system h3{font-size:18px;margin:0 0 12px;font-weight:700}.popup-button{margin-top:14px;border:1px solid #a88d98;background:#fff1f7;padding:5px 16px}

.shutdown{background:#171216;color:#ffe9f2}.shutdown button{border:0;background:transparent;color:#ffdce9;font-size:24px;letter-spacing:1px}
.screensaver{background:#fff5fa;color:#bd6087;align-content:center;text-align:center;gap:14px}.error-code{font-size:clamp(92px,20vw,240px);line-height:.75;font-weight:bold;opacity:.18;position:absolute}.error-ppimppi{width:260px;height:210px;z-index:2;background:rgba(255,255,255,.7)}.error-text,.error-sub{z-index:2}.error-text{font-size:20px}.error-sub{font-size:11px}

@media (min-width:801px) and (max-width:1366px) and (max-height:850px){
  .bottle-object{bottom:12%;}
  .cassette-object{bottom:13%;}
  .jukebox-object{bottom:9%;}
  #jukeboxState{bottom:-2px;}
}

@media (max-width:800px){
  .desktop-icons{left:8px;top:12px;width:92px;gap:3px}.folder-icon{width:86px}.folder-icon img{width:66px;height:54px}.folder-icon span{font-size:9px}
  .system-panel{right:8px;top:10px;width:145px;padding:10px;font-size:10px}.system-line{font-size:10px}
  .memo-object{right:2vw;top:22%;width:180px;height:235px}.memo-text{left:24%;right:15%;top:40%;font-size:16px;line-height:1.22}.memo-hitbox{left:23%;right:12%;top:33%;bottom:13%}
  .calendar-widget{right:4%;top:48%;width:180px}.bottle-object{left:24%;bottom:4%;width:105px;height:160px}.cassette-object{left:48%;bottom:3%;width:130px;height:120px}.jukebox-object{right:0;bottom:0;width:170px;height:145px}
  .app-window{width:94vw;height:86dvh}.profile-layout{grid-template-columns:1fr}.portrait{height:220px}.gallery-grid{grid-template-columns:repeat(2,1fr)}
}




/* v7 desktop pet */
.desktop-pet{position:fixed;left:0;top:0;width:116px;height:116px;will-change:transform;z-index:35;touch-action:none;user-select:none;cursor:grab;filter:drop-shadow(0 3px 3px rgba(100,70,80,.12))}
.desktop-pet.dragging{cursor:grabbing}
.pet-sprite{position:absolute;inset:0;transform-origin:50% 90%;pointer-events:none}
.pet-body,.pet-leg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none}
.pet-body{z-index:2}
.pet-leg{z-index:1}.pet-leg-back{transform:translateX(-4px)}.pet-leg-front{transform:translateX(4px) scaleX(-1)}
/* v7.6: planted-foot gait. The feet slide back during contact, lift briefly, then swing forward. */
.desktop-pet.walking .pet-sprite{animation:petBob .44s ease-in-out infinite}
.desktop-pet.walking .pet-leg-back{animation:petStepBack .44s ease-in-out infinite}
.desktop-pet.walking .pet-leg-front{animation:petStepFront .44s ease-in-out infinite}
.pet-bubble{position:absolute;left:50%;bottom:94%;transform:translateX(-50%);min-width:76px;max-width:170px;padding:7px 10px;background:rgba(255,255,255,.94);border:1px solid #dcb6c5;box-shadow:2px 3px 0 rgba(191,145,164,.12);font-family:"Gowun Batang","Nanum Myeongjo",serif;font-size:13px;line-height:1.25;color:#6f5860;text-align:center;white-space:nowrap;z-index:5;pointer-events:none}
.pet-bubble:after{content:"";position:absolute;left:50%;top:100%;margin-left:-5px;border:5px solid transparent;border-top-color:#dcb6c5}
@keyframes petBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-1px)}}
@keyframes petStepBack{0%,100%{transform:translateX(-5px)}50%{transform:translateX(2px)}}
@keyframes petStepFront{0%,100%{transform:translateX(5px) scaleX(-1)}50%{transform:translateX(-2px) scaleX(-1)}}
@media(max-width:700px){.desktop-pet{width:92px;height:92px}.pet-bubble{font-size:12px;max-width:145px}}
@media(prefers-reduced-motion:reduce){.desktop-pet.walking .pet-sprite,.desktop-pet.walking .pet-leg-back,.desktop-pet.walking .pet-leg-front{animation:none}}

/* v7.10: mirror the leg gait only when walking left */
.desktop-pet.dir-left.walking .pet-leg-back{animation-name:petStepBackLeft}
.desktop-pet.dir-left.walking .pet-leg-front{animation-name:petStepFrontLeft}
@keyframes petStepBackLeft{0%,100%{transform:translateX(5px)}50%{transform:translateX(-2px)}}
@keyframes petStepFrontLeft{0%,100%{transform:translateX(-5px) scaleX(-1)}50%{transform:translateX(2px) scaleX(-1)}}

/* v7.11: left gait refinement — same rhythm, shorter stride */
@keyframes petStepBackLeftSoft{0%,100%{transform:translateX(3px)}50%{transform:translateX(-1px)}}
@keyframes petStepFrontLeftSoft{0%,100%{transform:translateX(-3px) scaleX(-1)}50%{transform:translateX(1px) scaleX(-1)}}
.desktop-pet.dir-left.walking .pet-leg-back{animation-name:petStepBackLeftSoft}
.desktop-pet.dir-left.walking .pet-leg-front{animation-name:petStepFrontLeftSoft}

/* v7.12: left gait — keep both feet parallel instead of mirroring one into a V. */
@keyframes petStepBackLeftParallel{0%,100%{transform:translateX(-2px)}50%{transform:translateX(2px)}}
@keyframes petStepFrontLeftParallel{0%,100%{transform:translateX(2px)}50%{transform:translateX(-2px)}}
.desktop-pet.dir-left .pet-leg-back{transform:translateX(-2px)}
.desktop-pet.dir-left .pet-leg-front{transform:translateX(2px)}
.desktop-pet.dir-left.walking .pet-leg-back{animation-name:petStepBackLeftParallel}
.desktop-pet.dir-left.walking .pet-leg-front{animation-name:petStepFrontLeftParallel}


/* v7.13: left gait is now an exact mirror of the proven right gait.
   The body still uses the hand-drawn directional image; only the complete leg rig is mirrored. */
.pet-legs{position:absolute;inset:0;transform-origin:50% 50%;pointer-events:none;z-index:1}
.pet-body{z-index:2}
.pet-leg{z-index:auto}
.desktop-pet.dir-left .pet-legs{transform:scaleX(-1)}
.desktop-pet.dir-left .pet-leg-back{transform:translateX(-4px)}
.desktop-pet.dir-left .pet-leg-front{transform:translateX(4px) scaleX(-1)}
.desktop-pet.dir-left.walking .pet-leg-back{animation-name:petStepBack}
.desktop-pet.dir-left.walking .pet-leg-front{animation-name:petStepFront}
.admin-badge{margin-left:8px;font-size:10px;border:1px solid #b99aa8;background:#fff3f8;padding:2px 6px}.admin-actions{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}.admin-actions button,.admin-btn{border:1px solid #b99aa8;background:#fff3f8;padding:3px 8px;font:inherit;font-size:11px}.guestbook-form textarea{width:100%;min-height:90px;padding:8px;border:1px solid #c8acb7;background:#fffafd;resize:vertical}.guestbook-form input{width:100%;padding:7px;border:1px solid #c8acb7;background:#fffafd}.auth-status{font-size:11px;margin-top:10px;white-space:pre-wrap}.admin-only{display:none}.is-admin .admin-only{display:inline-block}


/* v8.3 admin control panel */
.control-panel{font-family:"Cormorant Garamond","Gowun Batang","Nanum Myeongjo",serif}.control-panel h2{margin:0 0 10px;font-size:20px}.cp-tabs{display:flex;gap:5px;flex-wrap:wrap;border-bottom:1px solid #d7bdc7;padding-bottom:8px;margin-bottom:12px}.cp-tabs button,.cp-body button{border:1px solid #b99aa8;background:#fff3f8;padding:5px 9px;font:inherit}.cp-body{min-height:220px}.cp-editor{display:grid;gap:7px;padding:10px;border:1px dashed #cdb4be;background:#fffafd;margin-bottom:12px}.cp-editor input,.cp-editor textarea{width:100%;padding:7px;border:1px solid #c8acb7;background:#fff}.cp-editor textarea{min-height:80px;resize:vertical}.cp-row{display:flex;align-items:center;gap:8px;border-bottom:1px dotted #d4bcc6;padding:8px 2px}.cp-row span{flex:1;min-width:0;word-break:break-word}.cp-stack{align-items:flex-start}.is-admin #controlPanelBtn{display:block;margin-top:6px}.system-panel #controlPanelBtn{font-size:10px}
