:root{--primary: #0a7ea4;--text: #11181c;--background: #f5f5f5;--surface: #ffffff;--border: #dcdcdc;--danger: #c0392b}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none;background:var(--background);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,Noto Sans JP,sans-serif}#app{position:relative;height:100%;display:flex;flex-direction:column;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.header{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(env(safe-area-inset-top) + 12px) 16px 12px;background:var(--background);font-size:17px;font-weight:600;color:var(--text);border-bottom:1px solid var(--border)}.mode-switch{display:flex;flex:none;padding:2px;border-radius:999px;background:#e6e9ea}.mode-switch__item{padding:6px 16px;border:none;border-radius:999px;background:none;color:#5d6567;font:inherit;font-size:14px;font-weight:600;touch-action:manipulation}.mode-switch__item.is-active{background:var(--surface);color:var(--primary)}.viewport{flex:1;position:relative;min-height:0;touch-action:none}.viewport--photo{background-color:#1b1d1e}.viewport__photo{display:none;background-repeat:no-repeat;background-size:100% 100%}.viewport--photo .viewport__photo{display:block}.viewport__mask{display:none;pointer-events:none;background-repeat:no-repeat;background-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-size:100% 100%;-webkit-mask-size:100% 100%}.viewport--photo .viewport__mask.has-mask{display:block}.viewport__mask.is-editing{box-shadow:inset 0 0 0 100vmax #0a7ea466}.viewport canvas{display:block;width:100%;height:100%}.sheet{flex:none;background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom)}.sheet__tabs{display:flex;border-bottom:1px solid var(--border)}.sheet__tab,.chip,.button{touch-action:manipulation}.sheet__tab{flex:1;padding:12px;border:none;background:none;font:inherit;color:#7a8388;border-bottom:2px solid transparent}.sheet__tab.is-active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}.sheet__body{padding:12px 16px 16px;min-height:92px}.grid{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;touch-action:pan-x}.chip{flex:none;display:flex;align-items:center;gap:6px;padding:10px 14px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text);font:inherit;font-size:14px}.chip__swatch{width:14px;height:14px;border-radius:4px;border:1px solid rgba(0,0,0,.15)}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.button{padding:10px 16px;border:none;border-radius:8px;background:var(--primary);color:#fff;font:inherit;font-size:14px}.button.is-danger{background:var(--danger)}.button.is-quiet{background:none;border:1px solid var(--border);color:#5d6567}.hint{margin:0;color:#7a8388;font-size:14px}.mask{display:grid;gap:8px;width:100%;align-content:start}.mask__toolbar{display:flex;align-items:center;gap:8px}.mask__toolbar .seg{flex:1}.mask__row{display:flex;align-items:center;gap:8px;min-height:36px}.mask__row .seg{flex:0 0 160px}.mask__spacer{flex:1}.photo,.photo__normal{display:grid;grid-template-columns:minmax(0,1fr);width:100%}.photo__note{margin-top:8px;font-size:12px}.setting{display:flex;align-items:center;gap:10px;width:100%;padding:10px 4px 10px 0;border:none;border-top:1px solid var(--border);background:none;color:var(--text);font:inherit;font-size:14px;text-align:left;touch-action:manipulation}.setting:first-child{border-top:none}.setting__label{flex:0 0 96px}.setting__value{flex:1;min-width:0;overflow:hidden;color:#7a8388;text-overflow:ellipsis;white-space:nowrap}.setting__value.is-set{color:var(--primary)}.setting__buttons{display:flex;gap:6px}.setting__chevron{color:#7a8388;font-size:18px;line-height:1}.button.is-small{padding:7px 12px;font-size:13px;white-space:nowrap}.seg{display:flex;flex:1;gap:2px;padding:2px;border-radius:8px;background:#e6e9ea}.seg__item{flex:1;padding:7px 0;border:none;border-radius:6px;background:none;color:#5d6567;font:inherit;font-size:14px;touch-action:manipulation}.seg__item.is-active{background:var(--surface);color:var(--primary);font-weight:600}.seg__item:disabled{opacity:.45}.manage{display:grid;gap:6px;width:100%;align-content:start}.manage__row{display:flex;align-items:center;gap:8px}.manage__label{flex:0 0 auto;min-width:44px;font-size:14px}.manage__value{flex:1;overflow:hidden;color:#7a8388;font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right;text-overflow:ellipsis}.manage__delete{justify-self:start;margin-top:4px}.nudge{flex:0 0 auto;width:44px;height:34px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--primary);font:inherit;font-size:17px;line-height:1;touch-action:manipulation;-webkit-user-select:none;user-select:none}.nudge:active{background:var(--primary);color:#fff}.hint.is-error{color:var(--danger)}.lib__login-hint{margin-top:6px;font-size:12px;text-align:center}.login{display:grid;gap:8px;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}.login__title{margin:0;font-size:14px;font-weight:600}.login__note{font-size:12px}.identity{font-size:12px;color:#7a8388}.identity summary{cursor:pointer}.identity code{display:block;margin-top:4px;padding:6px 8px;border-radius:6px;background:#eceff1;word-break:break-all;-webkit-user-select:all;user-select:all}.ring{flex:0 0 auto}.ring__track,.ring__value{transform:rotate(-90deg);transform-origin:50% 50%}.ring__track{stroke:var(--border)}.ring__value{stroke:var(--primary);stroke-linecap:round;transition:stroke-dashoffset .9s linear}@media(prefers-reduced-motion:reduce){.ring__value{transition:none}}.ring__label{fill:var(--text);font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}.progress{display:flex;align-items:center;gap:14px}.lib{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;width:100%}.lib__generate+.hint{margin-top:8px}.lib__generate{width:100%;text-align:center}.lib__label{margin:0 0 6px;font-size:12px;color:#7a8388}.lib__failure{flex-wrap:nowrap;justify-content:space-between;margin-top:6px}.thumbs{display:flex;gap:10px;overflow-x:auto;padding:6px 6px 4px 0;touch-action:pan-x}.thumb{position:relative;flex:none;width:72px}.thumb__button{display:grid;gap:4px;width:100%;padding:0;border:none;background:none;color:var(--text);font:inherit;font-size:12px;touch-action:manipulation}.thumb__button:disabled{color:#7a8388}.thumb__img{display:flex;align-items:center;justify-content:center;width:72px;height:72px;border:1px solid var(--border);border-radius:8px;background:#e6e2dc center / cover no-repeat}.thumb__img.is-running{background-color:#eceff1;background-blend-mode:luminosity;opacity:.85}.thumb .ring{width:56px;height:56px}.thumb__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.thumb__x{position:absolute;top:-6px;right:-6px;width:22px;height:22px;padding:0;border:1px solid var(--border);border-radius:50%;background:var(--surface);color:var(--text);font:inherit;font-size:13px;line-height:20px;touch-action:manipulation}