:root{font-family:'Noto Sans JP','Hiragino Kaku Gothic ProN',Meiryo,sans-serif;color:#1b3548;background:#f3f6fa;font-size:16px}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:1px solid #d8e1e9;background:white;color:inherit;border-radius:12px;padding:12px 18px;font-weight:700}button:hover{filter:brightness(.97)}button:focus-visible,a:focus-visible{outline:3px solid #2079df;outline-offset:3px}button:disabled{opacity:.4;cursor:default}header{height:82px;padding:0 max(24px,calc((100vw - 1120px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e0e7ef;background:white}.brand{text-decoration:none;color:inherit;font-weight:800;font-size:22px}.brand span{font-size:32px;color:#2878d6;vertical-align:middle}.tag{color:#6c7e8d;font-size:14px}main{max-width:1120px;margin:36px auto;padding:0 24px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px}.eyebrow{font-weight:700;font-size:14px;color:#577386;letter-spacing:.08em;margin:0 0 10px}h1{font-size:28px;margin:0}input{border:1px solid #c7d3df;border-radius:10px;padding:12px;background:white;color:inherit;max-width:100%}#budget{width:86px;font-size:24px;font-weight:800;text-align:center;margin:0 8px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}.schedule,.now{background:white;border:1px solid #e1e8ef;border-radius:22px;padding:26px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px}h2{font-size:20px;margin:0}.section-head span{font-size:14px;background:#e9f3fb;padding:6px 10px;border-radius:8px}.hint{font-size:13px;color:#64798a;margin:10px 0 24px}#timeline{position:relative;margin-left:46px;margin-bottom:18px;min-height:240px;border-left:1px solid #cfdbe7}.activity{position:absolute;left:14px;right:0;border-radius:10px;border:0;border-left:5px solid var(--accent);background:var(--bg);padding:9px 12px;text-align:left;display:flex;align-items:center;gap:10px;overflow:visible;min-height:0}.activity.active{outline:2px solid var(--accent);outline-offset:2px}.activity.completed{opacity:.52}.activity.completed .activity-name{text-decoration:line-through}.activity-name{font-size:18px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.duration{margin-left:auto;white-space:nowrap;font-size:14px}.grip{touch-action:none;cursor:grab;font-size:23px;padding:4px}.resize{position:absolute;bottom:0;left:30%;right:30%;height:12px;cursor:ns-resize;touch-action:none}.resize:after{content:'';position:absolute;bottom:4px;left:40%;right:40%;height:3px;border-radius:4px;background:var(--accent);opacity:.4}.tick{position:absolute;right:calc(100% + 10px);font-size:13px;color:#687f91;white-space:nowrap;transform:translateY(-50%)}.deadline{position:absolute;left:0;right:0;border-top:2px dashed #7991a4;pointer-events:none;z-index:2}.deadline span{position:absolute;right:0;top:3px;font-size:12px;color:#657887}.cursor{position:absolute;left:-7px;right:-8px;height:2px;background:#f04d64;z-index:3;pointer-events:none}.cursor:before{content:'';position:absolute;left:0;top:-4px;width:10px;height:10px;border-radius:50%;background:#f04d64}.free{position:absolute;left:14px;right:0;display:flex;align-items:center;justify-content:center;color:#8296a6;background:repeating-linear-gradient(135deg,#f6f9fc,#f6f9fc 7px,#eef3f7 7px,#eef3f7 8px);border-radius:10px;font-size:14px}.add{width:100%;border:1px dashed #a8bfd1;color:#3375a9}.now{border-top:5px solid #2878d6}.remaining span{font-size:58px;font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums;display:block}.remaining small{color:#627c90;font-size:14px}.progress{height:7px;background:#e8eff5;border-radius:10px;margin:20px 0 28px;overflow:hidden}.progress i{display:block;height:100%;background:#2878d6;width:0}.current-label{font-size:14px;color:#2878d6;font-weight:bold}.now h2{font-size:27px;margin:8px 0 22px;overflow-wrap:anywhere}.next{border-top:1px solid #e5ebf1;padding-top:18px;color:#748797;font-size:14px;margin-bottom:24px}.next strong{color:#314e62;display:inline-block;margin-left:12px}.primary{background:#2474d0;color:white;border-color:#2474d0}.now button{width:100%;margin-bottom:10px}.finish{color:#2474d0;background:#eff6fe;border-color:#d6e6fa}.reset{border:0;font-size:14px;color:#748797}.note{padding:24px 12px;color:#698091;font-size:14px;line-height:1.8}.note p{margin:8px 0}dialog{border:0;border-radius:22px;padding:28px;width:min(430px,calc(100% - 32px));box-shadow:0 24px 80px #17355033}dialog::backdrop{background:#17355066}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.dialog-head button{border:0;font-size:24px;padding:0 8px}form label{display:block;margin-top:18px;font-size:14px;font-weight:bold}form input{display:block;width:100%;margin-top:8px}#colors{display:flex;gap:12px;margin:12px 0 24px}#colors button{width:38px;height:38px;padding:0;border:3px solid transparent;border-radius:50%}#colors button.selected{outline:2px solid #253f54;outline-offset:3px}.reorder,.dialog-actions{display:flex;gap:12px}.dialog-actions{justify-content:space-between;margin-top:24px}#remove{color:#bd4050;border:0}@media(max-width:760px){header{height:66px;padding:0 20px}.tag{display:none}main{margin:24px auto;padding:0 16px}.toolbar{align-items:flex-start;flex-direction:column;gap:18px}h1{font-size:25px}.workspace{grid-template-columns:1fr}.schedule{padding:22px 18px}.now{padding:24px}.remaining span{font-size:48px}.hint{font-size:12px}.activity-name{font-size:16px}.activity{padding:6px;gap:5px}.grip{padding:2px}.duration{font-size:13px}.section-head h2{font-size:18px}}

.activity{overflow:hidden}

.workspace{grid-template-columns:minmax(0,1fr)}main{max-width:900px}.toolbar{justify-content:flex-end;margin-bottom:20px}

main{max-width:1120px}.workspace{grid-template-columns:minmax(0,1fr) 300px}.time-entry{display:flex;align-items:center;gap:20px;color:#577386;font-weight:700;margin:20px 0 26px}.time-entry input{font-size:36px;font-weight:800;border:0;border-bottom:2px solid #d3e0ee;border-radius:0;background:transparent;padding:4px 6px;color:#1b3548;min-width:0}.end-time{margin:8px 0 24px;padding-top:10px;border-top:1px solid #dbe5ee}#timeError{color:#bd4050;font-size:14px;margin-bottom:12px}#timeline{margin-left:56px}.activity-name{min-width:0;width:100%;background:transparent;border:0;padding:4px;border-radius:5px;font-size:18px}.activity-name:focus{outline:2px solid #2878d6;background:#ffffff99}.activity .duration{padding:5px 8px;background:#ffffff80;border:0;border-radius:6px;font-size:14px;flex-shrink:0}.stock{background:white;border:1px solid #e1e8ef;border-radius:22px;padding:24px;position:sticky;top:20px}.stock-card{padding:16px;border-radius:12px;margin-bottom:14px}.stock-card input{width:100%;background:transparent;border:0;border-bottom:1px solid #6b8baa55;border-radius:0;font-size:18px;font-weight:bold;padding:8px 0}.stock-actions{display:flex;justify-content:space-between;gap:8px;margin-top:14px}.stock-actions button{font-size:14px;padding:7px 10px;background:#ffffff99;border:0}.stock .add{font-size:14px;padding:12px 6px}@media(max-width:760px){.workspace{grid-template-columns:minmax(0,1fr)}.stock{position:static}.time-entry input{font-size:32px}.activity-name{font-size:16px}}

.now-bar{position:absolute;left:-7px;right:0;height:3px;background:#e43e50;z-index:4;pointer-events:none}.now-bar:before{content:'';position:absolute;left:-4px;top:-4px;width:11px;height:11px;border-radius:50%;background:#e43e50}.now-bar span{position:absolute;right:0;bottom:5px;background:#fff;color:#c92136;border:1px solid #f4bcc4;border-radius:6px;padding:3px 7px;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}.schedule>.time-entry:first-child{margin-top:0}#timeError:empty{display:none}

.activity{border-left:0;cursor:grab;touch-action:none}.activity.selected{outline:3px solid #2878d6;outline-offset:1px}.activity .activity-name{touch-action:auto;cursor:text}.now-bar span{left:0;right:auto}.activity .duration{font-variant-numeric:tabular-nums;font-size:14px}.activity{flex-wrap:wrap;align-content:center;gap:3px 8px}.activity-name{flex:1;width:auto}.activity .duration{margin-left:28px}.resize{left:15%;right:15%}#editError{color:#bd4050;font-size:14px}#editError:empty{display:none}@media(max-width:760px){.activity .duration{font-size:12px;padding:2px 5px}}

.stock{min-height:420px}.stock-card{touch-action:none;cursor:grab}.stock-card input{touch-action:auto;cursor:text}.stock-card.selected{outline:3px solid #2878d6;outline-offset:2px}.drop-target{outline:3px dashed #2878d6;outline-offset:5px}.drag-ghost{position:fixed;z-index:9999;pointer-events:none;padding:16px 24px;border-radius:12px;box-shadow:0 8px 28px #16364c33;font-weight:bold;max-width:280px;overflow-wrap:anywhere}.drag-ghost.blocked{outline:3px solid #d33}.stock-card>.grip{display:block;line-height:1;padding:0 0 8px}.stock-card input{padding-top:0}

.activity .duration{margin-left:0}.stock-card input{margin-top:8px}

.activity .activity-name,.stock-card input{flex:0 1 auto;max-width:calc(100% - 12px);min-width:0;padding:2px 3px;margin:0;line-height:1.35;border:0}.stock-card{padding:20px 16px}.activity{justify-content:flex-start}.activity .duration{margin-left:auto;background:transparent;padding:2px 3px;cursor:grab}.stock-actions{font-size:14px;color:#526e82;margin-top:12px}.trash{display:flex;align-items:center;justify-content:center;width:100%;height:64px;margin:16px 0;border:1px dashed #bac8d4;background:transparent;color:#718594}.trash.drop-target{color:#c92136;background:#ffe8ec;outline:2px dashed #d33;border-color:transparent}

.stock-column{min-width:0;position:sticky;top:20px}.stock-column .stock{position:static}.stock-column>.trash{width:calc(100% - 48px);height:90px;margin:24px auto 0}@media(max-width:760px){.stock-column{position:static}}

.snap-setting{display:flex;align-items:center;justify-content:flex-end;gap:8px;color:#607b8e;font-size:13px;margin:4px 0 20px}.snap-setting select{font:inherit;color:#19374b;background:white;border:1px solid #cedde9;border-radius:8px;padding:6px 10px}.activity{box-sizing:border-box}.activity .resize{height:24px;left:10%;right:10%;z-index:2}.activity .resize:after{left:30%;right:30%;height:6px;border-radius:4px}.activity .resize-top{top:0;bottom:auto}.activity .resize-top:after{top:4px;bottom:auto}.activity .resize-bottom{bottom:0}.activity .duration{max-width:100%;overflow:hidden;text-overflow:ellipsis}.activity-name{position:relative;z-index:3}

.is-dragging,.is-dragging *{cursor:grabbing!important;user-select:none!important}.drag-source{opacity:.2}.moving-card{box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:16px;border:2px solid #fff;border-radius:12px;box-shadow:0 12px 28px #19374b40;opacity:.95;transform:rotate(-1deg);overflow:hidden;z-index:1000}.moving-card strong{font-size:20px}.moving-card span{font-size:14px}.moving-card.over-trash{opacity:.5;transform:scale(.9) rotate(-4deg)}.activity.drag-placement{outline:3px solid #2878d6;outline-offset:-2px;box-shadow:0 8px 18px #19374b30;z-index:5;pointer-events:none}.activity.drag-placement .duration{font-weight:bold}.activity.drag-placement .resize{visibility:hidden}

.moving-card{transform:none}.moving-card.over-timeline{opacity:.82}.activity.drag-placement{opacity:.45;box-shadow:none}.is-dragging #timeline{overflow-anchor:none}

#timeline{margin-left:104px}.now-bar span{left:-4px;right:auto;top:1.5px;bottom:auto;transform:translate(-100%,-50%);width:92px;text-align:center;font-size:13px;white-space:normal;padding:4px 5px;line-height:1.35}

.schedule{min-width:0}.board-scroll{max-width:100%;overflow-x:auto;padding:18px 8px 6px 104px;overscroll-behavior-x:contain;overflow-anchor:none}#timeline{margin-left:0}.moving-card{max-width:none}

#timeline.drop-target,.stock.drop-target{outline:none}.activity button.duration{cursor:pointer;font-weight:400;touch-action:manipulation}.activity button.duration:hover{background:#ffffff66}.activity button.duration:focus-visible{outline:2px solid #2878d6;outline-offset:1px}

.activity .resize{opacity:0;pointer-events:none;transition:opacity 300ms ease-in-out}.activity:focus-visible .resize{opacity:1;pointer-events:auto}@media(hover:hover){.activity:hover .resize{opacity:1;pointer-events:auto}}@media(hover:none),(pointer:coarse){.activity.selected .resize{opacity:1;pointer-events:auto}}.stock-card{box-sizing:border-box;padding:3px 12px;display:flex;align-items:center;align-content:center;flex-wrap:wrap;gap:3px 8px;overflow:hidden}.stock-card .stock-actions{margin:0 0 0 auto;flex-shrink:0}.stock-card input{max-width:calc(100% - 45px)}

.stock-card{position:relative}.activity,.stock-card{padding-left:24px}.move-area{position:absolute;left:0;top:0;bottom:0;width:20px;z-index:6;cursor:grab;touch-action:none}.activity .resize,.stock-card .resize{height:var(--edge-hit);left:24px;right:10px;z-index:4;opacity:0;pointer-events:auto;touch-action:none}.stock-card .resize-top{top:0;bottom:auto}.stock-card .resize-top:after{top:2px;bottom:auto}.stock-card .resize-bottom{bottom:0}.stock-card .resize:after{left:30%;right:30%;height:4px;background:#738b9c}.activity .resize:after{height:4px;top:50%;bottom:auto;transform:translateY(-50%)}.stock-card .resize:after{top:50%;bottom:auto;transform:translateY(-50%)}.activity:hover .resize,.activity:focus-visible .resize,.activity.selected .resize{opacity:0}.activity.near-top .resize-top,.stock-card.near-top .resize-top,.activity.near-bottom .resize-bottom,.stock-card.near-bottom .resize-bottom{opacity:1}@media(hover:none),(pointer:coarse){.activity.selected .resize-bottom,.stock-card.selected .resize-bottom{opacity:1}}

/* Keep touch manipulation separate from text editing on iPad/Safari. */
header,header *,main,main *,.drag-ghost,.drag-ghost *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
main input,main textarea,main [contenteditable="true"]{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
.is-dragging,.is-dragging *{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important}

.drawer-toggle,.drawer-close,.stock-backdrop,.drag-destination{display:none}
@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){
.workspace{grid-template-columns:minmax(0,1fr)}
.drawer-toggle{display:block;font-size:14px;padding:9px 12px;white-space:nowrap}
.stock-column{position:fixed;top:0;right:0;bottom:0;width:300px;max-width:90vw;background:#f3f6fa;padding:54px 0 20px;overflow-y:auto;z-index:30;transform:translateX(100%);visibility:hidden;pointer-events:none;transition:transform .22s ease;box-shadow:-8px 0 30px #19374b22}
.stock-open .stock-column{transform:translateX(0);visibility:visible;pointer-events:auto}
.drawer-close{display:block;position:absolute;top:8px;right:12px;padding:8px 12px}
.stock-backdrop{position:fixed;inset:0;border:0;border-radius:0;background:#19374b25;z-index:29;padding:0}
.stock-open .stock-backdrop{display:block}
.drag-destination{position:fixed;right:12px;background:#fff;border:2px solid #a8bfd1;border-radius:12px;padding:16px 12px;z-index:40;font-weight:bold;font-size:14px;pointer-events:none;box-shadow:0 3px 12px #19374b22}
.is-dragging .drag-destination{display:block}#returnStock{top:42%}#dragTrash{bottom:20px;color:#c92136;border-color:#e9b3ba}.drag-destination.drop-target{outline:none;background:#e4f1ff}#dragTrash.drop-target{background:#ffe8ec}
}
@media(prefers-reduced-motion:reduce){.stock-column{transition:none}}

@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){
.drawer-toggle{position:fixed;right:0;top:42%;z-index:41;writing-mode:vertical-rl;padding:16px 10px;border-radius:12px 0 0 12px;background:#fff;color:#2878d6;border:1px solid #a8bfd1;box-shadow:-3px 2px 10px #19374b18;transition:right .22s ease;touch-action:manipulation}
.stock-open .drawer-toggle{right:min(300px,90vw)}
.is-dragging #returnStock{display:none}
.is-dragging .stock-backdrop{pointer-events:none}
}
@media(prefers-reduced-motion:reduce){.drawer-toggle{transition:none}}

/* A continuous sliding surface, with its handle aligned to the board. */
@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){
body{--drawer-width:min(300px,calc(100vw - 48px));--drawer-shift:0px;--drawer-motion:520ms cubic-bezier(.4,0,.2,1)}
body.stock-open{--drawer-shift:calc(0px - var(--drawer-width))}
.stock-column{width:var(--drawer-width);max-width:none;visibility:visible;transform:translateX(calc(100% + var(--drawer-shift)));transition:transform var(--drawer-motion);background:#fff;border:0;border-radius:0;box-shadow:-6px 0 18px #00000012;padding-top:max(54px,env(safe-area-inset-top));}
.stock-open .stock-column{transform:translateX(calc(100% + var(--drawer-shift)))}
.stock-column .stock{border:0;border-radius:0;background:transparent}
.drawer-toggle{right:0;top:var(--tab-top,90px);height:var(--tab-height,70vh);width:40px;padding:18px 8px;display:flex;align-items:center;justify-content:center;gap:18px;border-radius:8px 0 0 8px;border:1px solid #d9d9d9;border-right:0;background:#f4f4f4;color:#626262;box-shadow:-3px 0 9px #0000000a;transform:translateX(var(--drawer-shift));transition:transform var(--drawer-motion);touch-action:none}
.drawer-toggle::before{content:'';width:3px;height:32px;border-radius:3px;background:#c7c7c7}
.stock-open .drawer-toggle{right:0}
.drawer-close{color:#626262;border-color:#ddd}
.stock-backdrop{display:block;opacity:0;visibility:hidden;background:transparent;transition:opacity var(--drawer-motion),visibility 0s 520ms}
.stock-open .stock-backdrop{opacity:1;visibility:visible;transition-delay:0s}
.drawer-dragging .stock-column,.drawer-dragging .drawer-toggle{transition:none}
}
@media(prefers-reduced-motion:reduce){body{--drawer-motion:0ms}.stock-column,.drawer-toggle{transition:none}}

@keyframes card-lift{from{transform:translateY(0) scale(1);box-shadow:0 2px 5px #19374b18}to{transform:translateY(-5px) scale(1.025);box-shadow:0 16px 30px #19374b38}}
.moving-card.lifted-card{animation:card-lift 500ms cubic-bezier(.4,0,.2,1) both;transform-origin:center;opacity:.96}
.moving-card.lifted-card.over-trash{animation:none;transform:scale(.9);opacity:.5}
@media(prefers-reduced-motion:reduce){.moving-card.lifted-card{animation:none;box-shadow:0 16px 30px #19374b38}}

.stock-card .resize{transition:opacity 300ms ease-in-out}
@media(prefers-reduced-motion:reduce){.activity .resize,.stock-card .resize{transition:none}}

/* Keep the same card face throughout pickup; animate only elevation. */
.moving-card.lifted-card{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;align-content:center;justify-content:flex-start;gap:3px 8px;padding:9px 12px 9px 24px;border:0;border-radius:10px;font-weight:inherit;opacity:1;animation:card-lift 250ms cubic-bezier(.2,.8,.2,1) both}
.moving-card.lifted-card .activity-name{flex:0 1 auto;white-space:nowrap;font-size:18px;font-weight:750}
.moving-card.lifted-card .duration,.moving-card.lifted-card .stock-actions{margin-left:auto;font-size:14px;background:transparent;padding:2px 3px;border:0;font-weight:400}
@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){
.stock-column,.stock-open .stock-column{visibility:visible;transition:transform 650ms cubic-bezier(.4,0,.2,1)}
.drawer-toggle{transition:transform 650ms cubic-bezier(.4,0,.2,1)}
.drawer-dragging .stock-column,.drawer-dragging .drawer-toggle{transition:none}
}
@media(prefers-reduced-motion:reduce){.moving-card.lifted-card{animation:none}.stock-column,.drawer-toggle{transition:none}}

/* Compact time gutter, a quiet frame, and a stable schedule boundary. */
.schedule{padding:20px 12px;border:1px solid #e3e7eb;border-radius:12px}
.board-scroll{padding-left:52px}
.tick{right:calc(100% + 8px)}
.now-bar{left:-1px}
.now-bar span{left:10px;right:auto;top:auto;bottom:7px;transform:none;width:auto;white-space:nowrap;background:#fff;padding:3px 6px}
.deadline{border-top:2px solid #80909a}
.deadline span{font-size:13px;color:#52616b;background:#fff;padding:2px 4px}
.now-bar.outside{height:0;background:none}
.now-bar.outside::before{display:none}
.now-bar.outside span{left:0;top:8px;bottom:auto;border:0;background:transparent;font-size:13px;padding:0;color:#a34d58}
@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){
main{padding:0 6px;margin:12px auto}
.schedule{padding:18px 10px;border-radius:10px}
}

/* Drawer mode also follows the space required by the cards. */
body.auto-drawer .workspace{grid-template-columns:minmax(0,1fr)}body.auto-drawer .drawer-toggle{display:block;font-size:14px;padding:9px 12px;white-space:nowrap}body.auto-drawer .stock-column{position:fixed;top:0;right:0;bottom:0;width:300px;max-width:90vw;background:#f3f6fa;padding:54px 0 20px;overflow-y:auto;z-index:30;transform:translateX(100%);visibility:hidden;pointer-events:none;transition:transform .22s ease;box-shadow:-8px 0 30px #19374b22}body.auto-drawer.stock-open .stock-column{transform:translateX(0);visibility:visible;pointer-events:auto}body.auto-drawer .drawer-close{display:block;position:absolute;top:8px;right:12px;padding:8px 12px}body.auto-drawer .stock-backdrop{position:fixed;inset:0;border:0;border-radius:0;background:#19374b25;z-index:29;padding:0}body.auto-drawer.stock-open .stock-backdrop{display:block}body.auto-drawer .drag-destination{position:fixed;right:12px;background:#fff;border:2px solid #a8bfd1;border-radius:12px;padding:16px 12px;z-index:40;font-weight:bold;font-size:14px;pointer-events:none;box-shadow:0 3px 12px #19374b22}body.auto-drawer.is-dragging .drag-destination{display:block}body.auto-drawer #returnStock{top:42%}body.auto-drawer #dragTrash{bottom:20px;color:#c92136;border-color:#e9b3ba}body.auto-drawer .drag-destination.drop-target{outline:none;background:#e4f1ff}body.auto-drawer #dragTrash.drop-target{background:#ffe8ec}

body.auto-drawer .drawer-toggle{position:fixed;right:0;top:42%;z-index:41;writing-mode:vertical-rl;padding:16px 10px;border-radius:12px 0 0 12px;background:#fff;color:#2878d6;border:1px solid #a8bfd1;box-shadow:-3px 2px 10px #19374b18;transition:right .22s ease;touch-action:manipulation}body.auto-drawer.stock-open .drawer-toggle{right:min(300px,90vw)}body.auto-drawer.is-dragging #returnStock{display:none}body.auto-drawer.is-dragging .stock-backdrop{pointer-events:none}

body.auto-drawer{--drawer-width:min(300px,calc(100vw - 48px));--drawer-shift:0px;--drawer-motion:520ms cubic-bezier(.4,0,.2,1)}body.auto-drawer.stock-open{--drawer-shift:calc(0px - var(--drawer-width))}body.auto-drawer .stock-column{width:var(--drawer-width);max-width:none;visibility:visible;transform:translateX(calc(100% + var(--drawer-shift)));transition:transform var(--drawer-motion);background:#fff;border:0;border-radius:0;box-shadow:-6px 0 18px #00000012;padding-top:max(54px,env(safe-area-inset-top));}body.auto-drawer.stock-open .stock-column{transform:translateX(calc(100% + var(--drawer-shift)))}body.auto-drawer .stock-column .stock{border:0;border-radius:0;background:transparent}body.auto-drawer .drawer-toggle{right:0;top:var(--tab-top,90px);height:var(--tab-height,70vh);width:40px;padding:18px 8px;display:flex;align-items:center;justify-content:center;gap:18px;border-radius:8px 0 0 8px;border:1px solid #d9d9d9;border-right:0;background:#f4f4f4;color:#626262;box-shadow:-3px 0 9px #0000000a;transform:translateX(var(--drawer-shift));transition:transform var(--drawer-motion);touch-action:none}body.auto-drawer .drawer-toggle::before{content:'';width:3px;height:32px;border-radius:3px;background:#c7c7c7}body.auto-drawer.stock-open .drawer-toggle{right:0}body.auto-drawer .drawer-close{color:#626262;border-color:#ddd}body.auto-drawer .stock-backdrop{display:block;opacity:0;visibility:hidden;background:transparent;transition:opacity var(--drawer-motion),visibility 0s 520ms}body.auto-drawer.stock-open .stock-backdrop{opacity:1;visibility:visible;transition-delay:0s}body.auto-drawer.drawer-dragging .stock-column,body.auto-drawer.drawer-dragging .drawer-toggle{transition:none}

body.auto-drawer .stock-column,body.auto-drawer.stock-open .stock-column{visibility:visible;transition:transform 650ms cubic-bezier(.4,0,.2,1)}body.auto-drawer .drawer-toggle{transition:transform 650ms cubic-bezier(.4,0,.2,1)}body.auto-drawer.drawer-dragging .stock-column,body.auto-drawer.drawer-dragging .drawer-toggle{transition:none}

body.auto-drawer main{padding:0 6px;margin:12px auto}body.auto-drawer .schedule{padding:18px 10px;border-radius:10px}

@media(prefers-reduced-motion:reduce){body.auto-drawer .stock-column,body.auto-drawer .drawer-toggle{transition:none}}

.stock-column{border-radius:0}
.stock-column .stock{border:0;border-radius:0;min-height:0}
.stock-tools{display:flex;align-items:center;justify-content:center;gap:24px;height:64px;margin-top:8px}
.stock-tools #addStock,.stock-tools #trash{position:relative;display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex:0 0 48px;margin:0;padding:0;border:1px solid #dedede;border-radius:10px;color:#69727a;background:#fff}
.stock-tools #addStock{font-size:28px;font-weight:400}
.stock-tools #trash svg{width:24px;height:24px}
.is-dragging .stock-tools #trash{transform:scale(1.2);background:#f5f5f5}
.stock-tools #trash{transition:transform 200ms ease,background 200ms ease}
.stock-tools #trash.drop-target{background:#ffe8ec;color:#c92136}

@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){
.stock-column{top:0;bottom:0;border:0;border-radius:0;padding-top:8px;transform:translateX(calc(100% - 48px + var(--drawer-shift)));pointer-events:none}
.stock-open .stock-column{transform:translateX(calc(100% - 48px + var(--drawer-shift)));pointer-events:auto}
body.stock-open{--drawer-shift:calc(48px - var(--drawer-width))}
.drawer-toggle{top:0;height:100dvh;width:48px;background:transparent;border:0;border-radius:0;box-shadow:none;color:transparent;padding:0;transform:translateX(var(--drawer-shift))}
.drawer-toggle::before{display:none}
.stock-open .drawer-toggle{transform:translateX(calc(var(--drawer-shift) - 48px))}
}
body.auto-drawer .stock-column{top:0;bottom:0;border:0;border-radius:0;padding-top:8px;transform:translateX(calc(100% - 48px + var(--drawer-shift)));pointer-events:none}body.auto-drawer.stock-open .stock-column{transform:translateX(calc(100% - 48px + var(--drawer-shift)));pointer-events:auto}body.auto-drawer.stock-open{--drawer-shift:calc(48px - var(--drawer-width))}body.auto-drawer .drawer-toggle{top:0;height:100dvh;width:48px;background:transparent;border:0;border-radius:0;box-shadow:none;color:transparent;padding:0;transform:translateX(var(--drawer-shift))}body.auto-drawer .drawer-toggle::before{display:none}body.auto-drawer.stock-open .drawer-toggle{transform:translateX(calc(var(--drawer-shift) - 48px))}

.stock-column{background:#fff;min-height:100vh}

/* A separate board with visible upper and lower edges. */
#stockDrawer{box-shadow:none;border:1px solid #e2e4e7;border-radius:12px;background:#fff;min-height:0;max-height:calc(100dvh - 40px);overflow-y:auto;overflow-x:hidden}
#stockDrawer .stock{border:0;box-shadow:none;border-radius:0}
#openStock{box-shadow:none}

@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){
#stockDrawer{top:var(--tab-top,90px);bottom:auto;height:auto;max-height:var(--drawer-max-height,calc(100dvh - 114px));padding-top:0;padding-bottom:0}
#openStock{top:var(--tab-top,90px);height:var(--tab-height,75vh)}
}
body.auto-drawer #stockDrawer{top:var(--tab-top,90px);bottom:auto;height:auto;max-height:var(--drawer-max-height,calc(100dvh - 114px));padding-top:0;padding-bottom:0}
body.auto-drawer #openStock{top:var(--tab-top,90px);height:var(--tab-height,75vh)}

/* 指で使う端末（スマホ・タブレット）はヘッダーなしで、スケジュールから始める。ヘッダーはパソコン（マウス）だけ */
@media (pointer:coarse){
 body header{height:0;padding:0;border:0;background:transparent}
 body header .brand{display:none}
 body main,body.auto-drawer main{margin:6px auto;padding-top:0;padding-bottom:0}
}

/* Keep the sliding board on a stable compositing layer on touch Safari. */
@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){
 #stockDrawer{transform:translate3d(calc(100% - 48px + var(--drawer-shift)),0,0);will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
 #openStock{will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:none}
 #stockBackdrop{filter:none}
}
body.auto-drawer #stockDrawer{transform:translate3d(calc(100% - 48px + var(--drawer-shift)),0,0);will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
body.auto-drawer #openStock{will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:none}
body.auto-drawer #stockBackdrop{filter:none}

/* Explicitly requested, consistent opening and closing motion on all devices.
   ID selectors prevent older open-state and reduced-motion rules from diverging. */
#stockDrawer,#openStock{transition:transform 650ms cubic-bezier(.4,0,.2,1)}
body.drawer-dragging #stockDrawer,body.drawer-dragging #openStock{transition:none}

/* The transparent dismissal surface must never flash on Safari taps. */
#stockBackdrop,#stockBackdrop:hover,#stockBackdrop:active,#stockBackdrop:focus{
 -webkit-tap-highlight-color:transparent;
 -webkit-appearance:none;appearance:none;
 background:transparent;filter:none;outline:none;box-shadow:none;
 touch-action:manipulation;
}
#openStock{-webkit-tap-highlight-color:transparent}

/* Time controls sit directly above quiet full-width boundary rules. */
.schedule .time-entry{align-items:baseline;gap:10px;margin:0 0 8px;padding:0 0 6px;border-top:0;border-bottom:1px solid #9cabb6;font-size:16px;line-height:1.2}
.schedule .time-entry input{width:5ch;flex:0 0 5ch;border:0;padding:0;line-height:1.2;font-variant-numeric:tabular-nums}
.schedule .end-time{margin:8px 0 0}
.time-picker-trigger{display:flex;align-self:center;align-items:center;justify-content:center;flex:0 0 44px;margin-left:-8px;padding:8px;width:44px;height:44px;border:0;background:transparent;color:#1b3548;-webkit-tap-highlight-color:transparent}
.time-picker-trigger svg{width:26px;height:26px;flex:none}
.time-picker{width:min(360px,calc(100% - 32px));padding:22px;border:1px solid #dce3e8;border-radius:14px}
.time-picker h2{font-size:20px}
.time-picker select{font:inherit;font-size:24px;padding:8px 16px;margin-left:12px;border:1px solid #ccd6df;border-radius:8px;background:white;color:#1b3548}
.minute-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}
.minute-options button{min-height:48px;padding:10px;font-size:18px}

/* Join the time axis to the top rule without repeating the start time. */
.schedule>.time-entry:first-child{margin-bottom:0}
.schedule .board-scroll{padding-top:0}


/* Stack the caption over its time, keeping the clock beside the digits. */
.schedule .time-entry{display:grid;grid-template-columns:max-content 44px;grid-template-rows:auto auto;column-gap:2px;row-gap:0;align-items:center;justify-content:start}
.time-caption{grid-column:1 / -1;grid-row:1;font-size:14px;line-height:1.3;color:#577386}
.schedule .time-entry input{grid-column:1;grid-row:2}
.schedule .time-picker-trigger{grid-column:2;grid-row:2;margin-left:0;align-self:center}

/* Keep only the boundary at the actual end of the schedule. */
.schedule .end-time{border-bottom:0}
.schedule .time-entry input[readonly]{cursor:pointer;caret-color:transparent}
.wheel-picker{position:fixed;z-index:100;width:248px;padding:12px;background:#fff;border:1px solid #dce3e8;border-radius:14px;box-shadow:0 6px 20px #19374b18;color:#1b3548;-webkit-tap-highlight-color:transparent}
.wheel-picker[hidden]{display:none}
.wheel-columns{display:flex;gap:12px}
.wheel-column{flex:1;min-width:0;text-align:center}
.wheel-column>span{font-size:13px;color:#577386}
.time-wheel{height:132px;overflow-y:auto;overscroll-behavior:contain;scroll-snap-type:y mandatory;padding-block:44px;scrollbar-width:none;touch-action:pan-y;-webkit-overflow-scrolling:touch;position:relative;background:linear-gradient(to bottom,#fff 44px,#f1f4f7 44px,#f1f4f7 88px,#fff 88px);border-radius:8px}
.time-wheel::-webkit-scrollbar{display:none}
.wheel-option{height:44px;display:flex;align-items:center;justify-content:center;scroll-snap-align:center;font-size:28px;font-weight:600;font-variant-numeric:tabular-nums;color:#8a98a2;cursor:pointer}
.wheel-option[aria-selected="true"]{color:#1b3548}
.wheel-actions{display:flex;justify-content:space-between;gap:8px;margin-top:10px}
.wheel-actions button{min-height:44px;padding:8px 12px;font-size:15px;border:0;background:transparent}
.wheel-actions [data-apply]{background:#eef3f8;color:#1b3548}

/* Suppress double-tap zoom while retaining scrolling and pinch gestures. */
html,body{touch-action:manipulation}

/* Compact leading space for labels with emoji. */
.activity,.stock-card,.moving-card.lifted-card{padding-left:16px}
.move-area{width:12px}

/* Resizing is available only on explicit selection, outside the card body. */
.activity .resize,.stock-card .resize{display:none;pointer-events:none}
.activity.selected,.stock-card.selected{z-index:7;overflow:visible}
.activity.selected .resize,.stock-card.selected .resize{display:block;opacity:1;pointer-events:auto;width:80px;height:24px;left:calc(50% - 40px);right:auto;z-index:8}
.activity.selected .resize-top,.stock-card.selected .resize-top{top:-24px;bottom:auto}
.activity.selected .resize-bottom,.stock-card.selected .resize-bottom{bottom:-24px;top:auto}
.activity.selected .resize:after,.stock-card.selected .resize:after{left:12px;right:12px;top:50%;bottom:auto;height:6px;transform:translateY(-50%);background:#71899b;opacity:.7;box-shadow:0 0 0 3px #fff}
/* Preserve the axis position while allowing its first card's upper handle. */
.schedule .board-scroll{padding-top:24px;margin-top:-24px}

.schedule .time-entry{grid-template-columns:max-content}
.schedule .time-entry input{min-height:44px}

/* Short schedules shrink; longer schedules retain the same minute scale. */
#timeline{min-height:0}

/* Current time shares the tick gutter; the line stays beneath card text. */
.now-bar:not(.outside){height:2px;background:rgba(228,62,80,.42)}
.now-bar span,.now-bar.outside span{left:-7px;right:auto;top:1px;bottom:auto;transform:translate(-100%,-50%);width:auto;white-space:nowrap;font-size:13px;line-height:1.35;padding:2px 1px;border:0;border-radius:3px;background:#fff;color:#c92136}

.activity .activity-name,.activity .duration{position:relative;z-index:5;background:var(--bg)}
.activity .activity-name:focus{background:var(--bg)}

.time-grid-line{position:absolute;left:0;right:0;height:1px;background:#e9ecef;pointer-events:none}

.schedule{position:relative}
#undo{position:absolute;top:20px;right:12px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;padding:12px;border:0;border-radius:10px;background:transparent;color:#75828c;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#undo:disabled{opacity:.25;cursor:default}
#undo:not(:disabled):hover{background:#f1f3f5}

/* Reserve the exposed drawer edge so it cannot cover the undo control. */
body.auto-drawer #undo{right:68px}
@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){#undo{right:68px}}
#undo:disabled{opacity:.5}

/* Align the stock board with the schedule's starting boundary. */
#stockDrawer{margin-top:var(--stock-offset,0px)}
body.auto-drawer #stockDrawer{margin-top:0}
@media(max-width:760px),(max-width:1100px) and (orientation:portrait) and (pointer:coarse){#stockDrawer{margin-top:0}}

/* Keep guidance separate from the child-facing board. */
.about-entry{max-width:1400px;margin:14px auto 0;padding:0 12px;text-align:left}.about-entry a{display:inline-block;padding:10px 4px;color:#617785;font-size:13px;text-decoration:underline;text-underline-offset:4px;touch-action:manipulation}.about-entry a:focus-visible{outline:2px solid #617785;outline-offset:3px}

/* Keep overflowing stock reachable on both desktop and tablet. */
#stockDrawer{max-height:var(--drawer-max-height,calc(100dvh - 40px));overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;scrollbar-width:thin}
#stockDrawer .stock{padding-bottom:12px}
#stockDrawer .stock-tools{position:sticky;bottom:0;background:#fff;z-index:9;padding:8px 0;margin-bottom:0}

/* お試し：長押しの間に文字選択やメニューが出ないように */
body.trial-hold .activity,body.trial-hold .stock-card{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}body.trial-hold .activity input,body.trial-hold .stock-card input{-webkit-user-select:text;user-select:text}

/* ドロワーを細く（240）するのはスマホだけ。タブレットは300のまま（スケジュールのカードの幅もドロワーのカードの幅に合わせて決まるため） */
@media(max-width:760px){body,body.auto-drawer{--drawer-width:min(240px,calc(100vw - 48px))}}
/* 引っぱると画面全体がびよんと動く（まだ上や下に何かあるように見える）のを止める */
html,body{overscroll-behavior:none}