:root{--ink:#111;--muted:#6b6b6b;--hairline:#e8e8e8;--accent:#5b4cff;--accent-ink:#fff;--accent-soft:#eeedff;--bg:#fff;--surface:#f6f6f7;--surface-2:#ececef;--danger:#c62828;--danger-soft:#fdecec;--overlay:#111111f5;--font:"Pretendard Variable", Pretendard, Inter, -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;--radius-s:6px;--radius:10px;--radius-l:14px;--shadow-hover:0 1px 2px #1111110a, 0 10px 28px #1111111a;--shadow-menu:0 1px 2px #1111110f, 0 12px 32px #11111124;--gutter:16px;--max:1440px;--topbar-h:56px;--ease:cubic-bezier(.2, .7, .2, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (width>=720px){:root{--gutter:32px}}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;height:100%}body{min-height:100%;font-family:var(--font);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0;font-size:14px;line-height:1.45;overflow-x:hidden}body.viewer-open{overflow:hidden}h1,h2,h3,p,ul,ol,figure{margin:0}img,svg{max-width:100%;display:block}a{color:inherit}button,input{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}kbd{font-family:var(--font);border:1px solid var(--hairline);background:var(--surface);border-bottom-width:2px;border-radius:5px;padding:1px 6px;font-size:12px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}.container{width:min(100% - 2 * var(--gutter), var(--max));margin-inline:auto}.grid-12{grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;display:grid}.muted{color:var(--muted)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.btn{border:1px solid var(--hairline);background:var(--bg);height:36px;color:var(--ink);cursor:pointer;white-space:nowrap;transition:background-color .12s, border-color .12s, transform .12s var(--ease);border-radius:8px;justify-content:center;align-items:center;gap:6px;padding:0 14px;font-weight:500;text-decoration:none;display:inline-flex}.btn:hover{background:var(--surface)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:default;transform:none}.btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn--primary:hover{background:#4b3df0}.btn--ghost{background:0 0;border-color:#0000}.btn--danger{color:var(--danger)}.btn--danger:hover{background:var(--danger-soft)}.btn--danger-solid{background:var(--danger);border-color:var(--danger);color:#fff}.btn--danger-solid:hover{background:#b71c1c}.btn--sm{height:30px;padding:0 10px;font-size:13px}.btn--block{width:100%}.field{gap:6px;display:grid}.field__label{font-size:13px;font-weight:500}.input{border:1px solid var(--hairline);background:var(--bg);border-radius:8px;width:100%;height:40px;padding:0 12px;transition:border-color .12s}.input:hover{border-color:#cfcfd4}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}.input::placeholder{color:#9a9a9f}.page{padding:28px 0 64px}.page-head{flex-wrap:wrap;align-items:baseline;gap:8px 14px;margin-bottom:20px;display:flex}.page-title{letter-spacing:-.01em;font-size:20px;font-weight:600}.page-count{color:var(--muted);font-size:13px}.page-head__actions{align-items:center;gap:8px;margin-left:auto;display:flex}.link{color:var(--accent);text-decoration:none}.link:hover{text-decoration:underline}.danger-text{color:var(--danger);font-size:13px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.topbar{z-index:20;-webkit-backdrop-filter:saturate(1.4)blur(8px);backdrop-filter:saturate(1.4)blur(8px);border-bottom:1px solid var(--hairline);background:#ffffffeb;position:sticky;top:0}.topbar__inner{min-height:var(--topbar-h);grid-template-columns:auto 1fr auto;grid-template-areas:"brand nav account""search search search";align-items:center;column-gap:16px;padding:6px 0;display:grid}.topbar__inner.no-search{grid-template-areas:"brand nav account"}.topbar__brand{grid-area:brand}.topbar__nav{grid-area:nav;gap:2px;display:flex}.topbar__search{grid-area:search;margin:4px 0 6px}.topbar__account{grid-area:account;position:relative}@media (width>=720px){.topbar__inner{grid-template-columns:auto auto 1fr auto;grid-template-areas:"brand nav search account";padding:0}.topbar__inner.no-search{grid-template-columns:auto 1fr auto}.topbar__search{width:min(100%,420px);margin:0 auto}}.topbar__account{justify-self:end}.wordmark{letter-spacing:-.03em;color:var(--ink);font-size:18px;font-weight:800;line-height:1;text-decoration:none}.wordmark__dot{background:var(--accent);vertical-align:baseline;border-radius:50%;width:7px;height:7px;margin-left:2px;display:inline-block}.navlink{height:32px;color:var(--muted);border-radius:8px;align-items:center;padding:0 10px;font-size:13px;font-weight:500;text-decoration:none;display:inline-flex}.navlink:hover{color:var(--ink);background:var(--surface)}.navlink[aria-current=page]{color:var(--ink);background:var(--surface-2)}.search{position:relative}.search .input{background:var(--surface);border-color:#0000;height:36px;padding-left:34px}.search .input:focus{background:var(--bg)}.search__icon{color:var(--muted);pointer-events:none;position:absolute;top:50%;left:11px;transform:translateY(-50%)}.avatar-btn{background:var(--accent-soft);width:32px;height:32px;color:var(--accent);cursor:pointer;text-transform:uppercase;border:1px solid #0000;border-radius:50%;font-size:13px;font-weight:700}.avatar-btn:hover,.avatar-btn[aria-expanded=true]{border-color:var(--accent)}.menu{background:var(--bg);border:1px solid var(--hairline);border-radius:var(--radius);min-width:240px;box-shadow:var(--shadow-menu);z-index:30;gap:2px;padding:6px;display:grid;position:absolute;top:calc(100% + 8px);right:0}.menu__email{color:var(--muted);border-bottom:1px solid var(--hairline);margin-bottom:4px;padding:8px 10px 10px;font-size:12px}.menu__item{text-align:left;border-radius:var(--radius-s);cursor:pointer;background:0 0;border:0;width:100%;padding:8px 10px;font-size:13px;text-decoration:none;display:block}.menu__item:hover{background:var(--surface)}.sites-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:28px 20px;margin:0;padding:0;list-style:none;display:grid}@media (width<=539px){.sites-grid{grid-template-columns:1fr}}.shots-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));grid-auto-rows:1px;grid-auto-flow:dense;gap:0 20px;margin:0;padding:0;list-style:none;display:grid}.shots-grid>li{min-width:0;padding-bottom:28px}.shots-grid.is-uniform{grid-auto-rows:auto;row-gap:28px}.shots-grid.is-uniform>li{padding-bottom:0}@media (width<=719px){.shots-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));column-gap:14px}.shots-grid>li{padding-bottom:20px}}.card-frame{border:1px solid var(--hairline);background:var(--surface);transition:transform .15s var(--ease), box-shadow .15s var(--ease), border-color .15s;border-radius:12px;display:block;position:relative;overflow:hidden}.card-link{color:inherit;border-radius:12px;text-decoration:none;display:block}.card-link:hover .card-frame,.card-link:focus-visible .card-frame{box-shadow:var(--shadow-hover);border-color:#dcdce0;transform:translateY(-1px)}.site-card__cover{aspect-ratio:16/10}.site-card__cover img{object-fit:cover;object-position:top;width:100%;height:100%}.site-card__nocover{width:100%;height:100%;color:var(--muted);place-items:center;font-size:12px;display:grid}.site-card__row{align-items:center;gap:8px;min-width:0;margin-top:10px;display:flex}.site-card__host{min-width:0;font-size:13px;font-weight:500}.site-card__meta{color:var(--muted);gap:6px;margin-top:2px;font-size:12px;display:flex}.favicon{object-fit:contain;border-radius:3px;flex:none;width:16px;height:16px}.favicon--letter{background:var(--surface-2);color:var(--muted);text-transform:uppercase;place-items:center;font-size:10px;font-weight:700;display:inline-grid}.shot-card__frame img{object-fit:cover;object-position:top;width:100%;height:100%}.shot-card__meta{gap:1px;padding:8px 2px 0;font-size:12px;line-height:1.35;display:grid}.shot-card__path{font-weight:500}.shot-card__title{color:var(--muted)}.shot-card__host{color:var(--muted);align-items:center;gap:6px;display:flex}.shot-card__host .favicon{width:12px;height:12px}.skeleton{background:linear-gradient(90deg,#f0f0f2 25%,#f8f8f9 37%,#f0f0f2 63%) 0 0/400% 100%;border-radius:8px;animation:1.4s infinite shimmer}@keyframes shimmer{0%{background-position:100% 0}to{background-position:0 0}}.skeleton--cover{aspect-ratio:16/10;border-radius:12px}.skeleton--line{height:12px;margin-top:10px}.state{text-align:center;justify-items:center;gap:12px;max-width:480px;margin:64px auto;display:grid}.state__title{font-size:16px;font-weight:600}.state__text{color:var(--muted);font-size:13px}.loadmore{justify-content:center;margin-top:36px;display:flex}.spinner{border:2px solid var(--hairline);border-top-color:var(--accent);border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.page-loading{place-items:center;min-height:60vh;display:grid}.empty{text-align:center;justify-items:center;gap:24px;max-width:560px;margin:48px auto 64px;display:grid}.pill-preview{color:#fff;background:#111;border-radius:999px;align-items:center;gap:10px;padding:10px 18px 10px 14px;font-size:15px;display:inline-flex;box-shadow:0 12px 32px #1111112e}.pill-preview .wordmark{color:#fff;font-size:15px}.pill-preview__word{letter-spacing:-.01em;font-weight:600}.empty__title{letter-spacing:-.01em;font-size:22px;font-weight:600}.empty__text{color:var(--muted);max-width:44ch}.steps{text-align:left;counter-reset:step;gap:12px;width:100%;margin:0;padding:0;list-style:none;display:grid}.steps>li{counter-increment:step;grid-template-columns:24px 1fr;align-items:start;gap:12px;font-size:14px;display:grid}.steps>li:before{content:counter(step);background:var(--accent-soft);width:24px;height:24px;color:var(--accent);border-radius:50%;place-items:center;font-size:12px;font-weight:700;display:grid}.steps code{background:var(--surface);border-radius:4px;padding:1px 5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}.ext-status{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;display:inline-flex}.empty .ext-status{justify-content:center}.ext-status__dot{background:#c4c4c8;border-radius:50%;flex:none;width:8px;height:8px}.ext-status__dot.is-connected{background:#1f9d55}.ext-status__dot.is-installed{background:#e0a100}.signin{min-height:100vh;padding:var(--gutter);place-items:center;display:grid}.signin__card{gap:20px;width:100%;max-width:380px;display:grid}.signin__title{letter-spacing:-.01em;font-size:22px;font-weight:600}.signin__form{gap:14px;display:grid}.signin__hint{color:var(--muted);font-size:13px;line-height:1.5}.signin__row{flex-wrap:wrap;justify-content:space-between;gap:12px;display:flex}.input--code{letter-spacing:.4em;text-align:center;font-variant-numeric:tabular-nums;height:52px;font-size:24px}.form-error{color:var(--danger);font-size:13px}.site-head{flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:24px;display:flex}.site-head__icon{border:1px solid var(--hairline);background:var(--bg);border-radius:9px;place-items:center;width:36px;height:36px;display:grid}.site-head__icon .favicon{width:20px;height:20px}.site-head__text{gap:2px;min-width:0;display:grid}.site-head__title{color:var(--muted);font-size:13px}.confirm{flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;display:inline-flex}.account{gap:32px;max-width:640px;display:grid}.account__section{border-top:1px solid var(--hairline);gap:14px;padding-top:24px;display:grid}.account__section:first-child{border-top:0;padding-top:0}.account__h{font-size:15px;font-weight:600}.kv{grid-template-columns:140px 1fr;gap:8px 16px;font-size:14px;display:grid}.kv dt{color:var(--muted)}.kv dd{overflow-wrap:anywhere;min-width:0;margin:0}.actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.toasts{z-index:60;pointer-events:none;gap:8px;display:grid;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast{color:#fff;animation:toast-in .2s var(--ease);white-space:nowrap;background:#111;border-radius:999px;padding:10px 16px;font-size:13px;box-shadow:0 12px 32px #1113}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}.viewer{z-index:50;background:var(--overlay);color:#fff;outline:none;grid-template-rows:minmax(0,1fr) auto;animation:.15s fade-in;display:grid;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}}.viewer__stage{justify-content:center;align-items:center;min-height:0;padding:56px 72px 24px;display:flex;position:relative}.viewer__img{object-fit:contain;background:#1c1c1c;border-radius:4px;width:auto;max-width:100%;height:auto;max-height:100%;box-shadow:0 24px 80px #0000008c}.viewer__nav{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #ffffff24;border-radius:50%;place-items:center;width:44px;height:44px;transition:background-color .12s;display:grid;position:absolute;top:50%;transform:translateY(-50%)}.viewer__nav:hover{background:#ffffff2e}.viewer__nav:disabled{opacity:.25;cursor:default}.viewer__nav--prev{left:16px}.viewer__nav--next{right:16px}.viewer__close{position:absolute;top:12px;right:16px;transform:none}.viewer__counter{color:#fff9;font-variant-numeric:tabular-nums;font-size:13px;position:absolute;top:22px;left:20px}.viewer__bar{color:#cfcfd4;background:#111111e6;border-top:1px solid #ffffff1a;flex-wrap:wrap;align-items:center;gap:8px 18px;min-height:56px;padding:12px 20px;font-size:13px;display:flex}.viewer__site{color:#fff;align-items:center;gap:8px;font-weight:500;display:inline-flex}.viewer__title{color:#fff;max-width:44ch;font-weight:500}.viewer__url{color:#a9a9b1;max-width:44ch;text-decoration:none}.viewer__url:hover{color:#fff;text-decoration:underline}.viewer__spacer{flex:1}.viewer__meta{color:#a9a9b1;font-variant-numeric:tabular-nums;gap:16px;display:inline-flex}.viewer__actions{align-items:center;gap:8px;display:inline-flex}.viewer .btn{color:#fff;background:0 0;border-color:#ffffff2e}.viewer .btn:hover{background:#ffffff1a}.viewer .btn--danger{color:#ff7a7a}.viewer .btn--danger:hover{background:#ff505024}.viewer .btn--danger-solid{background:var(--danger);border-color:var(--danger)}.viewer :focus-visible{outline-color:#fff}.viewer__error{color:#cfcfd4;justify-items:center;gap:12px;display:grid}@media (width<=719px){.viewer__stage{padding:56px 12px 16px}.viewer__nav{width:36px;height:36px}.viewer__nav--prev{left:8px}.viewer__nav--next{right:8px}.viewer__bar{gap:6px 14px;padding:12px 16px}.viewer__title,.viewer__url{max-width:100%}}