:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",sans-serif;color:#f4f5fc;background:#080c16;font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;width:100%}
body{overflow-x:hidden}
button{font:inherit;cursor:pointer}
button:focus-visible{outline:2px solid #a8c5ff;outline-offset:4px}
button{-webkit-tap-highlight-color:transparent}
.page-glow{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 47% 39%,#273153 0,#151d34 29%,#0b1120 55%,#070b13 80%);opacity:.95}
.stage{position:relative;min-height:100svh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:32px 16px 18px;gap:14px}
.phone{position:relative;width:min(100%,410px);height:min(835px,calc(100svh - 95px));min-height:min(640px,calc(100svh - 90px));padding:9px;border:2px solid #30394b;border-radius:49px;background:linear-gradient(145deg,#363d4b,#080c14 42%,#2a3449);box-shadow:0 35px 105px #0009,0 9px 40px #0005,inset 0 0 1px 1px #7e8ba242;isolation:isolate}
.phone:before{content:"";position:absolute;right:-4px;top:175px;width:3px;height:84px;border-radius:0 3px 3px 0;background:#586278}
.phone:after{content:"";position:absolute;left:-4px;top:145px;width:3px;height:70px;border-radius:3px 0 0 3px;background:#4c566c}
.phone-screen{position:relative;height:100%;width:100%;border-radius:40px;overflow:hidden;background:#0b111e;display:flex;flex-direction:column}
.wallpaper{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 45% at 80% 13%,#30426c7a,transparent 90%),radial-gradient(ellipse 80% 48% at 2% 72%,#2a2e547c,transparent 90%),linear-gradient(152deg,#151d32 0,#0e1524 57%,#131926 100%)}
.wallpaper:after{content:"";position:absolute;inset:0;opacity:.24;background-image:radial-gradient(#a0baf7 0.8px,transparent .8px);background-size:39px 48px;mask-image:linear-gradient(to bottom,transparent,#000 13%,#000 67%,transparent)}
.status-bar{position:relative;z-index:5;flex-shrink:0;height:43px;padding:0 25px;display:flex;align-items:center;justify-content:space-between;color:#f2f4f8;font-size:12px;font-weight:750;letter-spacing:.05px}
.status-time{min-width:54px}
.dynamic-island{width:102px;height:25px;position:absolute;left:50%;top:0;transform:translateX(-50%);background:#05070c;border-radius:0 0 19px 19px}
.dynamic-island:after{content:"";position:absolute;width:36px;height:6px;background:#161b26;left:30px;top:7px;border-radius:8px}
.status-icons{display:flex;align-items:center;gap:4px}
.status-icons svg{height:13px;width:15px;display:block}
.status-icons svg:last-child{width:24px}
.view{position:relative;z-index:2;flex:1;min-height:0}
.view[hidden]{display:none!important}
.view-home{display:flex;align-items:stretch}
.home-body{width:100%;min-height:100%;overflow-y:auto;overscroll-behavior:contain;padding:6px 25px 30px;display:flex;flex-direction:column;align-items:center}
.home-heading{width:100%;text-align:left;margin:39px 0 67px;padding-left:4px}
.home-overline{font-size:10px;letter-spacing:3px;font-weight:750;color:#98a9cc}
.home-heading h1{font-size:clamp(60px,14vw,83px);line-height:1.18;font-weight:300;letter-spacing:-5px;margin:10px 0 4px;color:#f6f7fe}
.clock-dot{color:#a3b8ee}
.home-heading p{font-size:13px;color:#abb7d1;margin:2px 0 0;letter-spacing:.02em}
.app-grid{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));justify-items:center;column-gap:19px;row-gap:32px;padding:0 17px}
.app-launch{min-width:0;width:100%;display:flex;align-items:center;flex-direction:column;gap:10px;padding:0;border:0;color:#f7f8fc;background:transparent;transition:transform .18s ease}
.app-launch:hover{transform:translateY(-3px)}
.app-launch:active{transform:scale(.94)}
.app-icon{width:77px;height:77px;border-radius:21px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px #ffffff63,0 11px 22px #050a1666;position:relative;overflow:hidden}
.app-icon:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#ffffff42,transparent 54%);pointer-events:none}
.app-icon svg{width:48px;height:48px;filter:drop-shadow(0 2px 2px #0002)}
.wiki-icon{background:linear-gradient(145deg,#77c68a,#328551)}
.story-icon{background:linear-gradient(145deg,#e4bd82,#b77b3f)}
.gallery-icon{background:linear-gradient(145deg,#e49bbc,#aa5b8d)}
.files-icon{background:linear-gradient(145deg,#7caee9,#4574ba)}
.app-label{font-size:13px;font-weight:620;text-shadow:0 2px 5px #0009}
.destination{width:100%;padding:17px 9px 16px;text-align:center;margin-top:auto;transform:translateY(7px);border-radius:18px;border:1px solid #8295bd3a;background:linear-gradient(155deg,#ffffff0d,#ffffff03);box-shadow:inset 0 1px #ffffff12}
.destination-head{display:flex;justify-content:center;align-items:center;gap:7px;font-size:10px;font-weight:740;letter-spacing:2.1px;color:#96a6c8}
.destination-pulse{height:6px;width:6px;background:#a6bbe9;border-radius:50%;box-shadow:0 0 13px #8fabff8a}
.destination-url{margin:13px 0 0;display:flex;justify-content:center;align-items:center;gap:0;white-space:nowrap;color:#eff2fb;font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;font-size:clamp(12.6px,3.5vw,16px);letter-spacing:-.55px}
.empty-bracket{color:#a3bfff}.empty-space{display:inline-block;min-width:68px;border-bottom:1px dashed #8ea9d4aa;vertical-align:middle;transform:translateY(-2px);height:12px;margin:0 1px}
.gesture-area{position:relative;z-index:5;display:flex;align-items:center;justify-content:center;flex:0 0 29px;width:100%;padding:0 0 8px;border:0;background:transparent}
.gesture-line{display:block;width:118px;height:4px;background:#e0e6f4dd;border-radius:9px;transition:background .2s}
.gesture-area:hover .gesture-line{background:#fff}
.desktop-footnote{margin:0;color:#7d8ca8;font-size:12px;letter-spacing:.02em}
.view-app{display:flex;flex-direction:column;background:linear-gradient(#0f1626eb,#0d1421f3)}
.app-toolbar{position:relative;display:flex;align-items:center;justify-content:space-between;flex:0 0 50px;padding:0 18px;border-bottom:1px solid #ffffff16;backdrop-filter:blur(10px)}
.back-button{border:0;background:transparent;color:#aac4ff;display:flex;align-items:center;gap:0;padding:8px 0;font-size:14px;z-index:1}
.back-button svg{width:21px;height:21px}
.toolbar-title{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:680;pointer-events:none;color:#f6f7fb}
.toolbar-side{width:54px}
.app-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#596783 transparent}
.app-scroll::-webkit-scrollbar,.home-body::-webkit-scrollbar{width:5px}
.app-scroll::-webkit-scrollbar-thumb,.home-body::-webkit-scrollbar-thumb{background:#53617b;border-radius:9px}
.wiki-scroll{padding:19px 18px 30px}
.wiki-search{background:#202a3a;border:1px solid #ffffff13;border-radius:12px;min-height:40px;display:flex;align-items:center;gap:10px;padding:0 13px;color:#8d9bb4;font-size:12px}
.wiki-search svg{height:16px;width:16px}
.wiki-article{margin-top:23px}
.article-eyebrow{color:#89b69b;display:flex;align-items:center;gap:7px;font-size:11px;font-weight:680;letter-spacing:.7px}
.article-marker{height:7px;width:7px;background:#74bf86;border-radius:50%}
.wiki-article h2{font-size:25px;margin:9px 0 15px;letter-spacing:-1px;color:#f4f6fc;line-height:1.3}
.wiki-rule{width:100%;height:1px;background:linear-gradient(90deg,#75b887,#75b88740,transparent);margin-bottom:21px}
.wiki-article p{font-size:13.5px;line-height:2.03;word-break:keep-all;overflow-wrap:break-word;color:#c9d2e1;margin:0 0 20px}
.wiki-article strong{font-weight:700;color:#e3f3e6}
.story-scroll{padding:20px 16px 29px;background:radial-gradient(ellipse at 50% 0,#3e334139,transparent 80%)}
.story-page{min-height:100%;padding:26px 22px 45px;background:linear-gradient(150deg,#282535,#1e2030 82%);border:1px solid #b39b783d;border-radius:7px;box-shadow:0 14px 30px #0003,inset 0 0 0 4px #ffffff04;color:#eee8e0}
.story-ornament{text-align:center;color:#ddc79d;font-size:24px;opacity:.8}
.story-kicker{display:block;text-align:center;font-size:11px;letter-spacing:2px;color:#bfae93;margin-top:6px}
.story-page h2{text-align:center;font-family:Georgia,"Noto Serif KR","Nanum Myeongjo",serif;font-size:23px;letter-spacing:-.8px;font-weight:650;margin:11px 0 15px}
.story-separator{display:flex;align-items:center;gap:13px;justify-content:center;color:#bda982;margin:13px 0 26px;font-size:12px}
.story-separator span{width:39px;height:1px;background:#bda98263}
.story-page p{font-size:14px;line-height:2.05;word-break:keep-all;overflow-wrap:break-word;margin:0 0 23px;color:#ece5df}
.story-page .woodpecker-noise{padding:16px 12px;border-left:2px solid #c3a979;background:#ffffff0b;border-radius:0 7px 7px 0;color:#f7efde;line-height:2.15;word-break:normal}
.story-ending{text-align:center;color:#c1ab86;font-size:28px;opacity:.8;padding-top:5px}
.gallery-scroll{padding:17px 18px 26px}
.gallery-info{display:flex;justify-content:space-between;align-items:center;padding:0 2px 15px;color:#a6b4ca;font-size:12px}
.gallery-count{font-weight:660;color:#e8ecf8}
.gallery-caption{letter-spacing:.6px;font-size:11px}
.flip-card{display:block;position:relative;perspective:1200px;aspect-ratio:832/1216;width:100%;max-width:345px;max-height:none;padding:0;margin:0 auto;border:0;border-radius:13px;background:transparent;box-shadow:0 18px 35px #0006;text-align:center}
.flip-card-inner{position:relative;display:block;height:100%;width:100%;transition:transform .7s cubic-bezier(.18,.75,.24,1);transform-style:preserve-3d;border-radius:13px}
.flip-card.is-flipped .flip-card-inner{transform:rotateY(180deg)}
.card-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;border-radius:13px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.card-front{background:#242c3c;border:1px solid #ffffff1b}
.card-front img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
.card-back{border:1px solid #8ca9d04a;background:radial-gradient(circle at 50% 34%,#30435e 0,#1c293e 50%,#101a2a 100%);transform:rotateY(180deg);padding:18px;color:#fff;gap:0}
.card-back:after{content:"";position:absolute;inset:12px;border:1px solid #ffffff22;border-radius:7px;pointer-events:none}
.back-symbol{font-size:37px;font-weight:200;color:#91afdc;margin-bottom:16px}
.card-back strong{font-size:clamp(30px,8vw,40px);letter-spacing:2px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.back-divider{width:58px;height:1px;background:#9eb5da6b;margin:19px 0}
.back-subtitle{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap;letter-spacing:.9px;font-size:clamp(12px,3.5vw,17px);color:#c7d8f5}
.gallery-tip{display:none}
.gallery-tip svg{width:17px;height:17px}
.files-scroll{padding:27px 18px 35px}
.files-top{margin-bottom:24px}
.files-eyebrow{color:#7f98c1;font-size:11px;letter-spacing:2px;font-weight:700}
.files-top h2{margin:9px 0 6px;font-size:31px;letter-spacing:-.5px;font-weight:770;color:#eaf0fb}
.files-period{color:#92aff0}
.files-top p{margin:0;color:#8493af;font-size:12px}
.fragment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.fragment{min-height:131px;background:linear-gradient(145deg,#253047,#1b263a);border:1px solid #748bb22f;border-radius:13px;display:flex;flex-direction:column;padding:16px 14px;min-width:0;position:relative;overflow:hidden}
.fragment:before{content:"";position:absolute;width:100px;height:100px;right:-69px;bottom:-70px;border:1px solid #95b4e247;border-radius:50%}
.fragment-caption{color:#9db1d2;font-size:10px;letter-spacing:.6px;display:flex;justify-content:space-between;align-items:center;gap:7px;white-space:nowrap}
.fragment-caption span{font-size:11px;color:#d7deed;letter-spacing:0;font-weight:650}
.fragment strong{font-size:30px;line-height:1.25;letter-spacing:2px;margin-top:auto;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:660;color:#f4f7fd}
.fragment-line{height:2px;width:25px;background:#92b3eb;margin-top:9px;border-radius:2px}
.cipher-note{margin-top:30px;padding:15px 14px 17px;background:#ffffff07;border:1px solid #a4b4d02a;border-radius:12px}
.cipher-note-header{display:flex;gap:8px;align-items:center;color:#7f90ac;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;letter-spacing:.3px}
.note-dot{height:6px;width:6px;background:#7e96be;border-radius:50%}
.cipher-note p{color:#a9b7cd;margin:14px 0 0;font-size:12px;line-height:2.1;word-break:keep-all;text-align:center}
.noscript{position:fixed;inset:auto 10px 10px;padding:15px;background:#492a2a;color:#fff;text-align:center;z-index:12}
@media (max-width:440px){.stage{padding:0;gap:0}.phone{height:100svh;min-height:100svh;width:100%;border:0;border-radius:0;padding:0;box-shadow:none}.phone:before,.phone:after{display:none}.phone-screen{border-radius:0}.status-bar{padding-top:env(safe-area-inset-top);height:calc(43px + env(safe-area-inset-top))}.dynamic-island{top:env(safe-area-inset-top)}.gesture-area{flex-basis:calc(29px + env(safe-area-inset-bottom));padding-bottom:calc(8px + env(safe-area-inset-bottom))}.desktop-footnote{display:none}.home-heading{margin:35px 0 56px}.home-body{padding-bottom:24px}}
@media (max-height:715px){.home-heading{margin-top:17px;margin-bottom:30px}.home-heading h1{font-size:64px}.app-grid{row-gap:17px}.app-icon{width:66px;height:66px;border-radius:18px}.app-icon svg{width:39px;height:39px}.destination{padding:13px 6px}.home-body{padding-bottom:12px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
