:root{color-scheme:light;--navy:#10233f;--navy-2:#183657;--ink:#132238;--muted:#64748b;--line:#d8e1ec;--surface:#fff;--canvas:#f3f7fb;--cyan:#28c7c0;--cyan-dark:#087f7b;--amber:#f2b84b;--danger:#b42318;--shadow:0 18px 45px rgba(16,35,63,.09)}
#mobile-notice{display:flex;flex-direction:column;justify-content:center;gap:24px;min-height:60svh;margin:0;padding:32px 20px;text-align:center;border:3px solid #b42318;border-radius:18px}#mobile-notice strong{font-size:clamp(3rem,13vw,5.5rem);font-weight:900;line-height:1.15;letter-spacing:.03em}#mobile-notice p{margin:0;font-size:clamp(1.3rem,5.5vw,2rem);font-weight:750;line-height:1.6}main:has(#mobile-notice:not([hidden])){margin-top:24px}
.heading-summary{display:block;margin-top:8px;font-size:clamp(1rem,2.5vw,1.2rem);font-weight:700;line-height:1.5}.timeline-row .shift-time .time-connector{font-size:.8rem;line-height:1;color:var(--muted);font-weight:400}
.step-heading a{color:var(--cyan-dark);text-underline-offset:3px}.code-toolbar{justify-content:flex-end!important}.shortcut-picker{display:flex;align-items:center;gap:10px;margin:10px 0;color:var(--muted);font-size:.9rem}.shortcut-picker select{width:auto;min-height:40px;padding:5px 10px}.timeline-row{align-items:stretch!important}.timeline-row .shift-time{display:flex;flex-direction:column;justify-content:space-between;align-items:center;align-self:stretch;padding:8px 0!important;font-size:1.55rem!important;line-height:1.3}.timeline-row .shift-time span+span{color:var(--navy-2)}@media(max-width:540px){.timeline-row .shift-time{font-size:1.2rem!important}}
*{box-sizing:border-box}body{margin:0;min-width:320px;background:linear-gradient(135deg,rgba(40,199,192,.08),transparent 34rem),var(--canvas);color:var(--ink);font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;font-size:16px;line-height:1.6}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}
.topbar{min-height:112px;padding:24px max(24px,calc((100vw - 1120px)/2));display:flex;align-items:center;gap:16px;color:#fff;background:var(--navy);border-bottom:5px solid var(--cyan)}.brand-mark{width:54px;height:54px;display:grid;place-items:center;flex:0 0 auto;border:2px solid rgba(255,255,255,.3);border-radius:14px;background:rgba(255,255,255,.08);color:var(--cyan);font-size:1.55rem;font-weight:900}.eyebrow{margin:0;color:#a9c3dd;font-size:.75rem;font-weight:800;letter-spacing:.15em}h1{margin:0;font-size:clamp(1.45rem,4vw,2rem);line-height:1.25}.data-status{margin-left:auto;display:flex;align-items:center;gap:9px;color:#d8e7f6;font-size:.9rem}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 5px rgba(242,184,75,.14)}.data-status.ready .status-dot{background:var(--cyan);box-shadow:0 0 0 5px rgba(40,199,192,.14)}.data-status.error .status-dot{background:#ff7770;box-shadow:0 0 0 5px rgba(255,119,112,.14)}
main{width:min(1120px,calc(100% - 32px));margin:34px auto 56px;display:grid;gap:22px}.workspace{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:clamp(22px,4vw,36px)}.step-heading{display:flex;gap:17px;align-items:flex-start;margin-bottom:26px}.step-number{color:var(--cyan-dark);font:800 1rem/1 ui-monospace,monospace;border-top:3px solid var(--cyan);padding-top:8px}h2{margin:0;color:var(--navy);font-size:clamp(1.3rem,3vw,1.65rem);line-height:1.3}.step-heading p{margin:5px 0 0;color:var(--muted)}
.controls-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:18px}.field{display:grid;gap:7px;color:var(--navy);font-weight:750}.field small{color:var(--muted);font-size:.82rem;font-weight:500}select,input[type=text]{width:100%;min-height:50px;border:1px solid #b9c8d8;border-radius:10px;padding:10px 13px;background:#fff;color:var(--ink)}select:focus,input:focus,button:focus-visible{outline:3px solid rgba(40,199,192,.35);outline-offset:2px;border-color:var(--cyan-dark)}.notice{margin-top:20px;padding:16px;border-radius:10px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}.notice.error{color:var(--danger);background:#fff1f0;border:1px solid #ffc9c5}
.empty-state{padding:34px 16px 22px;display:grid;justify-items:center;color:var(--muted)}.calendar-icon{width:68px;height:64px;position:relative;display:grid;place-items:center;border:2px solid #b8c7d7;border-radius:12px;color:var(--navy-2)}.calendar-icon:before{content:"";position:absolute;top:14px;left:0;right:0;border-top:2px solid #b8c7d7}.calendar-icon span{position:absolute;top:-7px;width:6px;height:15px;border-radius:3px;background:var(--cyan-dark)}.calendar-icon span:first-child{left:16px}.calendar-icon span:nth-child(2){right:16px}.calendar-icon b{padding-top:12px;font-size:1.1rem}.shift-list{display:grid;gap:12px}.date-group{border-left:4px solid var(--cyan);padding-left:15px;margin-top:8px}.date-label{margin:0 0 9px;color:var(--navy);font-size:1rem}.shift-card{display:grid;grid-template-columns:118px minmax(180px,1fr) minmax(180px,.8fr);gap:16px;align-items:center;padding:15px 18px;border:1px solid var(--line);border-radius:12px;background:#fbfdff}.shift-time{color:var(--navy);font-weight:850;font-variant-numeric:tabular-nums}.shift-work{font-weight:800}.shift-place{color:var(--muted)}.location-chip{display:inline-block;margin-top:4px;padding:2px 8px;border-radius:999px;color:#075f5b;background:#dcf8f5;font-size:.8rem;font-weight:750}
.review-actions{margin-top:24px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:18px;align-items:center}.confirm-check{display:flex;gap:10px;align-items:flex-start}.confirm-check input{width:20px;height:20px;margin-top:3px;accent-color:var(--cyan-dark)}.primary,.secondary,.copy-button{border:0;border-radius:9px;padding:11px 18px;font-weight:800}.primary{min-height:48px;color:#fff;background:var(--navy)}.primary:not(:disabled):hover{background:var(--navy-2)}.secondary{color:var(--navy);background:#dfe9f3}.code-section{border-top:5px solid var(--cyan)}.safety-strip{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.safety-strip span{padding:5px 10px;border:1px solid #b8e7e4;border-radius:999px;color:#075f5b;background:#ecfbfa;font-size:.8rem;font-weight:750}.code-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px;color:var(--muted)}.copy-button{color:var(--navy);background:var(--cyan)}.copy-button:hover{background:#54d9d3}.code-box{max-height:460px;overflow:auto;margin:0;padding:20px;border-radius:12px;background:#091729;color:#d9eaf7;font:13px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre;tab-size:2}.copy-status{min-height:1.6em;margin:8px 0 0;color:var(--cyan-dark);font-weight:750}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}footer{width:min(1120px,calc(100% - 32px));margin:0 auto 38px;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:.9rem}footer p{margin:0}.text-button{border:0;padding:0;color:var(--cyan-dark);background:transparent;font-weight:800;text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.topbar{min-height:98px;padding:19px 18px}.eyebrow{display:none}.data-status{position:absolute;top:104px;left:18px;color:var(--navy-2)}main{margin-top:54px}.controls-grid{grid-template-columns:1fr}.shift-card{grid-template-columns:1fr;gap:4px}.review-actions,footer{align-items:stretch;flex-direction:column}.primary{width:100%}.code-toolbar{align-items:flex-start}}
[hidden]{display:none!important}.loading-overlay{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:rgba(16,35,63,.3);backdrop-filter:blur(7px)}.loading-card{padding:32px;text-align:center;background:white;border-radius:18px;box-shadow:var(--shadow);max-width:calc(100% - 32px)}.loading-card p{color:var(--muted)}.spinner{margin:0 auto 18px;width:40px;height:40px;border:4px solid var(--line);border-top-color:var(--cyan-dark);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.instructions{margin-top:24px;border-top:1px solid var(--line);padding-top:16px}.instructions li{margin:12px 0}.instructions a{color:var(--cyan-dark)}kbd{font:inherit;font-weight:700}#page-content[inert]{filter:blur(3px)}
.name-picker{position:relative;align-content:start}.name-options{position:absolute;top:88px;left:0;right:0;z-index:20;max-height:280px;overflow:auto;padding:6px;border:1px solid var(--line);border-radius:12px;background:white;box-shadow:0 12px 30px rgba(16,35,63,.18)}.name-option{display:block;width:100%;padding:10px 12px;text-align:left;border:0;border-radius:7px;background:white;color:var(--ink)}.name-option:hover,.name-option[aria-selected=true]{background:#dcf8f5;color:#075f5b}.name-options p{margin:10px;font-weight:400}.timeline-row{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;margin-bottom:12px;align-items:start}.timeline-row .shift-time{padding-top:16px;font-size:.9rem}.timeline-row .shift-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px 20px;background:#202429;border-color:#393e45;border-radius:16px;color:#f2f4f7}.timeline-row .shift-work{color:#f2f4f7;font-size:1.1rem;overflow-wrap:anywhere}.timeline-row .shift-place{font-size:.9rem;color:#b9c2ce}#title-preview{overflow-wrap:anywhere}@media(max-width:540px){.timeline-row{grid-template-columns:75px minmax(0,1fr);gap:8px}.timeline-row .shift-card{padding:14px}.timeline-row .shift-time{font-size:.8rem}}
.workspace{position:relative}.workspace:first-of-type{z-index:30}.duplicate-reminder{margin:22px 0 0;padding:14px 16px;background:#fff8e8;border:1px solid #efd39b;border-radius:10px;color:#765014;font-size:.9rem}footer p{max-width:850px}footer .text-button{flex-shrink:0}
@media(prefers-reduced-motion:no-preference){.workspace{animation:settle .38s ease both}@keyframes settle{from{opacity:0;transform:translateY(6px)}}}
.workspace,.field,.step-heading>div,.shift-list,.date-group{min-width:0}.controls-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}.code-box{width:100%;max-width:100%;min-width:0}.duplicate-reminder a{color:inherit;text-underline-offset:3px}.topbar{flex-wrap:wrap}.copy-status{position:fixed;bottom:28px;left:50%;transform:translate(-50%,12px);z-index:100;max-width:calc(100vw - 32px);padding:10px 22px;margin:0;border-radius:999px;background:var(--navy);color:white;box-shadow:var(--shadow);opacity:0;visibility:hidden;transition:opacity .2s,transform .2s;pointer-events:none}.copy-status.visible{opacity:1;visibility:visible;transform:translate(-50%,0)}.instructions{overflow-wrap:anywhere}@media(max-width:760px){.controls-grid{grid-template-columns:minmax(0,1fr)}}