.guide-page{--guide-width:1360px;background:#fff;padding-top:82px}.guide-page .guide-header{position:fixed;inset:0 0 auto;z-index:50;height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 max(32px,calc((100vw - var(--guide-width))/2));background:rgba(255,255,255,.97);border-bottom:1px solid #dce7de;backdrop-filter:blur(12px)}.guide-header .brand{white-space:nowrap;font-size:27px}.guide-header-links{display:flex;align-items:center;gap:26px;font-size:13px}.guide-download{background:var(--ink);color:#fff;padding:12px 20px;border-radius:40px}.guide-header-links a:hover{color:var(--green)}.guide-header-links .guide-download:hover{color:#fff;background:var(--green)}#guide-menu{display:none}.guide-shell{max-width:var(--guide-width);margin:auto;padding:0 32px}.guide-sidebar{position:fixed;top:118px;bottom:28px;left:max(32px,calc((100vw - var(--guide-width))/2 + 32px));width:230px;overflow:auto;overscroll-behavior:contain;border-right:1px solid #dce7de;padding:4px 24px 10px 0}.guide-sidebar .eyebrow{margin-bottom:22px;color:var(--green);letter-spacing:.12em;font-size:12px}.guide-sidebar nav{display:flex;flex-direction:column;gap:4px}.guide-sidebar nav a{display:flex;align-items:center;gap:13px;border-radius:8px;padding:10px 12px;font-size:13px;line-height:1.6;color:#5e706a;transition:background .15s,color .15s}.guide-index{font-size:10px;color:#8a9b93;font-variant-numeric:tabular-nums}.guide-sidebar nav a:hover,.guide-sidebar nav a[aria-current]{color:var(--green);background:#edf5ef;font-weight:600}.guide-sidebar nav a[aria-current] .guide-index{color:var(--green)}.guide-version{margin:28px 12px 0;color:#8a9b93;font-size:10px;line-height:1.9}.guide-main{margin-left:286px;min-width:0;padding-bottom:54px}.guide-intro{padding:70px 0 60px;border-bottom:1px solid #dce7de}.guide-intro .eyebrow{font-size:10px;letter-spacing:.15em;color:var(--green)}.guide-intro h1{font-size:clamp(36px,4vw,58px);line-height:1.35;letter-spacing:-.045em;font-weight:750;color:var(--ink);margin:20px 0;text-shadow:none}.guide-intro p:not(.eyebrow){font-size:17px;line-height:1.9;color:var(--muted)}.guide-date{display:block;margin-top:24px;color:#84958d;font-size:11px}.guide-section{padding:58px 0;border-bottom:1px solid #dce7de;scroll-margin-top:106px;overflow-wrap:anywhere}.guide-section>.eyebrow{color:var(--green);font-size:10px;letter-spacing:.14em;margin-bottom:14px}.guide-section h2{font-size:clamp(28px,3vw,38px);line-height:1.45;letter-spacing:-.035em;margin-bottom:28px}.guide-section h3{font-size:21px;line-height:1.6;margin:40px 0 16px;letter-spacing:-.02em}.guide-section p,.guide-section li{font-size:16px;line-height:2;color:#5c6f67}.guide-section p{margin:0 0 22px}.guide-section ul,.guide-section ol{margin:20px 0 26px;padding-left:25px}.guide-section li{padding-left:7px;margin:0 0 13px}.guide-section li::marker{color:var(--green);font-weight:700}.guide-section .guide-note{padding:22px 25px;background:#eff5f0;border-left:3px solid var(--green);border-radius:0 13px 13px 0;font-size:14px;color:#446052;margin:28px 0}.guide-section blockquote{margin:24px 0;padding:28px;border:1px solid #dce7de;border-radius:14px;font-size:16px;line-height:2;color:#294b3d;background:#f8faf7}.guide-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:28px 0}.guide-links a{position:relative;padding:19px 23px;border:1px solid #dce7de;border-radius:12px;display:flex;flex-direction:column;gap:9px;background:#fbfdfb}.guide-links a:hover{border-color:var(--green)}.guide-links strong{font-size:14px;line-height:1.6;padding-right:15px;color:var(--green)}.guide-links span{position:absolute;right:20px;top:20px;color:var(--green)}.guide-links small{font-size:10px;color:#7a8e83;overflow-wrap:anywhere;line-height:1.7}.guide-shot{margin:32px 0 40px}.guide-shot img{display:block;width:100%;height:auto;border-radius:13px;border:1px solid #dce7de;box-shadow:0 16px 40px #112f2510;background:#171719}.guide-shot figcaption{margin-top:13px;color:#87978e;font-size:11px;line-height:1.8;text-align:center}.guide-shot-small{max-width:400px;margin:30px auto 40px}.guide-footer{display:flex;justify-content:space-between;gap:20px;padding-top:35px;font-size:12px;color:var(--green)}.guide-backdrop{display:none}body.guide-page a:focus-visible,body.guide-page button:focus-visible{outline:2px solid var(--green);outline-offset:4px}
@media(min-width:1500px){.guide-main{padding-right:24px}}
@media(max-width:1050px){.guide-sidebar{width:205px;padding-right:16px}.guide-main{margin-left:245px}.guide-shell{padding:0 28px}.guide-sidebar{left:28px}.guide-header .brand{font-size:24px}.guide-header-links{gap:20px}}
@media(max-width:850px){.guide-page{padding-top:72px}.guide-page .guide-header{height:72px;padding:0 24px}.guide-header .brand{font-size:24px;gap:9px}.guide-header .brand img{width:31px;height:31px}.guide-header-links{gap:16px}.guide-header-links>a:first-child{display:none}.guide-download{font-size:11px;padding:10px 14px}#guide-menu{display:block;border:1px solid #dce7de;border-radius:8px;background:#fff;color:var(--ink);font:inherit;font-size:12px;padding:9px 12px}.guide-sidebar{display:none;z-index:45;top:72px;bottom:0;left:0;width:min(310px,86vw);padding:30px 22px;background:#fff;box-shadow:20px 0 50px #142f2518;border-right:1px solid #dce7de}.guide-toc-open .guide-sidebar{display:block}.guide-backdrop:not([hidden]){display:block;position:fixed;z-index:40;inset:72px 0 0;background:#122b244d}.guide-toc-open{overflow:hidden}.guide-shell{padding:0 24px}.guide-main{margin-left:0}.guide-intro{padding:48px 0 40px}.guide-intro h1{font-size:38px}.guide-intro p:not(.eyebrow){font-size:16px}.guide-section{padding:42px 0;scroll-margin-top:94px}.guide-section h2{font-size:30px}.guide-section h3{font-size:20px;margin-top:32px}.guide-section p,.guide-section li{font-size:16px;line-height:1.95}.guide-section .guide-note{padding:20px;font-size:14px}.guide-links{grid-template-columns:1fr}.guide-section blockquote{padding:23px;font-size:15px}.guide-shot img{border-radius:9px}.guide-shot-small{max-width:340px}.guide-date{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.guide-sidebar nav a{transition:none}}

/* Worked examples keep LINE dialogue and Codex requests easy to distinguish. */
.guide-scenario{margin:32px 0;padding:28px;background:#f8faf7;border:1px solid #dce7de;border-radius:18px}.guide-scenario>.eyebrow{font-size:10px;letter-spacing:.13em;color:var(--green);margin-bottom:12px}.guide-scenario h4{font-size:21px;line-height:1.6;letter-spacing:-.025em;margin:0 0 24px}.guide-chat{display:flex;flex-direction:column;gap:16px}.guide-message{width:90%;padding:19px 23px;border:1px solid #e0e8df;border-radius:15px;background:#fff}.guide-message.self{align-self:flex-end;background:#eaf4ed;border-color:#d1e5d7}.guide-message.assistant{border-left:3px solid var(--green);border-radius:0 15px 15px 0}.guide-speaker{display:block;font-size:11px;font-weight:700;color:var(--green);margin-bottom:8px;line-height:1.7}.guide-message p{font-size:15px;line-height:1.95;margin:0;color:#385649}.guide-scenario .guide-note{margin-bottom:0;font-size:13px}
@media(max-width:850px){.guide-scenario{padding:21px 16px;margin:27px 0}.guide-scenario h4{font-size:20px}.guide-message{width:96%;padding:16px 18px}.guide-message p{font-size:15px}}