@charset "UTF-8";
:root{font-family:Inter,"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",system-ui,sans-serif;color:#293c40;background:#f4f6f1;font-synthesis:none;font-size:15px;--mint:#416c64;--line:#dce3dc;--pet-w:106px;--pet-h:100px}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #75c0b3;outline-offset:4px}button{border:0}button:disabled{cursor:default;opacity:.6}a{color:inherit}button:active{filter:brightness(.96)}[hidden]{display:none!important}
#preview{max-width:1120px;margin:auto;padding:0 48px}.masthead{height:100px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{display:flex;gap:11px;align-items:center;text-decoration:none;font-size:16px;letter-spacing:.12em;font-weight:750}.brand small{display:block;font-size:8px;letter-spacing:.17em;margin-top:3px;font-weight:600;color:#7b8d89}.brand-mark{display:grid;place-items:center;border:1px solid #b5c6bd;width:34px;height:34px;border-radius:12px;color:#4f7b6e;font-size:26px}.version{font-size:10px;letter-spacing:.09em;color:#7a8b80}.version b{margin-left:10px;background:#e1e9df;padding:7px 10px;border-radius:20px;color:#51634e}.workspace{display:grid;grid-template-columns:1fr 388px;gap:42px 68px;padding:46px 0 36px}.intro{padding-top:38px}.eyebrow{font-size:11px;letter-spacing:.14em;color:#758c7e;font-weight:600;margin:0 0 22px}h1{font-size:55px;font-weight:600;line-height:1.4;letter-spacing:.03em;margin:0 0 22px}.lead{font-size:14px;line-height:2.1;color:#718279;margin:0 0 28px}.primary-actions{display:flex;gap:10px}.primary,.secondary{padding:14px 21px;border-radius:13px;font-weight:600;font-size:13px;display:inline-flex;align-items:center;justify-content:center;gap:25px;min-height:46px}.primary{color:#fff;background:#426d64}.secondary{border:1px solid #ced9cf;background:#fbfcf7;color:#4e655b}.instructions{display:grid;grid-template-columns:1fr 1.15fr;gap:20px 10px;margin:34px 0 22px;max-width:390px}.instructions>div{display:flex;align-items:baseline;gap:10px;font-size:11px}.instructions b{color:#96a79a;font-size:10px;font-weight:500}.instructions small{display:block;color:#8d9b91;margin-top:5px;font-size:10px}.preview-note{font-size:10px;line-height:1.8;color:#8c9a90}.preview-column{max-width:388px}.phone-caption{display:flex;align-items:center;gap:8px;font-size:9px;font-weight:600;letter-spacing:.1em;color:#71857d;margin:0 6px 13px}.phone-caption>span:last-child{margin-left:auto;font-size:10px;font-weight:400;letter-spacing:0}.live-dot{width:5px;height:5px;border-radius:50%;background:#76a99a}
#stage{height:608px;position:relative;overflow:hidden;border:6px solid #e5eae2;border-radius:36px;background:radial-gradient(ellipse at 20% 70%,#91b4b2aa,transparent 55%),radial-gradient(ellipse at 87% 28%,#b4c7c88a,transparent 50%),linear-gradient(155deg,#304755,#527278 50%,#82a39b);isolation:isolate;box-shadow:0 24px 45px -30px #34483b80,inset 0 0 0 1px #ffffff2e}#stage::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 32%,#fff6 1px,transparent 2px),radial-gradient(circle at 90% 51%,#fff3 1px,transparent 2px),radial-gradient(circle at 37% 60%,#fff3 1px,transparent 2px),radial-gradient(circle at 80% 15%,#fff5 1px,transparent 2px);pointer-events:none}.phone-status{display:flex;justify-content:space-between;color:#eaf3ef;font-size:10px;padding:15px 21px}.home-clock{color:#f1f6f3;font-size:61px;font-weight:200;text-align:center;letter-spacing:-.05em;padding-top:22px}.home-clock>span{opacity:.65}.home-clock small{display:block;font-size:9px;letter-spacing:.14em;font-weight:400;margin-top:1px;color:#d2e2df}.home-message{position:absolute;top:187px;left:22px;right:22px;border:1px solid #dfedeb38;border-radius:17px;background:#e6f3eb16;display:flex;align-items:center;padding:15px;gap:12px;color:#edf6f1}.home-message>span{font-size:22px;color:#c6e4d7}.home-message p{margin:0;font-size:12px;line-height:1.7}.home-message small{display:block;font-size:9px;opacity:.65}.home-apps{position:absolute;display:flex;justify-content:space-between;bottom:43px;left:25px;right:25px}.home-app{display:flex;align-items:center;flex-direction:column;gap:7px;background:transparent;color:#e7f2ef;font-size:9px;padding:0;min-width:49px}.home-app>span{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;border:1px solid #eaf5eb38;background:#e2efe12b;color:#f2f8f0;font-size:27px}.home-bar{position:absolute;width:100px;height:4px;bottom:13px;left:calc(50% - 50px);border-radius:9px;background:#e3eee8c9}.background-feedback{position:absolute;left:20px;right:20px;top:290px;text-align:center;color:#dceee2;font-size:11px;pointer-events:none}.state-strip{display:flex;justify-content:space-between;font-size:10px;margin:16px 8px 0;color:#7b9087}.state-strip>span:first-child{font-size:9px;letter-spacing:.1em;font-weight:700;color:#4c756a}
.settings-card{grid-column:1/-1;background:#fbfcf8;border:1px solid #dce4d9;border-radius:22px;padding:25px 29px}.settings-heading .eyebrow{font-size:9px;margin-bottom:9px}.settings-heading h2{font-size:20px;font-weight:550;margin:0 0 7px}.settings-heading p{font-size:11px;color:#809185;margin:0 0 24px}.settings-grid{display:grid;grid-template-columns:1fr 1fr 1.3fr 1fr;gap:24px}.settings-grid label{font-size:11px;color:#657d6c;display:block}select{width:100%;margin-top:10px;border:1px solid #dce4d9;border-radius:9px;background:#f2f5ee;color:#405c4d;padding:10px 7px;font-size:11px;min-height:39px}input[type=range]{width:100%;accent-color:#668f78;margin-top:19px}output{float:right;color:#4d6f56}.settings-bottom{display:flex;gap:22px;align-items:center;border-top:1px solid #e3e9df;margin-top:23px;padding-top:17px;font-size:11px}.toggle-label{display:flex;align-items:center;gap:6px;color:#758a7b}.toggle-label input{accent-color:#577f68;width:15px;height:15px}.text-button{background:transparent;color:#547c66;font-size:11px;padding:6px 0;margin-left:auto}.link-settings{border-top:1px solid #e3e9df;margin-top:16px;padding-top:15px;font-size:11px;color:#748779}.link-settings summary{cursor:pointer}.link-settings p{font-size:10px}.link-settings .secondary{padding:8px 15px;min-height:34px;font-size:11px}#link-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}#link-fields label{display:block}#link-fields input{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:9px;margin-top:6px;font-size:11px;background:#fff;color:#374d40}footer{display:flex;justify-content:space-between;padding:0 0 25px;color:#8d9b90;font-size:9px;letter-spacing:.04em}
#companion{position:absolute;z-index:10;display:flex;flex-direction:column;align-items:flex-end;width:max-content;max-width:100%;user-select:none;-webkit-user-select:none;touch-action:auto;color:#34444d;font-family:inherit}#character-row{position:relative;display:flex;justify-content:flex-end;padding:7px 0 0}#character{position:relative;display:block;padding:0;width:var(--pet-w);height:var(--pet-h);background:transparent;border:0;cursor:grab;touch-action:none;flex:none;outline-offset:-4px}#character:active{cursor:grabbing;filter:none}#visual{display:block;position:absolute;inset:0;transform-origin:50% 93%;animation:breathe 4.6s ease-in-out infinite}#visual img{position:absolute;width:100%;height:100%;inset:0;object-fit:contain;object-position:center bottom;pointer-events:none;opacity:0;filter:drop-shadow(0 5px 4px #173a3a18);transition:opacity 420ms ease}#companion[data-form=BIRD] #bird-image,#companion[data-form=HUMAN] #human-image{opacity:1}#menu-button{position:absolute;bottom:0;right:0;width:34px;height:27px;background:#f4fbf4ec;border:1px solid #c5d9cb;border-radius:12px;color:#587567;letter-spacing:1px;font-size:12px;line-height:16px;box-shadow:0 3px 9px #193b391c}.speech{max-width:248px;min-width:155px;background:#fffffff5;border:1px solid #d0e1d7;border-radius:17px 17px 4px 17px;padding:11px 15px;margin-bottom:0;box-shadow:0 5px 22px #112a3520;pointer-events:auto;touch-action:pan-y}.speech .speaker{color:#799386;font-size:9px;letter-spacing:.1em}.speech p{font-size:12px;line-height:1.65;margin:4px 0 0;overflow-wrap:anywhere;white-space:pre-wrap}.companion-panel{padding:11px;min-width:217px;max-width:255px;max-height:245px;overflow:auto;background:#fbfffbed;border:1px solid #c9ddd0;border-radius:17px;box-shadow:0 8px 25px #203f4e26;touch-action:pan-y;margin-top:5px;font-size:11px}.panel-title{display:flex;justify-content:space-between;align-items:center;padding:0 3px 5px;color:#799083;font-size:10px}.panel-title button{background:transparent;color:#687f76;font-size:18px;min-width:30px;min-height:30px}.companion-panel>button{display:flex;align-items:center;justify-content:space-between;background:transparent;width:100%;text-align:left;padding:11px 10px;color:#3e5b4e;font-size:12px;min-height:40px;border-radius:9px}.companion-panel>button:hover{background:#eaf1e8}.companion-panel>button.accent{background:#e9f1e7}.panel-note{color:#8c9c93;font-size:9px;line-height:1.5;margin:8px 9px}.companion-panel .panel-line{height:1px;background:#e2eae0;margin:5px 7px}#sleep-symbol{position:absolute;top:8%;right:7%;font-size:15px;font-weight:600;letter-spacing:4px;color:#e3f1ed;text-shadow:0 1px 3px #467873;opacity:0;pointer-events:none}#sleep-symbol span{font-size:10px;vertical-align:top}#companion[data-sleeping=true] #sleep-symbol{opacity:1}#companion[data-sleeping=true] #visual{animation-duration:7s}#companion[data-dragging=true] #visual{animation-play-state:paused}#glow{position:absolute;inset:10%;border-radius:50%;background:radial-gradient(ellipse,#fff 10%,#e5fff273 40%,transparent 72%);opacity:0;pointer-events:none}#feathers{position:absolute;inset:0;opacity:0;pointer-events:none}#feathers i{font-style:normal;position:absolute;color:#fcfff5;text-shadow:0 0 8px #b8ecdd;font-size:22px;top:50%;left:20%}#feathers i:nth-child(2){top:23%;left:75%;font-size:14px}#feathers i:nth-child(3){top:60%;left:80%;font-size:16px}#feathers i:nth-child(4){top:10%;left:40%}#companion[data-transitioning=true] #glow{animation:glow 420ms ease-out}#companion[data-transitioning=true] #feathers{animation:feathers 420ms ease-out}#companion[data-reduced=true] #visual{animation:none}#companion[data-reduced=true] #visual img{transition:none}#companion[data-reduced=true] #glow,#companion[data-reduced=true] #feathers{display:none}
@keyframes breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.006,1.008)}}@keyframes glow{0%,100%{opacity:0}45%{opacity:.85}}@keyframes feathers{0%{opacity:0;transform:scale(.7) translateY(12px)}50%{opacity:1}100%{opacity:0;transform:scale(1.2) translateY(-15px)}}
body.overlay{background:transparent;overflow:hidden}body.overlay #preview{display:none}body.overlay #companion{position:relative;left:0!important;top:0!important;margin:0}
@media(prefers-reduced-motion:reduce){#visual{animation:none}#visual img{transition:none}#glow,#feathers{display:none}}
@media(max-width:850px){#preview{padding:0 28px}.workspace{grid-template-columns:1fr 330px;gap:32px}h1{font-size:43px}#stage{height:563px}.intro{padding-top:30px}.settings-grid{grid-template-columns:1fr 1fr}.primary,.secondary{padding:13px;gap:14px}}
@media(max-width:650px){#preview{padding:0 20px}.masthead{height:74px}.brand{font-size:13px}.brand small{font-size:7px}.version{font-size:8px}.version b{margin-left:4px}.workspace{display:flex;flex-direction:column;padding-top:26px;gap:25px}.intro{padding:0}.eyebrow{font-size:10px;margin-bottom:12px}h1{font-size:32px;margin-bottom:9px;line-height:1.45}h1 br{display:none}.lead{font-size:12px;line-height:1.9;margin-bottom:17px}.lead br{display:none}.primary-actions{gap:9px}.primary,.secondary{font-size:12px;padding:12px 19px;flex:1}.instructions{display:none}.preview-note{margin:12px 0 0;font-size:9px}.preview-note br{display:none}.preview-column{width:100%;max-width:380px;align-self:center}#stage{height:520px;border-width:5px;border-radius:31px}.home-clock{font-size:54px}.home-message{top:164px}.settings-card{padding:20px;border-radius:19px}.settings-grid{gap:18px}.settings-bottom{flex-wrap:wrap;gap:12px}.settings-bottom .text-button{margin-left:auto}footer{line-height:1.8;flex-direction:column;gap:5px}.settings-heading h2{font-size:18px}#link-fields{grid-template-columns:1fr}}

/* Bounded cards share the same geometry in the browser and Android host. */
#companion{padding:6px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
#companion>*,#character-row{flex-shrink:0;min-height:0}
.speech,.companion-panel{min-width:0;max-width:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}
.companion-panel>button{white-space:normal;overflow-wrap:anywhere;flex-shrink:0}
.panel-title{position:sticky;top:-11px;background:#fbfffb;z-index:1}
/* Only the form crossfades. Facial patches keep the base costume motionless. */
#visual img.face-overlay{filter:none}
#companion[data-form=BIRD] #bird-face,#companion[data-form=HUMAN] #human-face{opacity:1}
/* Reactions move only the sprite; the touch target and overlay stay fixed. */
#motion{position:absolute;inset:0;display:block;pointer-events:none;transform-origin:50% 45%}
#reaction-symbol{position:absolute;top:4%;right:8%;color:#b96b63;font-size:20px;font-weight:700;line-height:1.2;text-shadow:0 1px 3px #fff;pointer-events:none}
#reaction-symbol.angry::before{content:"";display:block;width:1em;height:1em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b96b63' stroke-width='2.3' stroke-linecap='round'%3E%3Cpath d='M3 8C8 8 8 8 8 3M16 3C16 8 16 8 21 8M21 16C16 16 16 16 16 21M8 21C8 16 8 16 3 16'/%3E%3C/svg%3E") center/contain no-repeat}
#companion[data-dragging=true] #menu-button{visibility:hidden;pointer-events:none}
#companion[data-dragging=true] #character-row{padding-top:31px}
#companion[data-motion=carry] #motion{animation:carry .95s ease-in-out infinite}
#companion[data-motion=settle] #motion{animation:settle .5s ease-out}
#companion[data-motion=shake] #motion{animation:grumble .45s ease-in-out}
#companion[data-motion=hop] #motion{animation:little-hop .75s ease-in-out}
#companion[data-motion=sway] #motion{animation:content-sway 1.4s ease-in-out}
#companion[data-motion=peek] #motion{animation:peek 2.2s ease-in-out}
#companion[data-motion=stretch] #motion{animation:stretch 2.2s ease-in-out}
@keyframes carry{0%,100%{transform:rotate(-2deg) scale(.97)}50%{transform:rotate(2deg) scale(.97)}}
@keyframes settle{0%{transform:scale(.97,1.02)}40%{transform:scale(1.02,.97)}100%{transform:none}}
@keyframes grumble{0%,100%{transform:none}25%{transform:translateX(-2px) rotate(-2deg)}75%{transform:translateX(2px) rotate(2deg)}}
@keyframes little-hop{0%,100%{transform:none}45%{transform:translateY(-4px) rotate(-2deg)}75%{transform:translateY(-1px)}}
@keyframes content-sway{0%,100%{transform:none}30%{transform:rotate(-2deg)}65%{transform:rotate(2deg)}}
@keyframes peek{0%,100%{transform:none}45%,65%{transform:rotate(-3deg)}}
@keyframes stretch{0%,100%{transform:none}50%{transform:scale(.98,1.015) translateY(-1px)}}
#companion[data-transitioning=true] #motion,#companion[data-reduced=true] #motion,#companion[data-paused=true] #motion,#companion[data-paused=true] #visual{animation:none}
@media(prefers-reduced-motion:reduce){#companion #motion{animation:none}}
#timer-chip{position:absolute;bottom:0;left:0;max-width:calc(100% - 39px);min-width:54px;height:25px;padding:3px 6px;background:#eff7f1f2;color:#48665b;border:1px solid #bcd3c5;border-radius:10px;font-size:11px;line-height:1;white-space:nowrap;overflow:hidden}
#companion[data-dragging=true] #timer-chip{visibility:hidden}
.timer-status{font-size:19px;text-align:center;font-variant-numeric:tabular-nums;color:#426e60;margin:10px 0}
.panel-field{display:block;margin:8px 6px;color:#577064}.panel-field select{margin-top:4px;font-size:13px}
.memo-text{font-size:12px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;margin:10px}
#next-note{display:block;width:100%;min-height:80px;max-height:130px;resize:vertical;border:1px solid #c5d8cb;border-radius:9px;padding:8px;font:inherit;font-size:13px;background:#fff;color:#344d40;user-select:text;-webkit-user-select:text}
#snack-symbol{position:absolute;right:22%;bottom:27%;display:none;pointer-events:none;width:25px;height:20px}
#snack-symbol i{position:absolute;width:12px;height:15px;border-radius:50% 50% 45% 45%;background:linear-gradient(100deg,#ceaa76,#98764e);border:1px solid #785a3c;transform:rotate(25deg)}
#snack-symbol i:nth-child(2){left:9px;top:7px;transform:rotate(-30deg);width:9px;height:12px}#snack-symbol i:nth-child(3){left:-6px;top:10px;width:6px;height:7px}
#companion[data-snacking=true] #snack-symbol{display:block;animation:crumbs 1.2s ease-in-out 3}
#companion[data-motion=nibble] #motion{animation:nibble .45s ease-in-out 5}
#companion[data-motion=preen] #motion{animation:content-sway 2s ease-in-out}
#companion[data-walking=true] #motion{animation:steps .38s ease-in-out infinite}
#companion[data-focus=true][data-form=HUMAN] #visual{animation:writing 3.8s ease-in-out infinite}
@keyframes nibble{0%,100%{transform:none}50%{transform:translateY(1px) rotate(-1.5deg)}}
@keyframes crumbs{0%,100%{transform:none}50%{transform:translateY(-3px) rotate(8deg)}}
@keyframes steps{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-3px) rotate(1.5deg)}}
@keyframes writing{0%,100%{transform:none}30%,60%{transform:rotate(-.7deg) translateY(1px)}}
#companion[data-reduced=true] #motion,#companion[data-paused=true] #motion,#companion[data-transitioning=true] #motion,#companion[data-reduced=true] #snack-symbol,#companion[data-reduced=true] #visual,#companion[data-paused=true] #visual{animation:none}
@media(prefers-reduced-motion:reduce){#companion #motion,#companion #snack-symbol,#companion #visual{animation:none}}

/* Editable shortcut names and destinations. */
.link-settings{font-size:14px}.link-settings p{font-size:14px;line-height:1.7}.link-settings .secondary{font-size:14px;min-height:44px}.link-editor{min-width:0;border:1px solid var(--line);border-radius:12px;padding:14px;background:#f6f8f3;display:grid;gap:12px}.link-editor label{font-size:14px}#link-fields input{font-size:16px;min-height:44px}.link-editor-actions{display:flex;flex-wrap:wrap;gap:12px}.link-editor-actions button{flex:1;white-space:normal}

/* Folded state is a real 60 × 68 dp touch window, with no invisible character. */
#companion[data-folded=true] {height:68px;align-items:center;justify-content:center}
#companion[data-folded=true]>:not(#dock-button){display:none!important}
#dock-button{width:48px;height:56px;padding:8px;background:#f4fbf4f5;border:1px solid #b8cfc3;border-radius:20px;color:#486b5c;box-shadow:0 2px 6px #193b3920}
#dock-button svg{height:38px;width:30px;display:block}
#companion[data-folded=true] #visual,#companion[data-folded=true] #motion{animation:none}
.memo-filters{display:flex;gap:3px;margin:6px 0}
.memo-filters button{flex:1;padding:8px 3px;font-size:11px;min-height:40px;background:#e9f1e7;color:#3e5b4e;border-radius:8px}
.memo-row{padding:9px 4px;border-bottom:1px solid #dbe6df}
.memo-row label{display:flex;gap:8px;align-items:flex-start;font-size:12px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.memo-row input{flex:none;width:20px;height:20px;margin-top:3px;accent-color:#527b66}
.memo-row span{min-width:0}
.memo-row button{font-size:11px;padding:8px;margin:4px 4px 0 0;background:#edf3ed;color:#3e5b4e;min-height:36px}
.companion-panel>label{display:block;font-size:12px;margin:9px 0}
.companion-panel select{max-width:100%;width:100%;font-size:12px}

/* Compact memo tools keep every touch target inside the existing scrollable panel. */
.memo-tools{display:flex;gap:6px;flex-wrap:wrap}.memo-tools button{flex:1 1 90px;min-width:0;min-height:44px;padding:8px;white-space:normal}
.memo-filters{flex-wrap:wrap}.memo-row .panel-note{margin:6px 0;overflow-wrap:anywhere}
.companion-panel input[type="search"],.companion-panel input[type="text"],.companion-panel input[type="number"]{box-sizing:border-box;width:100%;min-width:0;min-height:44px;padding:8px;border:1px solid #b5c7be;border-radius:10px;font:inherit;background:white;color:#304c40}
.companion-panel>label{display:block;margin:10px 0;overflow-wrap:anywhere}.companion-panel .set-choice{display:flex;align-items:center;gap:8px;min-height:44px}.set-choice input{flex:none;width:20px;height:20px}
.companion-panel>button[data-action="stop"]{border-top:1px solid #c5d5cd;margin-top:8px;color:#654b4b}
.menu-choice{margin:12px 0;padding:10px;border:1px solid #d3dfd7;border-radius:12px;font-size:13px;overflow-wrap:anywhere}.menu-choice strong{display:block;margin-bottom:4px}.menu-choice .set-choice{min-height:48px}.menu-choice label:has(input:disabled){opacity:.55}.menu-choice input:focus-visible{outline:3px solid #75c0b3;outline-offset:3px}