:root{--background:#111318;--surface:#191c20;--surface-container:#1f2228;--surface-high:#292c32;--on-surface:#e3e2e9;--on-surface-variant:#c5c5d0;--outline:#8f909b;--outline-variant:#45464f;--primary:#b9c3ff;--on-primary:#15245b;--primary-container:#34447c;--on-primary-container:#dce1ff;--secondary-container:#414659;--on-secondary-container:#dde1f9;--shadow:#00000047;color-scheme:dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans JP,sans-serif}:root[data-theme=light]{--background:#fbf8ff;--surface:#fbf8ff;--surface-container:#efedf4;--surface-high:#e8e7ed;--on-surface:#1b1b21;--on-surface-variant:#45464f;--outline:#767680;--outline-variant:#c6c6d0;--primary:#4c5f99;--on-primary:#fff;--primary-container:#dce1ff;--on-primary-container:#34477f;--secondary-container:#e0e4f9;--on-secondary-container:#414659;--shadow:#1e1f261f;color-scheme:light}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;min-width:320px}body{min-height:100vh;color:var(--on-surface);background-color:var(--background);background-image:radial-gradient(circle at 86% 12%, color-mix(in srgb, var(--primary) 8%, transparent), transparent 29rem), radial-gradient(circle at 6% 72%, color-mix(in srgb, var(--primary) 5%, transparent), transparent 24rem);background-attachment:fixed;margin:0;padding-bottom:112px}a{color:inherit}button{font:inherit}.skip-link{z-index:20;color:var(--on-primary);background:var(--primary);border-radius:12px;padding:10px 16px;position:fixed;top:8px;left:8px;transform:translateY(-150%)}.skip-link:focus{transform:none}.top-app-bar{z-index:10;background:color-mix(in srgb, var(--surface) 92%, transparent);border-bottom:1px solid var(--outline-variant);backdrop-filter:blur(12px);position:sticky;top:0}.top-app-bar__inner{justify-content:space-between;align-items:center;width:min(100% - 32px,680px);min-height:64px;margin:auto;display:flex}.brand{letter-spacing:-.02em;font-size:1.05rem;font-weight:700;text-decoration:none}.theme-toggle{width:44px;height:44px;color:var(--on-surface-variant);cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;padding:0;display:grid}.theme-toggle:hover{background:var(--surface-high)}.theme-toggle svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.theme-toggle .moon,[data-theme=light] .theme-toggle .sun{display:none}[data-theme=light] .theme-toggle .moon{display:block}.page{width:min(100% - 32px,680px);margin:auto}.hero{align-items:center;gap:20px;padding:64px 4px 48px;scroll-margin-top:84px;display:flex}.avatar{background:var(--surface-container);border:1px solid color-mix(in srgb, var(--on-primary-container) 32%, transparent);width:72px;height:72px;box-shadow:0 4px 12px var(--shadow), inset 0 1px #ffffff47;backdrop-filter:blur(10px);border-radius:24px;flex:0 0 72px;place-items:center;display:grid;position:relative;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%;display:block}.avatar:after{content:"";pointer-events:none;background:linear-gradient(145deg,#ffffff38,#0000 44%);position:absolute;inset:0}.hero h1{letter-spacing:-.04em;margin:0;font-size:clamp(2rem,9vw,2.8rem);line-height:1.1}.hero p{color:var(--on-surface-variant);margin:9px 0 0;font-size:.95rem}.section{margin-top:48px;scroll-margin-top:84px}.section-heading{margin:0 4px 16px}.section-heading h2{letter-spacing:-.02em;margin:0;font-size:1.35rem;line-height:1.3}.section-heading p{color:var(--on-surface-variant);margin:5px 0 0;font-size:.85rem}.link-list{background:var(--surface-container);border-radius:24px;overflow:hidden}.main-link,.compact-link,.site-row{grid-template-columns:48px 1fr auto;align-items:center;gap:12px;min-height:76px;padding:12px 18px;text-decoration:none;display:grid;position:relative}.main-link:not(:last-child),.compact-link:not(:last-child),.site-row:not(:last-child){border-bottom:1px solid var(--outline-variant)}.main-link:hover,.compact-link:hover,.site-row:hover{background:var(--surface-high)}.main-link:before{content:"";pointer-events:none;background:linear-gradient(120deg, #ffffff21, transparent 35%, color-mix(in srgb, var(--primary) 12%, transparent));opacity:0;transition:opacity .16s;position:absolute;inset:0}.main-link>*{position:relative}.main-link:hover:before,.main-link:focus-visible:before,.main-link:active:before{opacity:1}.main-link--featured{color:var(--on-primary-container);background:var(--primary-container)}.main-link--featured:hover{background:color-mix(in srgb, var(--primary-container) 88%, var(--on-primary-container))}.link-icon,.site-row__icon{width:44px;height:44px;color:var(--on-secondary-container);background:var(--secondary-container);border-radius:50%;place-items:center;display:grid}.main-link--featured .link-icon{color:var(--on-primary);background:var(--primary)}.service-icon{width:var(--icon-size);height:var(--icon-size);flex:0 0 var(--icon-size);place-items:center;display:grid}.service-icon svg{fill:currentColor;width:100%;height:100%;display:block}.service-icon--youtube{color:#ff4655}.service-icon--discord{color:#9aa2ff}[data-theme=light] .service-icon--discord{color:#5865f2}.service-icon--hatena{color:#00a4de}.service-icon--scratch{color:#ef9324}.service-icon--qiita{color:#55c500}.link-copy,.site-row__copy{flex-direction:column;gap:3px;min-width:0;display:flex}.link-copy strong,.site-row__copy strong{font-size:.98rem;font-weight:600}.link-copy span,.site-row__copy span{color:var(--on-surface-variant);text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;overflow:hidden}.main-link--featured .link-copy span{color:color-mix(in srgb, var(--on-primary-container) 78%, transparent)}.external-arrow{color:var(--on-surface-variant);font-size:1rem}.main-link--featured .external-arrow{color:var(--on-primary-container)}.compact-list{display:grid}.compact-link{min-height:68px}.site-row{grid-template-columns:48px 1fr auto auto;min-height:82px}.site-row__url{color:var(--on-surface-variant);font-size:.75rem}.sites-list{background:0 0;border-radius:0;gap:12px;display:grid;overflow:visible}.sites-list .site-row{background:var(--surface-container);border:1px solid var(--outline-variant);border-radius:28px;min-height:108px}.sites-list .site-row:nth-child(2){border-radius:20px 32px}.site-footer{border-top:1px solid var(--outline-variant);grid-template-columns:1fr auto;gap:8px 20px;margin-top:72px;padding:28px 4px 36px;display:grid}.footer-mark{display:none}.site-footer strong{font-size:.9rem}.site-footer p{color:var(--on-surface-variant);margin:4px 0 0;font-size:.75rem}.site-footer nav{grid-area:1/2;gap:18px;display:flex}.site-footer nav a{color:var(--primary);font-size:.82rem;text-decoration:none}a:focus-visible,button:focus-visible{outline:3px solid var(--primary);outline-offset:3px}.floating-nav-wrap{z-index:30;right:0;bottom:calc(14px + env(safe-area-inset-bottom));pointer-events:none;justify-content:center;padding-inline:14px;display:flex;position:fixed;left:0}.floating-nav{--nav-liquid-filter:blur(20px);background:color-mix(in srgb, var(--surface-container) 78%, transparent);border:1px solid color-mix(in srgb, var(--outline) 48%, transparent);width:min(100%,340px);height:72px;box-shadow:0 12px 32px var(--shadow), inset 0 1px #ffffff21;backdrop-filter:blur(20px)saturate(125%);pointer-events:auto;isolation:isolate;border-radius:999px;grid-template-columns:repeat(3,1fr);padding:6px;display:grid;position:relative;overflow:hidden}.floating-nav--refractive{backdrop-filter:var(--nav-liquid-filter) blur(.6px) saturate(122%)}.floating-nav:before{z-index:-1;content:"";pointer-events:none;background:linear-gradient(155deg, #ffffff25, transparent 34%, transparent 68%, color-mix(in srgb, var(--primary) 14%, transparent));border-radius:inherit;position:absolute;inset:0}.nav-liquid-indicator{z-index:0;background:color-mix(in srgb, var(--primary-container) 78%, transparent);border:1px solid color-mix(in srgb, var(--on-primary-container) 22%, transparent);width:calc(33.3333% - 4px);box-shadow:inset 0 1px #ffffff25, 0 2px 10px color-mix(in srgb, var(--primary) 13%, transparent);pointer-events:none;will-change:transform;border-radius:999px;position:absolute;top:6px;bottom:6px;left:6px}.nav-liquid-indicator:after{content:"";pointer-events:none;border-radius:inherit;filter:blur(3px);background:#00000024;height:5px;position:absolute;inset:auto 12px 3px}.floating-nav.is-morphing .nav-liquid-indicator{box-shadow:inset 0 1px #ffffff3d, 0 3px 14px color-mix(in srgb, var(--primary) 17%, transparent)}.nav-item{z-index:1;min-width:0;min-height:60px;color:color-mix(in srgb, var(--on-surface-variant) 76%, transparent);cursor:pointer;background:0 0;border:0;border-radius:999px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:7px 4px 5px;text-decoration:none;transition:color .16s,opacity .16s;display:flex;position:relative}.nav-item svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:23px;height:23px}.nav-item span{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:.68rem;font-weight:600;line-height:1.2;overflow:hidden}.nav-item.is-active{color:var(--on-primary-container)}.nav-item:active{opacity:.7}.nav-filter-defs{pointer-events:none;width:0;height:0;position:fixed}@media (width>=620px){.hero{padding-block:76px 56px}.compact-list{grid-template-columns:1fr 1fr}.compact-link:nth-child(odd){border-right:1px solid var(--outline-variant)}.compact-link:nth-last-child(-n+2){border-bottom:0}.sites-list{grid-template-columns:1fr 1fr}.floating-nav{width:330px;height:68px}.nav-item{min-height:56px}}@media (width<=480px){.page,.top-app-bar__inner{width:min(100% - 24px,680px)}.hero{gap:16px;padding-block:48px 40px}.avatar{border-radius:20px;flex-basis:64px;width:64px;height:64px}.main-link,.compact-link,.site-row{padding-inline:14px}.site-row{grid-template-columns:48px 1fr auto}.site-row__url{display:none}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important}.nav-liquid-indicator{animation:none!important}}