/* Launch refinement: 2017 iPhone 7-inspired appearance. */
html,body,button,input,textarea{font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif!important}
.phone{border-radius:48px;background:linear-gradient(95deg,#c9c9ce 0%,#f9f9fa 10%,#f7f7f9 87%,#c7c7cf 100%);border:2px solid #c4c4c9;box-shadow:0 26px 70px #1f20302c,0 1px 7px #0002,inset 0 0 0 2px #fff7}
.screen{border-radius:2px;box-shadow:0 0 0 1px #3335}
.earpiece{height:4px;width:48px;background:linear-gradient(#44474c,#85878b);box-shadow:inset 0 0 0 1px #595c61}
.front-camera{width:9px;height:9px;background:#1d2530;box-shadow:inset 0 0 0 2px #667587,0 0 0 1px #ddd}
.top-bezel::before{content:'';position:absolute;top:16px;left:calc(50% - 3px);width:6px;height:6px;background:#272b31;border-radius:50%;opacity:.7}
.hardware-home{width:48px;height:48px;border:2px solid #c4c6cc;background:linear-gradient(135deg,#f7f7f8,#eaeaec);box-shadow:inset 0 0 0 2px #fefeff,0 0 0 1px #a8abb2}
.hardware-home span{display:none}
.phone.prestart .top-bezel{visibility:hidden}
.phone.prestart .top-bezel::before{display:none}
.home-view .app-icon-wrap:disabled{cursor:default;opacity:1}
.home-view .app-icon-wrap:disabled .app-square{filter:none}
/* The following photograph was uploaded to Unsplash on 2017-08-23 by Xinyi Wen. No AI imagery. */
.wallpaper{background:linear-gradient(180deg,#211a2c35 0%,#0000 44%,#12112560 100%),url('https://images.unsplash.com/photo-1503455637927-730bce8583c0?auto=format&fit=crop&w=1000&q=85') center center/cover no-repeat!important}
.today-view::before{background:url('https://images.unsplash.com/photo-1503455637927-730bce8583c0?auto=format&fit=crop&w=1000&q=85') center center/cover no-repeat!important}
/* lock screen stacked iOS 10 notifications */
.lock-notification[hidden]{display:none!important}
.lock-notifications-2017{position:absolute;left:8px;right:8px;top:222px;display:flex;flex-direction:column;gap:6px;max-height:53%;overflow-y:auto;z-index:7}
.lock-alert-2017,.phone-live-banner{border:0;background:#fafafae8;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-radius:13px;width:100%;display:flex;gap:10px;align-items:center;min-height:66px;padding:11px;text-align:left;color:#20242b;text-shadow:none;box-shadow:0 3px 12px #0002}
.notice-icon-2017{background:#f8db22;border-radius:7px;width:36px;height:36px;display:grid;place-items:center;flex:none;color:#473a16;font-size:13px;font-weight:900}
.notice-msg-2017{min-width:0;display:flex;flex-direction:column;gap:4px;flex:1;line-height:1.15}
.notice-msg-2017 b{font-size:12px;font-weight:700}
.notice-msg-2017 small{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#525865}
.notice-now-2017{font-size:10px;color:#858994;align-self:flex-start}
.phone-live-banner{position:absolute;top:27px;left:9px;width:calc(100% - 18px);z-index:92;opacity:0;transform:translateY(-90px);transition:transform .23s ease,opacity .2s ease}
.phone-live-banner.visible{opacity:1;transform:translateY(0)}
.passcode-2017[hidden]{display:none!important}
.passcode-2017{position:absolute;inset:0;z-index:94;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(#23335572,#1c2d5577),url('https://images.unsplash.com/photo-1503455637927-730bce8583c0?auto=format&fit=crop&w=1000&q=85') center/cover;color:white;backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px)}
.passcode-heading{display:flex;flex-direction:column;align-items:center;gap:7px;margin:40px 0 12px;text-shadow:0 1px 5px #0009}
.passcode-heading b{font-size:19px;font-weight:500}.passcode-heading small{font-size:12px}
.passcode-dots{display:flex;gap:13px;margin:10px 0 30px}
.passcode-dots i{display:block;width:12px;height:12px;border:1px solid #fff;border-radius:50%}
.passcode-dots i.filled{background:#fff}
.passcode-grid{width:260px;display:grid;grid-template-columns:repeat(3,1fr);justify-items:center;gap:13px 10px}
.passcode-grid button{width:65px;height:65px;border-radius:50%;border:0;background:#ffffff47;color:white;font-size:26px;font-weight:300;backdrop-filter:blur(3px)}
.passcode-grid button:active{background:#ffffff90}
.passcode-cancel{margin-top:18px;border:0;background:none;color:#fff;padding:8px 20px;font-size:13px}
.passcode-2017.wrong .passcode-dots{animation:pass-shake .33s ease}
@keyframes pass-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-10px)}40%{transform:translateX(10px)}60%{transform:translateX(-8px)}80%{transform:translateX(8px)}}
.empty-gallery{text-align:center;color:#8f929a;font-size:13px;padding:80px 20px;grid-column:1/-1}
.music2017{background:#fafafa;min-height:100%;color:#1f2530;text-align:left}
.music2017 .app-nav{background:#fff}
.music2017-top{font-size:31px;letter-spacing:-.04em;font-weight:800;padding:22px 17px 10px;background:white}
.music2017-label{padding:12px 16px;font-size:18px;font-weight:700;background:white;border-bottom:1px solid #eee}
.music2017-label small{font-weight:400;color:#9298a0;font-size:12px;margin-left:8px}
.music2017-track{display:flex;align-items:center;gap:12px;background:white;padding:14px 15px}
.music2017-cover{background:#252328;color:#ede2d3;width:63px;height:63px;flex:none;display:flex;flex-direction:column;justify-content:center;align-items:center;line-height:1.1}
.music2017-cover span{font-size:10px;letter-spacing:4px}
.music2017-cover b{font-size:13px;line-height:1.3;text-align:center}
.music2017-track>div:last-child{display:flex;flex-direction:column;gap:6px;min-width:0}
.music2017-track>div:last-child b{font-size:15px;font-weight:600}
.music2017-track>div:last-child small{font-size:11px;color:#8f95a1}
.music2017-now{display:flex;align-items:center;flex-direction:column;margin:25px 15px 0;padding:20px 0;background:#fff}
.music2017-vinyl{height:140px;width:140px;background:radial-gradient(circle at center,#d2bca2 0 14%,#111 15% 18%,#1b1c1e 19% 40%,#090909 42%);box-shadow:0 8px 30px #0003;color:#e7cba9;display:grid;place-items:center;border-radius:6px;margin:0 0 18px;font-size:16px;font-weight:bold;letter-spacing:5px}
.music2017-now>b{font-size:17px}.music2017-now>small{font-size:12px;margin-top:6px;color:#888}
.music2017-controls{width:190px;display:flex;align-items:center;justify-content:space-between;margin:23px auto 7px}
.music2017-controls button{background:none;border:0;color:#fa315e;font-size:25px;padding:8px 12px}
.music2017-help{color:#90949c;font-size:10px;padding-bottom:10px}
@media(max-height:730px){.passcode-grid{gap:6px}.passcode-grid button{width:56px;height:56px}.passcode-heading{margin-top:25px}.passcode-dots{margin-bottom:16px}}

.music2017-track{width:100%;border:0;cursor:pointer;text-align:left;font-family:inherit}

/* A smooth, persistent iOS-10-style lock-screen notification stack. */
.lock-notifications-2017 { gap:5px; overflow:hidden; }
.lock-alert-2017 { animation:jkNoticeIn .46s cubic-bezier(.21,.79,.23,1) both; flex-shrink:0; }
.lock-alert-2017:active,.phone-live-banner:active { filter:brightness(.96); }
.lock-alert-2017,.phone-live-banner { -webkit-tap-highlight-color:transparent; }
.notice-msg-2017 small { white-space:normal; line-height:1.35; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.notice-msg-2017 small strong { color:#262a32; font-weight:600; }
.phone-live-banner { transition:transform .34s cubic-bezier(.23,.83,.3,1), opacity .32s ease; }
@keyframes jkNoticeIn { from { opacity:0; transform:translateY(-17px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) { .lock-alert-2017 { animation:none; } .phone-live-banner { transition:none; } }


/* 2017 iOS 10 — KakaoTalk notification uses the ACTUAL saved KakaoTalk icon,
   not a made-up yellow '톡' square and not a sender avatar. */
.lock-alert-2017,.phone-live-banner{
  display:block!important;position:relative;min-height:77px!important;padding:10px 12px!important;
  border-radius:11px!important;background:rgba(247,247,250,.87)!important;
  border:1px solid rgba(255,255,255,.64)!important;
  box-shadow:0 2px 5px rgba(0,0,0,.10)!important;color:#292a2f!important;
  -webkit-backdrop-filter:blur(18px) saturate(125%);backdrop-filter:blur(18px) saturate(125%);
}
.lock-notifications-2017{gap:5px!important;top:216px}
.notice-header-2017{display:flex;align-items:center;gap:5px;width:100%;height:20px;line-height:20px}
.notice-header-2017>b{font-size:11px;font-weight:600;color:#646670;letter-spacing:-.02em}
.notice-icon-2017{display:block!important;position:relative;flex:0 0 18px!important;width:18px!important;height:18px!important;
  border-radius:4px!important;background:#fee500 url('assets/Kakaotalk.jpg') center/110% 110% no-repeat!important;
  overflow:hidden;font-size:0!important;box-shadow:0 0 0 1px #0000000c}
.notice-now-2017{margin-left:auto;font-size:10px!important;color:#777986!important;line-height:19px;align-self:auto!important}
.notice-msg-2017{display:flex!important;flex-direction:column!important;gap:2px!important;min-width:0;
  padding:6px 2px 0 2px;line-height:1.24!important}
.notice-msg-2017 strong{display:block;font-size:12px!important;font-weight:650;color:#202126;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.notice-msg-2017 small{font-size:11.5px!important;color:#35363a!important;line-height:1.3!important;overflow:hidden;
  display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.phone-live-banner{position:absolute!important;top:26px!important;left:9px!important;width:calc(100% - 18px)!important;z-index:92}
/* When a profile photograph cannot load, use a neutral Kakao-like default person,
   never a large initial/emoji in a candy-coloured circle. */
.portrait-avatar{background:#d8d9dc!important;border-radius:50%!important;overflow:hidden!important}
.portrait-avatar>span{font-size:0!important;position:absolute!important;inset:0;color:transparent!important;overflow:hidden}
.portrait-avatar>span::before{content:'';position:absolute;top:19%;left:34%;width:32%;height:32%;background:#f3f3f4;border-radius:50%}
.portrait-avatar>span::after{content:'';position:absolute;left:17%;bottom:-21%;width:66%;height:63%;border-radius:50% 50% 0 0;background:#f3f3f4}
.portrait-avatar>img{border-radius:50%!important;z-index:2}

/* Gallery-only refinement. No photo caption, dates, or explanation anywhere. */
.ios10-gallery { background: #fff; min-height:100%; }
.ios10-gallery .app-nav { background: #f9f9fa; border-bottom:1px solid #dedee1; }
.ios10-gallery .photo-album-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2px; padding:2px 0 12px; }
.ios10-gallery .gallery-photo { margin:0; padding:0; border:0; width:100%; aspect-ratio:1; background:#f2f2f4; overflow:hidden; cursor:pointer; }
.ios10-gallery .gallery-photo img { display:block; width:100%; height:100%; object-fit:cover; }
.ios10-gallery .gallery-photo.gallery-unloaded { background:#e6e6e6; }
.ios10-gallery-viewer {position:absolute; inset:0; z-index:95; padding:0; background:#111; color:#fff; display:flex; align-items:center; justify-content:center; gap:0; touch-action:pan-y; }
.ios10-gallery-viewer img.gallery-full-image {width:100%; max-width:100%; height:auto; max-height:100%; object-fit:contain; user-select:none; -webkit-user-select:none;}
.ios10-gallery-viewer .photo-close { position:absolute; top:32px; left:12px; right:auto; z-index:2; display:flex; justify-content:center; align-items:center; width:36px; height:36px; padding:0 0 5px; border-radius:50%; background:#0008; color:white; border:0; font-size:38px; font-weight:200; cursor:pointer; }


/* FRAMELESS READER MODE — mobile content only, not a physical iPhone mockup. */
html,body{height:100%!important;min-height:100%!important;overflow:hidden!important}
body{margin:0!important;background:#eeeef2!important}
.page-frame{width:100%!important;height:100dvh!important;min-height:100dvh!important;padding:0!important;gap:0!important;display:flex!important;justify-content:center!important;align-items:stretch!important}
.page-heading,.page-note{display:none!important}
.phone{position:relative!important;width:100vw!important;max-width:430px!important;height:100dvh!important;min-height:0!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important}
.phone .top-bezel{display:none!important}
.phone .screen{width:100%!important;height:100%!important;min-height:0!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
/* Keep the existing home action accessible without showing a handset frame. */
.phone .bottom-bezel{position:absolute!important;z-index:100!important;bottom:0!important;left:0!important;right:0!important;height:45px!important;display:flex!important;justify-content:center!important;align-items:center!important;background:transparent!important;pointer-events:none!important}
.phone .hardware-home{width:33px!important;height:33px!important;border-radius:50%!important;border:1.5px solid #ffffff88!important;background:#28263245!important;box-shadow:0 1px 7px #00000025!important;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:auto!important;touch-action:manipulation}
.phone .hardware-home>span{width:12px!important;height:12px!important;border-color:#ffffffb3!important}
.home-view{padding-bottom:54px!important}
.lock-view .unlock-zone{bottom:63px!important}
.lock-view .lock-camera{bottom:62px!important}
.ios10-gallery-viewer{touch-action:pan-y!important;user-select:none!important;-webkit-user-select:none!important;cursor:grab}
.ios10-gallery-viewer:active{cursor:grabbing}
.ios10-gallery-viewer .gallery-full-image{pointer-events:none!important;-webkit-user-drag:none!important}
@media(min-width:431px){body{background:#dad8de!important}}

/* 2026-10-23 Reader-approved layout: dock flush against white iPhone 7 home bezel. */
.phone .screen{height:calc(100% - 62px)!important;overflow:hidden!important}
.phone .bottom-bezel{height:62px!important;bottom:0!important;background:#f8f8f9!important;border-top:1px solid #e5e5e8!important;pointer-events:none!important}
.phone .hardware-home{width:40px!important;height:40px!important;background:#f8f8f9!important;border:2px solid #b9b9bf!important;border-radius:50%!important;box-shadow:inset 0 0 0 2px #fff!important;backdrop-filter:none!important;pointer-events:auto!important}
.home-view{padding-bottom:0!important}
.home-view .dock{margin-bottom:0!important;margin-top:auto!important;flex-shrink:0!important}
.home-view .page-dots{padding-bottom:8px!important;margin-bottom:0!important}
/* Same user's original photo on both lock/home and Today View. Falls back to existing local wallpaper until image is copied. */
.wallpaper{background-image:linear-gradient(180deg,rgba(5,6,10,.24),rgba(5,6,10,.02) 40%,rgba(5,6,10,.12)),url('assets/reader_wallpaper.png'),url('assets/reader_wallpaper.jpg'),url('assets/reader_wallpaper.webp'),url('assets/poodle_wallpaper.jpg')!important;background-size:cover!important;background-position:center,center,center!important}
.today-view::before{background-image:linear-gradient(180deg,#0002,#0002),url('assets/reader_wallpaper.png'),url('assets/reader_wallpaper.jpg'),url('assets/reader_wallpaper.webp'),url('assets/poodle_wallpaper.jpg')!important;background-position:center!important;background-size:cover!important}
.kakao-photo-message{display:block;max-width:200px;max-height:255px;width:auto;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 2px 5px #0002;background:#e5e5e5}
.image-message-line{align-items:flex-end}

/* v3 wallpaper: ONE local file, no old landscape beneath it. */
.wallpaper {background: url("assets/reader_wallpaper.jpg") center center/cover no-repeat !important;background-color:#fff !important;opacity:1!important;}
.today-view::before{background:url("assets/reader_wallpaper.jpg") center center/cover no-repeat !important;}
.home-view .dock {margin-top:auto!important;margin-bottom:0!important;}
.home-view .page-dots {bottom:100px!important;}
/* Reinforce equal app/screen width and flush dock-to-home-control seam. */
.phone .screen{height:calc(100% - 62px)!important;}
.phone .bottom-bezel{bottom:0!important;height:62px!important;background:#f8f8f9!important;}

/* Publish-day: PIN keypad uses the SAME local wallpaper as lock and home. */
.passcode-2017{background:linear-gradient(180deg,rgba(0,0,0,.20),rgba(0,0,0,.32)),url("assets/reader_wallpaper.jpg") center center/cover no-repeat!important;background-color:#fff!important;}

/* 게시용 v6 · 정해진 카톡 답장 버튼 */
.kakao-reply-dock{padding:9px 12px 11px;background:#f7f7f7;border-top:1px solid #dfdfdf;display:flex;gap:7px;flex-direction:column;flex-shrink:0}
.kakao-reply-dock small{color:#717b84;font-size:10px;letter-spacing:.015em}
.kakao-preset-reply{display:flex;align-items:center;justify-content:space-between;gap:10px;border-radius:13px;border:1px solid #dedede;background:#fee500;color:#252018;padding:11px 13px;text-align:left;font-size:13px;font-family:inherit;cursor:pointer;min-height:42px;max-width:100%}
.kakao-preset-reply span{flex-shrink:0;font-size:16px}
.kakao-preset-reply:active{filter:brightness(.94)}
