@import url('/studio.css');
:root{--paper:#fafaf6;--ink:#283a2b;--soft-ink:#737e6c;--forest:#355b43;--rule:#e1e5d8}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;letter-spacing:-.025em}*{box-sizing:border-box}a{color:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:2px solid #79985f;outline-offset:5px}.site-header{height:92px;display:flex;align-items:center;justify-content:space-between;max-width:1360px;margin:auto;padding:0 48px;border-bottom:1px solid var(--rule)}.wordmark{display:flex;align-items:center;gap:11px;font-size:24px;font-weight:650;letter-spacing:-1.7px;text-decoration:none}.wordmark svg{width:27px;height:32px;stroke:#436d4c;fill:none;stroke-width:1.5}.site-nav{display:flex;align-items:center;gap:29px;font-size:12px;color:#6c7a61}.site-nav a{text-decoration:none}.site-nav a:hover{color:#355b43}.site-nav .nav-start{padding:10px 15px;border:1px solid #d0dcc3;border-radius:5px;color:#486b38}.wrap{max-width:1264px;margin:auto;padding:0 48px}.hero{padding:93px 0 85px;display:grid;grid-template-columns:.95fr 1.05fr;gap:60px;align-items:center}.kicker{font-size:11px;color:#7b896e;font-weight:500;letter-spacing:.06em;margin:0 0 25px}.hero h1{font-family:"AppleMyungjo","Batang",Georgia,serif;font-weight:400;letter-spacing:-3px;font-size:58px;line-height:1.45;margin:0 0 28px;color:#2c432d;word-break:keep-all}.hero h1 em{font-style:normal;color:#719354}.hero-copy>p:not(.kicker){font-size:14px;color:#87977b;line-height:1.95;margin:0 0 29px;word-break:keep-all;max-width:370px}.hero-actions{display:flex;align-items:center;gap:22px}.primary-link{background:#355a42;color:#fbfcf6;border:1px solid #355a42;padding:13px 19px;border-radius:5px;font-size:12px;text-decoration:none;display:inline-flex;align-items:center;gap:24px;white-space:nowrap}.primary-link:hover{background:#274b34}.text-link{font-size:12px;color:#80976b;text-decoration:none}.text-link:hover{text-decoration:underline}.hero-footnote{font-size:10px;color:#a3b296;margin-top:17px;line-height:1.7}.preview-scene{height:455px;position:relative;isolation:isolate;background-image:radial-gradient(#d8e3cd .6px,transparent .6px);background-size:19px 19px;border-radius:3px}.preview-label{position:absolute;top:6px;left:24px;font-size:9px;color:#9bb185;letter-spacing:.04em}.preview-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}.preview-lines path{fill:none;stroke:#b3c99b;stroke-width:1.2}.preview-paper{position:absolute;left:22px;top:71px;width:285px;background:#fffefa;border:1px solid #dde5d2;border-radius:5px;padding:23px 23px 20px;box-shadow:0 10px 35px #475e2d05;transform:rotate(-2deg);z-index:1}.preview-paper-head{display:flex;justify-content:space-between;font-size:9px;color:#a1b38d;padding-bottom:18px;border-bottom:1px solid #edf2e5}.preview-paper h2{font-size:15px;line-height:1.8;font-weight:550;color:#506541;margin:18px 0 15px}.preview-paper p{font-size:11px;line-height:2;color:#93a67e;margin:13px 0}.preview-sentence{background:#edf4df;color:#658742;padding:2px 1px;font:inherit;text-align:left;border:0;display:inline;cursor:pointer;box-shadow:inset 0 -1px #c1d6a5}.preview-sentence:hover{background:#e4f0cc}.preview-card{position:absolute;right:-12px;top:120px;width:206px;background:#fffefa;border:1px solid #d5e3c6;border-radius:5px;padding:16px 17px;box-shadow:0 7px 24px #3f61340b;z-index:2;transition:transform .25s,opacity .25s}.preview-card small{font-size:9px;color:#94ab7c;display:block;margin-bottom:9px}.preview-card p{font-size:12px;color:#526d3f;line-height:1.85;margin:0 0 15px}.preview-card button{font-size:9px;color:#98b479;border:0;background:none;padding:0;cursor:pointer}.preview-card.second{top:288px;right:22px;width:191px;box-shadow:0 7px 24px #3f613408}.preview-card.second p{font-size:11px;margin-bottom:3px}.preview-card.is-flashing{transform:translateY(-6px);border-color:#93b46d}.preview-caption{position:absolute;bottom:4px;left:23px;font-size:9px;color:#a9b99a}.process-strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:29px 0;margin-bottom:90px}.process-item{display:flex;gap:20px;padding:0 34px;border-right:1px solid var(--rule)}.process-item:first-child{padding-left:0}.process-item:last-child{border:0}.process-item>span{font:18px Georgia,serif;color:#a3b68e;line-height:1.3}.process-item h3{font-size:13px;font-weight:550;color:#576d44;margin:0 0 9px}.process-item p{font-size:11px;color:#99aa88;line-height:1.9;margin:0;word-break:keep-all}.section-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:36px}.section-intro h2{font-size:31px;font-family:"AppleMyungjo","Batang",Georgia,serif;font-weight:400;line-height:1.5;letter-spacing:-1.4px;margin:0;color:#526943}.section-intro p{font-size:12px;line-height:1.9;color:#98aa87;max-width:390px;margin:0}.use-section{margin-bottom:90px}.use-rows{border-top:1px solid var(--rule)}.use-row{display:grid;grid-template-columns:45px 1fr 1.1fr;gap:21px;padding:26px 0;border-bottom:1px solid var(--rule);align-items:start}.use-row>span{font:14px Georgia,serif;color:#a9bb95;padding-top:2px}.use-row h3{font-size:15px;font-weight:500;color:#66834d;margin:0}.use-row p{font-size:12px;color:#96aa84;line-height:1.9;margin:0;word-break:keep-all}.entry-block{background:#f0f4e7;padding:45px 42px;display:flex;justify-content:space-between;align-items:center;gap:24px;border-radius:6px;margin-bottom:74px}.entry-block h2{font-family:"AppleMyungjo","Batang",Georgia,serif;font-weight:400;font-size:29px;letter-spacing:-1px;margin:0 0 13px;color:#607c48}.entry-block p{font-size:12px;color:#90a477;margin:0;line-height:1.8}.entry-actions{display:flex;flex-direction:column;gap:13px;align-items:center}.site-footer{border-top:1px solid var(--rule);padding:28px 0 40px;display:flex;justify-content:space-between;gap:30px;align-items:flex-start;color:#a4b694;font-size:10px}.site-footer .wordmark{font-size:18px;color:#758e61;margin-bottom:10px}.footer-links{display:flex;gap:23px;flex-wrap:wrap;padding-top:7px}.footer-links a{text-decoration:none}.footer-links a:hover{text-decoration:underline}.article-wrap{max-width:850px;margin:70px auto 95px;padding:0 35px}.article-wrap h1{font-family:"AppleMyungjo","Batang",Georgia,serif;font-size:38px;letter-spacing:-1.5px;line-height:1.55;font-weight:400;margin:13px 0 23px;color:#49633a}.article-lead{font-size:15px;color:#80996d;line-height:1.9}.article-wrap h2{font-size:21px;font-weight:500;margin:42px 0 18px;color:#597a44}.article-wrap h3{font-size:15px;font-weight:550;color:#6d8c54;margin:27px 0 12px}.article-wrap p,.article-wrap li{font-size:13px;color:#869f70;line-height:2.05;word-break:keep-all}.article-wrap li{margin-bottom:9px}.article-wrap a{color:#678d46;text-underline-offset:3px}.article-wrap ul,.article-wrap ol{padding-left:22px}.article-note{border-left:2px solid #b5cba0;background:#f3f6ec;padding:15px 20px;margin:25px 0}.article-note p{margin:0}.example-block{border:1px solid #d8e4cd;border-radius:5px;padding:25px;background:#fffffb;margin:22px 0}.example-block small{font-size:10px;color:#9eb789}.example-block p{font-size:14px;color:#809c67}.guide-grid{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid #dce6d0;margin:38px 0}.guide-card{padding:23px 0;display:grid;grid-template-columns:40px 1fr 20px;gap:12px;text-decoration:none!important;border-bottom:1px solid #dce6d0}.guide-card>span{font:18px Georgia,serif;color:#a7bd91}.guide-card h2{font-size:18px;margin:0 0 7px;color:#6d8d52}.guide-card p{font-size:12px;margin:0;color:#92ad7d}.connect-steps{counter-reset:steps}.connect-step{border-top:1px solid #dce6d0;padding:23px 0;display:grid;grid-template-columns:34px 1fr;gap:15px}.connect-step:before{counter-increment:steps;content:counter(steps,decimal-leading-zero);font:18px Georgia,serif;color:#abc193;padding-top:2px}.connect-step h3{margin:0 0 12px}.connect-step p{font-size:12px;margin:10px 0}.connect-step code,.command{display:block;background:#eef3e5;border:1px solid #dbe6cd;padding:13px 16px;border-radius:4px;color:#6b8d4c;font:12px/1.8 ui-monospace,SFMono-Regular,monospace;overflow:auto}.connect-step .button{display:inline-block;text-decoration:none;margin:5px 8px 5px 0}.connect-status{display:flex;gap:9px;align-items:center;font-size:12px;color:#7d9d5d;min-height:30px}.connect-status:before{content:'';width:6px;height:6px;background:#bccaa9;border-radius:50%}.connect-status.ready:before{background:#7ba150}.connect-form{display:flex;gap:9px;margin:15px 0}.connect-form input{flex:1;font-size:12px;background:#fffef8}.connect-form button{font-size:12px}.connection-detail{font-size:11px;color:#9eb889;margin-top:14px}.tour-panel{position:fixed;left:258px;bottom:28px;width:340px;z-index:90;background:#fffefa;border:1px solid #c9dbb6;border-radius:8px;box-shadow:0 12px 45px #3e5a2220;padding:23px 25px;color:#607f43}.tour-panel small{font-size:10px;color:#a1b78c}.tour-panel h3{font-size:17px;font-weight:500;line-height:1.5;margin:12px 0}.tour-panel p{font-size:12px;line-height:1.9;color:#8aa572;margin:12px 0 20px}.tour-close{position:absolute;right:15px;top:14px;font-size:21px;color:#a6bc90}.tour-buttons{display:flex;justify-content:space-between;gap:10px;align-items:center}.tour-buttons .button{font-size:11px}.tour-dots{display:flex;gap:5px}.tour-dots span{width:5px;height:5px;background:#dbe6ce;border-radius:50%}.tour-dots span.active{background:#7da14e}.demo-notice{display:flex;align-items:center;gap:14px;padding:9px 26px;background:#f0f3e8;border-bottom:1px solid #e0e7d4;color:#8da76e;font-size:10px}.demo-notice span{flex:1}.demo-notice a{font-size:10px;color:#799d55;text-underline-offset:3px}.tour-highlight{outline:3px solid #a8c480!important;outline-offset:4px!important}.tour-halo{box-shadow:0 0 0 8px #bfd59b22!important}.ad-slot{display:none}.ad-slot[data-active="true"]{display:block;margin:40px 0;min-height:110px;padding-top:20px;border-top:1px solid var(--rule)}.ad-slot:before{content:'광고';font-size:9px;color:#99a78b;display:block;margin-bottom:10px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
/* Keep small text readable; use accent color only where it conveys an action. */
.hero-copy>p:not(.kicker),.process-item p,.section-intro p,.use-row p,.entry-block p,.article-wrap p,.article-wrap li,.guide-card p,.tour-panel p{color:#697263}.hero-footnote,.preview-caption,.preview-label,.site-footer,.preview-paper-head,.kicker,.connection-detail,.demo-notice{color:#717a69}.preview-paper p{color:#717d65}.preview-card small,.preview-card button,.text-link{color:#5f7f49}.site-header,.site-footer{background:none}.article-wrap h1,.hero h1{color:#2c3d2a}.article-wrap h2,.article-wrap h3,.process-item h3,.use-row h3,.entry-block h2{color:#475d3b}
@media(min-width:1450px){.hero{gap:100px}.hero h1{font-size:65px}.preview-card{right:0}.preview-card.second{right:35px}}@media(max-width:1050px){.hero{gap:30px;padding:70px 0}.hero h1{font-size:46px}.preview-paper{width:245px;padding:20px;left:0}.preview-card{width:180px;right:-10px}.preview-card.second{right:0;width:167px}.site-header,.wrap{padding-left:30px;padding-right:30px}.process-item{padding:0 20px;gap:12px}.process-item p{font-size:10px}}@media(max-width:760px){.site-header{height:73px;padding:0 22px}.site-nav{gap:18px;font-size:11px}.site-nav a:nth-child(2){display:none}.site-nav .nav-start{padding:8px 11px}.wordmark{font-size:23px}.wrap{padding:0 24px}.hero{padding:56px 0 32px;display:block}.hero h1{font-size:44px;letter-spacing:-2.3px;line-height:1.48}.hero-copy>p:not(.kicker){font-size:13px;max-width:340px}.hero-footnote{font-size:10px}.preview-scene{height:440px;max-width:465px;margin:45px auto 0}.preview-paper{width:258px;left:0;top:56px}.preview-label{left:0}.preview-card{right:-4px;top:125px;width:176px}.preview-card.second{right:8px;top:289px;width:169px}.preview-card p{font-size:11px}.preview-caption{left:0;bottom:9px}.process-strip{grid-template-columns:1fr;padding:0;margin-bottom:56px}.process-item,.process-item:first-child{padding:23px 0;border:0;border-bottom:1px solid #e1e5d8;gap:22px}.process-item:last-child{border:0}.process-item p{font-size:11px}.section-intro{display:block;margin-bottom:26px}.section-intro h2{font-size:27px;margin-bottom:19px}.section-intro p{font-size:12px}.use-section{margin-bottom:53px}.use-row{grid-template-columns:26px 1fr;gap:15px;padding:24px 0}.use-row p{grid-column:2;margin-top:-3px;font-size:12px}.entry-block{display:block;padding:31px 26px;margin-bottom:50px}.entry-block h2{font-size:25px}.entry-actions{align-items:flex-start;margin-top:25px}.site-footer{flex-direction:column;gap:15px;padding-bottom:30px}.footer-links{font-size:10px;gap:20px}.article-wrap{padding:0 25px;margin:47px auto 65px}.article-wrap h1{font-size:31px}.article-wrap h2{font-size:19px}.article-lead{font-size:13px}.connect-form{flex-wrap:wrap}.connect-form input{min-width:100%}.tour-panel{left:14px;bottom:13px;width:calc(100vw - 28px);padding:19px 22px}.tour-panel h3{font-size:16px}.tour-panel p{font-size:11px;margin-bottom:15px}.demo-notice{padding:9px 15px;font-size:9px;gap:10px}.demo-notice a{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.tour-buttons{margin-top:18px}.tour-exit{display:block;margin:18px auto 0;font:11px inherit;color:#637858;text-decoration:underline;cursor:pointer;background:none;border:0}.tour-close{background:none;border:0;cursor:pointer}.site-body{height:auto;overflow:visible}.site-body input{padding:12px;border:1px solid #d5ddcc;font:13px inherit}.site-body summary{cursor:pointer;font-size:11px;color:#67755c;margin:12px 0}.connect-form .button{min-width:110px}.site-body .button{cursor:pointer;font-family:inherit}.site-body .button:disabled{opacity:.5;cursor:wait}.connection-detail,.connect-step p,.connect-status{color:#65735c}.tour-panel small{color:#637858}.preview-sentence{color:#4f6a38}.site-footer{font-size:11px}.preview-paper h2{color:#435739}.article-note p{color:#506346}#connected-actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap}#connected-actions[hidden]{display:none}
[hidden]{display:none!important}

.tour-panel{max-height:calc(100dvh - 28px);overflow-y:auto}.tour-answer-actions{display:flex;gap:8px;flex-wrap:wrap}.tour-answer-actions .button{font-size:11px}

/* Anchored tour: viewport overlays follow the graph without intercepting it. */
.tour-panel{left:0;top:0;bottom:auto;visibility:hidden;width:340px;max-width:calc(100vw - 28px);z-index:92;padding:21px 23px;border:1px solid #91ad80;border-radius:12px;box-shadow:0 16px 48px #243d2426;overscroll-behavior:contain}
.tour-panel h3{padding-right:8px;color:#294e35;font-weight:600}.tour-panel p{color:#53654f}.tour-panel small{color:#56714c}.tour-close{min-width:30px;min-height:30px;right:9px;top:7px;color:#647a58}
.tour-highlight{outline:2px solid #678c50!important;outline-offset:3px!important;background-color:#edf5e4!important;color:#294e35!important;transition:background-color .18s ease}
.tour-spotlight{position:fixed;z-index:89;pointer-events:none;border:2px solid #6c9256;border-radius:9px;box-shadow:0 0 0 5px #88ad6022;transition:box-shadow .18s ease}
.tour-spotlight[hidden]{display:none}.tour-arrow{position:fixed;inset:0;width:100%;height:100%;z-index:91;pointer-events:none;overflow:visible}.tour-arrow-line{fill:none;stroke:#547b42;stroke-width:2;stroke-linecap:round}.tour-arrow marker path{fill:none;stroke:#547b42;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){.tour-panel{padding:17px 19px}.tour-panel h3{font-size:15px;margin:9px 0}.tour-panel p{font-size:11px;line-height:1.75;margin:9px 0 13px}.tour-buttons{margin-top:13px}.tour-panel .tour-exit{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.tour-highlight,.tour-spotlight{transition:none}}
.project-tools{display:flex;justify-content:space-between;gap:8px;margin:7px 1px 0}.project-tools button{font-size:10px;padding:5px 3px;color:#817a6e;text-decoration:underline;text-underline-offset:3px}.project-tools button:hover{color:#9d4c3d}
.delete-project-summary{border:1px solid #e6dfd4;border-radius:10px;padding:18px;background:#faf8f3}.delete-project-summary strong{font-size:14px;overflow-wrap:anywhere}.delete-project-summary p{font-size:11px;color:#82796e;margin:10px 0 0}.delete-error{font-size:12px;color:#a04435}.button.danger-solid{background:#943f33;border-color:#943f33;color:white}.button.danger-solid:hover{background:#793226}
.editor-ad-rail{flex:0 0 72px;display:flex;justify-content:center;align-items:center;border-top:1px solid #e6e2d8;background:#f5f3ec;padding:10px 18px}.editor-ad-preview{width:320px;max-width:100%;height:50px;display:flex;align-items:center;justify-content:center;gap:14px;border:1px dashed #d4cfc2;border-radius:4px;color:#918a7c;background:#faf9f5}.editor-ad-preview span{font-size:9px;letter-spacing:1px;border-right:1px solid #ddd7cb;padding-right:14px}.editor-ad-preview small{font-size:10px}
@media(max-width:800px){.editor-ad-rail{flex-basis:64px;padding:7px 15px}.editor-ad-preview{height:48px}}