@import"https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;600;700&display=swap";body{margin:0;padding:0;overflow:hidden;background-color:#000;font-family:Noto Sans KR,sans-serif;touch-action:none;overscroll-behavior:none;height:100dvh}#3d-graph{width:100vw;height:100dvh;position:absolute;top:0;left:0;z-index:1}#site-title{position:absolute;top:40px;left:40px;z-index:10;color:#fff;pointer-events:none}#site-title strong{display:block;font-size:20px;font-weight:700;line-height:1.4;letter-spacing:-.3px}#bottom-ui{position:absolute;bottom:80px;left:0;width:100%;display:flex;flex-direction:column;align-items:center;gap:28px;z-index:10;transition:opacity .5s ease;pointer-events:none}#bottom-ui.hidden{opacity:0;pointer-events:none;display:none}.poetic-copy{font-size:15px;font-weight:500;color:#000;text-align:center;margin:0;letter-spacing:-.3px;line-height:1.8;word-break:keep-all}.main-btn-group{display:flex;gap:15px;justify-content:center;pointer-events:auto}.awwwards-btn{background:#000;color:#fff;border:none;border-radius:40px;padding:16px 36px;font-size:14px;font-weight:600;letter-spacing:.5px;cursor:pointer;pointer-events:auto;transition:transform .3s cubic-bezier(.165,.84,.44,1),background .3s}.awwwards-btn:hover{transform:translateY(-3px);background:#333}#control-guide{position:absolute;bottom:30px;left:50%;transform:translate(-50%);z-index:10;color:#999;font-size:11px;font-weight:400;letter-spacing:1px;pointer-events:none;opacity:.8;transition:opacity .5s ease}#control-guide.hidden{opacity:0;pointer-events:none;display:none}.desktop-guide{display:inline}.mobile-guide{display:none}#panel-overlay{position:absolute;top:0;left:0;width:100vw;height:100dvh;background:#fff6;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:20;display:flex;justify-content:center;align-items:center;opacity:1;transition:opacity .4s ease}#panel-overlay.hidden{opacity:0;pointer-events:none;display:none}.panel-content{background:#ffffffe6;border:1px solid rgba(0,0,0,.1);box-shadow:0 40px 80px #0000001a;border-radius:8px;width:75%;max-width:850px;height:75%;max-height:650px;padding:60px;position:relative;color:#111;display:flex;flex-direction:column}#panel-body{overflow-y:auto;padding-right:15px}#panel-body::-webkit-scrollbar{width:6px}#panel-body::-webkit-scrollbar-thumb{background-color:#0003;border-radius:3px}.section-block{margin-bottom:60px;border-bottom:1px solid #ddd;padding-bottom:60px}.section-block h2{font-size:1.5rem;margin-top:0;font-weight:700;letter-spacing:.5px;color:#000}.section-block:last-child{margin-bottom:0;border-bottom:none;padding-bottom:0}.about-text h3{font-size:1.1rem;margin-top:30px;margin-bottom:15px;font-weight:600}.about-text p{font-size:1.05rem;line-height:1.8;margin-bottom:20px;color:#333;word-break:keep-all}.about-links{display:flex;gap:15px;margin-top:30px;justify-content:center;flex-wrap:wrap}.cta-btn{background:#000;color:#fff;border:1px solid #000;padding:12px 25px;font-size:13px;font-weight:600;border-radius:30px;cursor:pointer;text-decoration:none;pointer-events:auto}.cta-btn.outline{background:transparent;color:#000}.poster-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}.poster-item{background:#f9f9f9;aspect-ratio:2/3;cursor:pointer;overflow:hidden;border-radius:2px}.poster-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.165,.84,.44,1)}.poster-item:hover img{transform:scale(1.05)}.close-btn{position:absolute;top:20px;right:20px;background:none;border:none;color:#000;font-size:20px;font-weight:400;cursor:pointer;z-index:25;pointer-events:auto}#lightbox{position:fixed;top:0;left:0;width:100vw;height:100dvh;background:#fffffff2;z-index:30;display:flex;justify-content:center;align-items:center;opacity:1;transition:opacity .3s ease}#lightbox.hidden{opacity:0;pointer-events:none;display:none}#lightbox-img{max-width:90%;max-height:90vh;box-shadow:0 30px 60px #0000001a}#lightbox-close{position:absolute;top:30px;right:30px;background:transparent;border:none;color:#000;font-size:13px;font-weight:600;letter-spacing:2px;cursor:pointer;border-bottom:1px solid #000}#creator-mode-ui{position:fixed;top:0;left:0;width:100vw;height:100dvh;z-index:30;display:none;flex-direction:column;justify-content:center;align-items:center;transition:opacity .4s ease;background:transparent;pointer-events:none}#creator-mode-ui.hidden{opacity:0;display:none}.creator-close-btn{position:absolute;top:30px;right:30px;background:none;border:none;font-size:20px;font-weight:400;cursor:pointer;pointer-events:auto;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.8);z-index:40}#frame-overlay-img{max-height:70dvh;max-width:90vw;width:auto;height:auto;pointer-events:none;box-shadow:0 0 0 9999px #000000d9;border-radius:2px}.creator-bottom-controls{position:absolute;bottom:40px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:20px;pointer-events:auto;z-index:35}.frame-selector{display:flex;align-items:center;gap:20px;background:#0009;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:10px 20px;border-radius:30px;color:#fff}.frame-selector button{background:none;border:none;color:#fff;font-size:16px;cursor:pointer}.custom-modal{position:fixed;top:0;left:0;width:100vw;height:100dvh;background:#000c;z-index:50;display:flex;justify-content:center;align-items:center;opacity:1;transition:opacity .3s ease;pointer-events:auto}.custom-modal.hidden{opacity:0;pointer-events:none;display:none}.custom-modal-content{background:#fff;padding:40px;border-radius:8px;width:85%;max-width:420px;color:#111;box-shadow:0 20px 40px #0000004d}.custom-modal-content h3{margin-top:0;margin-bottom:25px;font-size:20px;font-weight:700;color:#000}.tutorial-list{padding-left:0;list-style:none;margin-bottom:30px}.tutorial-list li{margin-bottom:18px;font-size:14px;line-height:1.6;color:#555;word-break:keep-all}.tutorial-list li strong{display:inline-block;margin-bottom:5px;color:#000;font-size:15px}.text-center{text-align:center}.text-center p{font-size:15px;line-height:1.6;margin-bottom:35px;color:#444;word-break:keep-all}.modal-btn-group{display:flex;gap:10px;justify-content:center}.modal-btn-group .cta-btn{flex:1;text-align:center;padding:14px 0;display:block}.helper-text{font-size:12px;color:#777;margin-top:15px;text-align:center;word-break:keep-all}@media(max-width:768px){#site-title{top:20px;left:20px}#site-title strong{font-size:15px}#bottom-ui{bottom:calc(40px + env(safe-area-inset-bottom));gap:15px;padding:0 20px;box-sizing:border-box}.poetic-copy{font-size:13px;line-height:1.5}.about-links{flex-direction:column;align-items:center;width:100%;gap:10px}.about-links .cta-btn{width:100%;box-sizing:border-box;text-align:center}.main-btn-group{flex-direction:column;width:100%;gap:10px}.main-btn-group .awwwards-btn{width:100%;padding:14px 0}#control-guide{bottom:calc(15px + env(safe-area-inset-bottom));font-size:10px;opacity:.6;width:100%;text-align:center}.desktop-guide{display:none}.mobile-guide{display:inline}.panel-content{width:85%;padding:30px 20px;height:80%}.poster-grid{grid-template-columns:repeat(2,1fr);gap:10px}#frame-overlay-img{max-height:65dvh;max-width:85vw}.creator-close-btn{top:15px;right:15px;font-size:15px}.creator-bottom-controls{bottom:calc(20px + env(safe-area-inset-bottom))}.custom-modal-content{padding:30px 20px}.modal-btn-group{flex-direction:column}}.drag-text-wrap{display:flex;align-items:center;justify-content:center}.swipe-hand{margin-right:8px;animation:swipeAnim 2.5s infinite ease-in-out}@keyframes swipeAnim{0%,to{transform:translate(-4px) rotate(-5deg)}50%{transform:translate(4px) rotate(5deg)}}.creator-btn-wrap{text-align:center;margin-top:25px}@media(max-width:768px){.creator-btn-wrap{display:flex;width:100%}#btn-start-creator{flex:1;width:100%;padding:14px 0;box-sizing:border-box;text-align:center}}