:root{--base:#f3f5f4;--card:#fff;--text:#3f464d;--dark:#343a40;--main:#01B202;--active:#4a9d70;--soft:#f1f7f2;--border:1px solid rgba(36,41,47,.16)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:var(--base);font-family:"Noto Sans JP",sans-serif;font-size:16px;line-height:1.7}a{color:inherit}:focus-visible{outline:3px solid var(--main);outline-offset:3px}.skip-link{position:fixed;top:8px;left:8px;z-index:100;padding:8px 12px;background:var(--dark);color:#fff;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}
.shortcut-header{position:sticky;top:0;z-index:30;border-bottom:var(--border);background:var(--card)}.shortcut-header nav{width:calc(100% - 32px);min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px;margin-inline:auto}.shortcut-header a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}.shortcut-brand{gap:12px;white-space:nowrap}.shortcut-brand>span{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:var(--main);color:#fff;font-weight:700}.shortcut-brand em{color:var(--main);font-size:14px;font-style:normal;font-weight:700}.back-link{color:var(--main);font-weight:700}
main{width:min(1120px,calc(100% - 48px));margin-inline:auto}.shortcut-hero{display:grid;grid-template-columns:1fr auto;gap:16px 48px;align-items:end;padding:64px 0 40px}.shortcut-hero>p:first-child{grid-column:1;margin:0;color:var(--main);font-weight:700}.shortcut-hero h1{grid-column:1;margin:0;color:var(--dark);font-size:clamp(40px,6vw,64px);line-height:1.3}.shortcut-hero>p:nth-of-type(2){grid-column:1;max-width:640px;margin:0}.key-demo{grid-column:2;grid-row:1/4;display:grid;grid-template-columns:auto auto auto;align-items:center;gap:10px;padding:24px;border:2px solid var(--main);border-radius:16px;background:var(--card)}.key-demo strong{grid-column:1/-1;text-align:center}.environment-note,.source-note{padding:20px 24px;border-left:5px solid var(--main);background:var(--soft)}.environment-note{margin-bottom:56px}.environment-note p,.source-note p{margin:4px 0 0}
.shortcut-section{margin:0 0 64px}.section-title{display:flex;align-items:center;gap:20px;margin-bottom:20px}.section-title>span{width:56px;height:56px;display:grid;place-items:center;border-radius:50%;background:var(--soft);color:var(--main);font-weight:700}.section-title p{margin:0;color:var(--main);font-size:14px;font-weight:700}.section-title h2{margin:2px 0 0;color:var(--dark);font-size:28px}.shortcut-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.shortcut-grid article{min-width:0;padding:20px;border:var(--border);border-radius:12px;background:var(--card)}.essential .shortcut-grid article{border-color:rgba(1,178,2,.45)}.shortcut-grid article>div{min-height:44px;display:flex;align-items:center;gap:6px;margin-bottom:12px}.shortcut-grid h3{margin:0 0 6px;color:var(--dark);font-size:18px}.shortcut-grid p{margin:0;font-size:14px}kbd{min-width:36px;min-height:36px;display:inline-grid;place-items:center;padding:5px 9px;border:1px solid rgba(36,41,47,.25);border-bottom-width:3px;border-radius:7px;background:#fff;color:var(--dark);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:700;white-space:nowrap}.essential kbd{border-color:var(--active);color:var(--main)}.shortcut-grid b{font-weight:400}.source-note{margin:0 0 64px}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}footer{padding:24px;border-top:var(--border);background:var(--card);text-align:center}footer a{min-height:44px;display:inline-flex;align-items:center;color:var(--main);font-weight:700}
@media(max-width:850px){.shortcut-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shortcut-hero{grid-template-columns:1fr}.key-demo{grid-column:1;grid-row:auto;justify-self:start}}
@media(max-width:600px){main{width:calc(100% - 32px)}.shortcut-brand em{display:none}.shortcut-header nav{min-height:64px}.shortcut-hero{padding:40px 0 28px}.shortcut-hero h1{font-size:40px}.key-demo{width:100%;justify-content:center}.shortcut-grid{grid-template-columns:1fr}.section-title{align-items:flex-start}.section-title h2{font-size:24px}.shortcut-section{margin-bottom:48px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important}}
