:root{--bg:#fff7ef;--panel:#fffdf9;--border:#ffd7a8;--text:#5b4b4b;--text-strong:#3c2f50;--muted:#7d6f81;--button:#ffeabf;--accent:#ff8fab;--accent-strong:#ff6b8a;--focus:#4d96ff;--safe-area-top:env(safe-area-inset-top,0px);--safe-area-right:env(safe-area-inset-right,0px);--safe-area-bottom:env(safe-area-inset-bottom,0px);--safe-area-left:env(safe-area-inset-left,0px);color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Hiragino Sans,Yu Gothic,Noto Sans JP,system-ui,-apple-system,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html,body,#root{min-height:100dvh;margin:0}body{overscroll-behavior:none;background:radial-gradient(circle at top,#fffdf9 0%,#fff7ef 45%,#ffeacc 100%);min-height:100dvh;overflow:hidden}#root{min-height:100dvh}button,input{font:inherit}button{cursor:pointer}h1,p{margin:0}h1{color:var(--text-strong);font-size:clamp(2rem,4vw,3.4rem);line-height:1.1}.app-shell{width:100dvw;min-width:100dvw;height:100dvh;min-height:100dvh;overflow:hidden}.app-shell,.app-shell *,.app-shell button,.app-shell img{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.app-shell button{-webkit-tap-highlight-color:transparent}.app-screen{width:100dvw;min-width:100dvw;height:100dvh;min-height:100dvh;padding-top:max(14px, var(--safe-area-top));padding-right:calc(14px + var(--safe-area-right));padding-bottom:calc(14px + var(--safe-area-bottom));padding-left:calc(14px + var(--safe-area-left));box-sizing:border-box;flex-direction:column;gap:16px;display:flex;overflow:hidden}.home-screen{justify-content:center;gap:28px}.portrait-notice{width:100dvw;height:100dvh;padding-top:max(18px, var(--safe-area-top));padding-right:calc(18px + var(--safe-area-right));padding-bottom:calc(18px + var(--safe-area-bottom));padding-left:calc(18px + var(--safe-area-left));box-sizing:border-box;place-items:center;display:grid}.portrait-notice__card{border:3px solid var(--border);text-align:center;background:radial-gradient(circle at top,#fffdf4 0%,#fff0be 38%,#ffe2c7 100%);border-radius:34px;justify-items:center;gap:14px;width:min(100%,560px);padding:28px 24px;display:grid;box-shadow:0 18px 42px #36255a24}.portrait-notice__icon{background:#ffffffd1;border-radius:32px;place-items:center;width:120px;height:120px;font-size:4rem;display:grid;box-shadow:inset 0 0 0 2px #ffffffe6}.portrait-notice__eyebrow{color:var(--accent-strong);letter-spacing:.16em;margin:0;font-size:.86rem;font-weight:800}.portrait-notice__title{margin:0;font-size:clamp(2rem,7vw,3.1rem)}.portrait-notice__text{color:var(--muted);margin:0;font-size:clamp(1rem,3.4vw,1.3rem);font-weight:700}.home-hero{text-align:center;gap:10px;display:grid}.home-hero__eyebrow{color:var(--accent-strong);letter-spacing:.18em;margin:0;font-size:.9rem;font-weight:800}.home-hero__lead{color:var(--muted);margin:0;font-size:1.05rem}.home-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;width:min(100%,980px);margin:0 auto;display:grid}.home-card{border:3px solid var(--border);background:var(--panel);min-height:min(38dvh,340px);color:var(--text-strong);border-radius:32px;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:28px 20px;transition:transform .18s,box-shadow .18s;display:flex;box-shadow:0 18px 36px #36255a1f}.home-card--drawing{background:radial-gradient(circle at top,#fff8d6 0%,#fff0bf 30%,#ffe4c6 100%)}.home-card--zoo{background:radial-gradient(circle at top,#ecffd7 0%,#dff6b9 36%,#ffe9c8 100%)}.home-card:hover,.home-card:focus-visible{transform:translateY(-3px);box-shadow:0 22px 42px #36255a2e}.home-card:focus-visible{outline:3px solid var(--focus);outline-offset:4px}.home-card__icon{background:#ffffffb8;border-radius:30px;place-items:center;width:clamp(92px,18vw,148px);height:clamp(92px,18vw,148px);font-size:clamp(3.4rem,7vw,5.4rem);display:grid;box-shadow:inset 0 0 0 2px #ffffffe6}.home-card__title{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800}.home-card__text{color:var(--muted);margin:0;font-size:1rem;font-weight:700}@media (width<=720px){.app-screen{padding-top:max(8px, var(--safe-area-top));padding-right:calc(8px + var(--safe-area-right));padding-bottom:calc(12px + var(--safe-area-bottom));padding-left:calc(8px + var(--safe-area-left));gap:10px}.home-screen{justify-content:center;gap:18px}.home-hero{gap:8px}.home-hero__eyebrow{font-size:.72rem}.home-hero__lead{font-size:.9rem}.home-grid{grid-template-columns:1fr;gap:12px}.home-card{border-radius:24px;min-height:min(26dvh,240px);padding:18px 16px}.home-card__icon{border-radius:24px;width:88px;height:88px;font-size:3.2rem}.home-card__title{font-size:1.7rem}.home-card__text{font-size:.9rem}.portrait-notice{padding-top:max(12px, var(--safe-area-top));padding-right:calc(12px + var(--safe-area-right));padding-bottom:calc(12px + var(--safe-area-bottom));padding-left:calc(12px + var(--safe-area-left))}.portrait-notice__card{border-radius:28px;gap:10px;padding:22px 18px}.portrait-notice__icon{border-radius:24px;width:96px;height:96px;font-size:3rem}}@media (orientation:landscape) and (pointer:coarse){.home-screen{justify-content:center;gap:18px}.home-hero{gap:8px}.home-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;width:min(100%,1100px)}.home-card{border-radius:26px;min-height:min(54dvh,300px);padding:18px}.home-card__icon{width:clamp(84px,13vw,118px);height:clamp(84px,13vw,118px);font-size:clamp(3rem,5vw,4rem)}.home-card__title{font-size:clamp(1.5rem,2.8vw,2.2rem)}.home-card__text{font-size:.9rem}}.drawing-app{gap:12px}.drawing-app,.drawing-app *,.drawing-toolbar,.drawing-canvas-panel,.drawing-canvas,.drawing-app button{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.drawing-toolbar,.drawing-canvas-panel{background:var(--panel);border:3px solid var(--border);border-radius:24px;box-shadow:0 12px 30px #36255a1f}.drawing-toolbar{flex-wrap:nowrap;flex:none;justify-content:space-between;align-items:flex-start;gap:16px;padding:14px 16px;display:flex}.drawing-toolbar__main,.drawing-toolbar__actions{align-items:center;gap:12px 16px;display:flex}.drawing-toolbar__main{flex-wrap:wrap;flex:auto;min-width:0}.drawing-toolbar__actions{flex-wrap:wrap;flex:none;justify-content:flex-end}.drawing-tool-group{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.drawing-tool-group--colors{flex:280px}.drawing-tool-group--size{flex:220px}.drawing-tool-label{color:var(--text-strong);flex:none;font-size:1rem;font-weight:700}.drawing-color-list{flex-wrap:wrap;gap:12px;display:flex}.drawing-color-swatch,.drawing-action-button,.drawing-size-preset{-webkit-tap-highlight-color:transparent;border:none;border-radius:18px;min-height:56px;transition:transform .15s,box-shadow .15s,background-color .15s}.drawing-color-swatch{border:4px solid #0000;width:56px;box-shadow:inset 0 0 0 2px #ffffffe6}.drawing-color-swatch.is-active{border-color:var(--text-strong);transform:translateY(-1px)}.drawing-size-presets{flex-wrap:wrap;gap:8px;display:flex}.drawing-size-preset{min-height:42px;color:var(--text-strong);background:#fff;border:2px solid #3c2f5024;padding:0 14px;font-size:.95rem;font-weight:700;box-shadow:0 6px 14px #36255a14}.drawing-size-preset.is-active{background:var(--accent);border-color:var(--accent);color:#fff}.drawing-action-button{color:var(--text-strong);background:var(--button);justify-content:center;align-items:center;gap:6px;padding:0 18px;font-size:1rem;font-weight:700;display:inline-flex;box-shadow:0 6px 14px #36255a1f}.drawing-action-button--home{background:#fff}.drawing-action-button--primary{background:var(--accent-strong);color:#fff}.drawing-color-swatch:hover,.drawing-color-swatch:focus-visible,.drawing-action-button:hover,.drawing-action-button:focus-visible,.drawing-size-preset:hover,.drawing-size-preset:focus-visible{transform:translateY(-1px);box-shadow:0 8px 18px #36255a2e}.drawing-color-swatch:focus-visible,.drawing-action-button:focus-visible,.drawing-size-preset:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.drawing-canvas-panel{flex:auto;min-height:0;padding:12px;overflow:hidden}.drawing-canvas{touch-action:none;-ms-touch-action:none;cursor:crosshair;background:#fff;border-radius:18px;width:100%;height:100%;min-height:0;display:block}@media (width<=720px) and (orientation:portrait){.drawing-app{gap:8px}.drawing-toolbar{border-radius:18px;flex-wrap:nowrap;align-items:stretch;gap:8px;padding:8px 10px}.drawing-toolbar__main{flex-direction:column;flex:1;align-items:stretch;gap:6px}.drawing-toolbar__actions{flex-direction:column;align-self:flex-start;gap:6px;width:auto}.drawing-tool-group{flex-wrap:nowrap;align-items:center;gap:6px}.drawing-tool-group--colors,.drawing-tool-group--size{flex:none;width:100%;min-width:0}.drawing-tool-label{display:none}.drawing-color-list{flex-wrap:nowrap;justify-content:space-between;gap:6px;width:100%}.drawing-color-swatch{border-width:2px;border-radius:999px;flex:0 0 30px;width:30px;min-height:30px}.drawing-size-presets{flex-wrap:nowrap;gap:6px;width:100%}.drawing-size-preset{border-radius:999px;flex:1 1 0;min-height:30px;padding:0 6px;font-size:.74rem}.drawing-action-button{border-radius:12px;min-height:36px;padding:0 12px;font-size:.78rem}.drawing-canvas-panel{padding:8px 8px 10px}}@media (orientation:landscape) and (pointer:coarse){.drawing-app{flex-direction:column;gap:10px;display:flex}.drawing-toolbar{border-radius:20px;flex-direction:row;justify-content:space-between;align-items:flex-start;gap:8px;padding:10px}.drawing-toolbar__main,.drawing-toolbar__actions{flex-direction:row;align-items:center;gap:8px}.drawing-toolbar__main{flex-wrap:wrap;flex:auto;min-width:0}.drawing-toolbar__actions{flex-wrap:nowrap;flex:none}.drawing-tool-group{flex-flow:wrap;align-items:center;gap:8px}.drawing-tool-group--colors,.drawing-tool-group--size{flex:220px}.drawing-tool-label{display:none}.drawing-color-list{flex-wrap:nowrap;justify-content:space-between;gap:8px;width:100%;display:flex}.drawing-color-swatch{border-width:2px;border-radius:999px;flex:0 0 34px;width:34px;min-height:34px}.drawing-size-presets{flex-flow:row;gap:8px;width:100%}.drawing-size-preset{border-radius:16px;flex:1 1 0;min-height:34px;padding:0 12px;font-size:.86rem}.drawing-action-button{white-space:nowrap;border-radius:14px;min-height:38px;padding:0 12px;font-size:.8rem}.drawing-canvas-panel{border-radius:22px;padding:8px}.drawing-canvas{border-radius:16px}}.zoo-app{gap:12px}.zoo-app,.zoo-app *,.zoo-stage,.zoo-stage__stamp,.zoo-stamp-chip,.zoo-app button,.zoo-app img{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.zoo-toolbar,.zoo-stage-panel,.zoo-stamp-panel{background:var(--panel);border:3px solid var(--border);border-radius:24px;box-shadow:0 12px 30px #36255a1f}.zoo-toolbar{justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;display:flex}.zoo-toolbar__title{align-items:center;gap:14px;min-width:0;display:flex}.zoo-toolbar__emoji{background:linear-gradient(#fff7b8 0%,#ffd36f 100%);border-radius:18px;flex:none;place-items:center;width:58px;height:58px;font-size:2rem;display:inline-grid}.zoo-toolbar__heading{margin:0;font-size:clamp(1.5rem,3vw,2.3rem)}.zoo-toolbar__hint{color:var(--muted);margin:4px 0 0;font-size:.98rem}.zoo-toolbar__actions{flex:none;align-items:center;gap:10px;display:flex}.zoo-action-button{width:58px;height:58px;color:var(--text-strong);-webkit-tap-highlight-color:transparent;background:#fff;border:none;border-radius:18px;font-size:1.8rem;box-shadow:0 8px 18px #36255a1f}.zoo-action-button--home{background:#e9f4ff}.zoo-action-button--danger{background:#ffe3d6}.zoo-action-button:disabled{opacity:.45;box-shadow:none}.zoo-action-button:not(:disabled):hover,.zoo-action-button:not(:disabled):focus-visible{transform:translateY(-1px);box-shadow:0 10px 20px #36255a2e}.zoo-action-button:focus-visible,.zoo-stage__stamp:focus-visible,.zoo-stamp-chip:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.zoo-stage-panel{flex:auto;justify-content:center;align-items:center;min-height:0;padding:12px;display:flex}.zoo-stage{aspect-ratio:16/10;touch-action:none;background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:22px;width:min(100%,980px);height:100%;min-height:320px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 2px #ffffffb8}.zoo-stage:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 -50px 80px #ffffff24}.zoo-stage__stamp{touch-action:none;-webkit-tap-highlight-color:transparent;background:0 0;border:none;place-items:center;padding:0;display:grid;position:absolute;transform:translate(-50%,-50%)}.zoo-stage__stamp.is-selected{filter:drop-shadow(0 0 0 4px #fffffff2) drop-shadow(0 0 0 8px #4d96ff66)}.zoo-stage__stamp-image{pointer-events:none;width:100%;height:auto;display:block}.zoo-stamp-panel{flex:none;padding:12px}.zoo-stamp-list{touch-action:pan-x;scrollbar-width:none;grid-auto-columns:minmax(88px,102px);grid-auto-flow:column;gap:10px;padding-bottom:4px;display:grid;overflow:auto hidden}.zoo-stamp-list::-webkit-scrollbar{display:none}.zoo-stamp-chip{-webkit-tap-highlight-color:transparent;border:3px solid #0000;border-radius:22px;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:110px;padding:10px 8px;display:flex;overflow:hidden;box-shadow:0 8px 16px #36255a1a}.zoo-stamp-chip.is-active{border-color:var(--focus);transform:translateY(-1px);box-shadow:0 10px 20px #36255a29}.zoo-stamp-chip__image{object-fit:contain;pointer-events:none;width:auto;max-width:min(100%,66px);height:auto;max-height:52px}.zoo-stamp-chip__label{min-width:58px;color:var(--text-strong);background:#ffffffd1;border-radius:999px;justify-content:center;align-items:center;padding:4px 8px;font-size:.76rem;font-weight:700;display:inline-flex}@media (width<=720px) and (orientation:portrait){.zoo-app{gap:8px}.zoo-toolbar{align-items:flex-start;gap:10px;padding:10px}.zoo-toolbar__emoji{border-radius:14px;width:46px;height:46px;font-size:1.6rem}.zoo-toolbar__heading{font-size:1.4rem}.zoo-toolbar__hint{font-size:.8rem}.zoo-toolbar__actions{gap:6px}.zoo-action-button{border-radius:14px;width:44px;height:44px;font-size:1.4rem}.zoo-stage-panel{padding:8px}.zoo-stage{border-radius:18px;min-height:280px}.zoo-stamp-panel{padding:8px}.zoo-stamp-list{grid-auto-columns:minmax(80px,90px);gap:8px}.zoo-stamp-chip{border-radius:18px;min-height:96px;padding:8px 6px}.zoo-stamp-chip__image{max-width:min(100%,52px);max-height:42px}.zoo-stamp-chip__label{min-width:50px;font-size:.7rem}}@media (orientation:landscape) and (pointer:coarse){.zoo-app{grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1fr) clamp(168px,22vw,224px);align-items:stretch;gap:8px;display:grid}.zoo-toolbar{border-radius:18px;grid-area:1/2;padding:8px}.zoo-toolbar__title{display:none}.zoo-toolbar__actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%;display:grid}.zoo-action-button{border-radius:14px;width:auto;height:clamp(40px,7dvh,48px);font-size:1.15rem}.zoo-stage-panel{border-radius:20px;grid-area:1/1/span 2;min-width:0;padding:6px}.zoo-stage{aspect-ratio:auto;border-radius:14px;width:100%;height:100%;min-height:0}.zoo-stamp-panel{border-radius:18px;grid-area:2/2;min-width:0;min-height:0;padding:6px;display:flex;overflow:hidden}.zoo-stamp-panel:before{content:"";display:none}.zoo-stamp-list{touch-action:pan-y;flex:auto;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(72px,auto);grid-auto-flow:row;align-content:start;gap:6px;width:100%;height:100%;min-height:0;padding-bottom:0;padding-right:2px;overflow:hidden auto}.zoo-stamp-chip{border-radius:16px;gap:4px;min-height:74px;padding:6px 4px;overflow:hidden}.zoo-stamp-chip__image{max-width:min(100%,40px);max-height:30px}.zoo-stamp-chip__label{width:100%;min-width:0;padding:3px 4px;font-size:.6rem;line-height:1.1}}