:root{--primary: #49B6E5;--primary-ink: #1E7CAA;--secondary: #263D5B;--success: #16A34A;--warning: #D97706;--danger: #DC2626;--surface: #FFFFFF;--paper: #FFF8E7;--paper-2: #FFEFC9;--text: #111827;--muted: #6B7280;--ink: #1F2937;--fs-xs: 14px;--fs-sm: 16px;--fs-md: 18px;--fs-lg: 24px;--fs-xl: 32px;--fs-2xl: 40px;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-6: 24px;--s-8: 32px;--r-card: 18px 22px 16px 24px / 22px 18px 24px 16px;--r-chip: 999px;--r-btn: 14px 18px 16px 14px / 18px 14px 18px 16px;--ink-shadow: 4px 4px 0 var(--secondary);--ink-shadow-sm: 2px 2px 0 var(--secondary);--font-display: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;--font-body: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;color-scheme:light}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100vh;color:var(--text);font-family:var(--font-body);font-size:18px}body{background-color:var(--paper);background-image:radial-gradient(rgba(38,61,91,.06) 1.2px,transparent 1.2px),radial-gradient(rgba(38,61,91,.04) 1px,transparent 1px);background-size:28px 28px,14px 14px;background-position:0 0,7px 7px;padding-bottom:env(safe-area-inset-bottom)}button,input{font-family:var(--font-body);font-size:var(--fs-md);color:inherit}button{cursor:pointer;border:none;background:none}:focus-visible{outline:3px dashed var(--primary);outline-offset:3px;border-radius:6px}.app-shell{max-width:720px;margin:0 auto;padding:var(--s-4);padding-top:calc(var(--s-4) + env(safe-area-inset-top))}.heading{font-family:var(--font-display);font-size:var(--fs-2xl);font-weight:900;color:var(--secondary);margin:var(--s-2) 0 var(--s-3);letter-spacing:0;transform:rotate(-1deg);display:inline-block}.subheading{color:var(--muted);font-size:var(--fs-md);margin-bottom:var(--s-6);line-height:1.5}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);padding:12px 22px;border:2.5px solid var(--secondary);border-radius:var(--r-btn);background:var(--surface);color:var(--secondary);font-family:var(--font-display);font-size:var(--fs-md);font-weight:700;letter-spacing:0;box-shadow:var(--ink-shadow-sm);transition:transform .12s ease,box-shadow .12s ease}.btn:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--secondary)}.btn:active:not(:disabled){transform:translate(2px,2px);box-shadow:0 0 0 var(--secondary)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:var(--secondary);box-shadow:var(--ink-shadow)}.btn-primary:hover:not(:disabled){box-shadow:5px 5px 0 var(--secondary)}.btn-primary:active:not(:disabled){transform:translate(4px,4px);box-shadow:0 0 0 var(--secondary)}.btn-ghost{background:transparent;box-shadow:none;border-style:dashed}.btn-ghost:hover:not(:disabled){background:#49b6e51f;box-shadow:none;transform:none}.btn-danger{background:var(--danger);color:#fff}.btn-sm{padding:6px 12px;font-size:var(--fs-sm);border-width:2px}.card{background:var(--surface);border:2.5px solid var(--secondary);border-radius:var(--r-card);padding:var(--s-4);margin-bottom:var(--s-3);box-shadow:var(--ink-shadow)}.card+.card{transform:rotate(.4deg)}.card:nth-of-type(2n){transform:rotate(-.5deg)}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:var(--s-3);margin:var(--s-4) 0 var(--s-2)}.photo-grid .thumb{position:relative;aspect-ratio:3 / 4;border-radius:10px 14px 12px 16px/14px 10px 16px 12px;overflow:hidden;background:#000;border:2.5px solid var(--secondary);box-shadow:var(--ink-shadow-sm);transform:rotate(-1deg)}.photo-grid .thumb:nth-child(2n){transform:rotate(1.5deg)}.photo-grid .thumb:nth-child(3n){transform:rotate(-2deg)}.photo-grid .thumb img{width:100%;height:100%;object-fit:cover}.photo-grid .thumb button.remove{position:absolute;top:4px;right:4px;background:var(--surface);border:2px solid var(--secondary);color:var(--secondary);border-radius:999px;width:28px;height:28px;font-size:16px;line-height:1;font-weight:700;box-shadow:1.5px 1.5px 0 var(--secondary)}.topbar{position:sticky;top:0;background:var(--paper);padding:var(--s-3) var(--s-4);display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);z-index:10;padding-top:calc(var(--s-3) + env(safe-area-inset-top));border-bottom:2.5px dashed var(--secondary)}.page-header{position:sticky;top:0;z-index:10;background:var(--paper);border-bottom:2.5px dashed var(--secondary)}.page-header .topbar,.page-header .cat-nav{position:static;border-bottom:none}.page-header .cat-nav{border-top:1px dashed rgba(38,61,91,.3)}.topbar h1{font-family:var(--font-display);font-size:var(--fs-lg);font-weight:900;color:var(--secondary);margin:0;transform:rotate(-1deg)}.topbar--compact{padding:var(--s-2) var(--s-3);padding-top:calc(var(--s-2) + env(safe-area-inset-top))}.cat-nav{background:var(--paper)}.cat-nav__scroll{display:flex;gap:var(--s-2);overflow-x:auto;overflow-y:hidden;padding:var(--s-2) var(--s-3);scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}.cat-nav__scroll::-webkit-scrollbar{display:none}.cat-chip{flex:0 0 auto;scroll-snap-align:center;font-family:var(--font-display);font-size:var(--fs-sm);font-weight:700;color:var(--secondary);background:var(--surface);border:2px solid var(--secondary);border-radius:999px;padding:6px 14px;box-shadow:1.5px 1.5px 0 var(--secondary);transition:transform .12s ease,background-color .12s ease,box-shadow .12s ease;white-space:nowrap}.cat-chip:hover{background:var(--paper-2)}.cat-chip.is-active{background:var(--primary);color:var(--secondary);box-shadow:2.5px 2.5px 0 var(--secondary);transform:translate(-1px,-1px) rotate(-1deg)}.cat-section{scroll-margin-top:110px}@supports (scroll-margin-top: calc(env(safe-area-inset-top,0) + 110px)){.cat-section{scroll-margin-top:calc(env(safe-area-inset-top,0px) + 110px)}}.dish{display:flex;flex-direction:column;gap:var(--s-1);padding:var(--s-4);background:var(--surface);border:2.5px solid var(--secondary);border-radius:var(--r-card);margin-bottom:var(--s-3);box-shadow:var(--ink-shadow);position:relative}.dish:nth-of-type(2n){transform:rotate(-.3deg)}.dish:nth-of-type(3n){transform:rotate(.5deg)}.dish .row{display:flex;justify-content:space-between;align-items:center;gap:var(--s-3)}.dish .name-chinese{font-family:var(--font-display);font-size:var(--fs-lg);font-weight:700;color:var(--secondary);line-height:1.25}.dish .name-original{font-size:var(--fs-sm);color:var(--muted);font-style:italic;margin-top:2px}.dish .desc{font-size:var(--fs-sm);color:var(--muted);line-height:1.4;margin-top:4px}.dish .price{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--primary-ink);margin-top:4px;display:inline-block;padding:2px 8px;background:var(--paper-2);border-radius:999px}.qty{display:inline-flex;align-items:center;background:var(--surface);border:2.5px solid var(--secondary);border-radius:999px;overflow:hidden;box-shadow:var(--ink-shadow-sm)}.qty button{width:40px;height:40px;font-size:22px;font-weight:700;color:var(--secondary);font-family:var(--font-display)}.qty button:hover:not(:disabled){background:var(--paper-2)}.qty button:disabled{color:var(--muted)}.qty .n{min-width:32px;text-align:center;font-family:var(--font-display);font-weight:700;font-size:var(--fs-md);color:var(--secondary)}.category-title{font-family:var(--font-display);font-size:var(--fs-lg);font-weight:900;color:var(--secondary);letter-spacing:0;margin:var(--s-6) 0 var(--s-2);display:inline-block;position:relative;padding-bottom:6px}.category-title:after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 8' preserveAspectRatio='none'><path d='M2 5 Q 15 1 30 4 T 60 4 T 90 4 T 118 4' stroke='%2349B6E5' stroke-width='2.5' fill='none' stroke-linecap='round'/></svg>");background-repeat:no-repeat;background-size:100% 100%}.center{text-align:center;padding:80px var(--s-6);color:var(--secondary);font-family:var(--font-display);font-size:var(--fs-md)}.spinner{width:36px;height:36px;border:3px dashed var(--primary);border-radius:50%;animation:spin 2s linear infinite;margin:0 auto var(--s-4)}@keyframes spin{to{transform:rotate(360deg)}}.banner{background:#fff7d6;border:2.5px solid var(--secondary);border-radius:var(--r-card);color:var(--secondary);padding:var(--s-3) var(--s-4);font-size:var(--fs-sm);margin-bottom:var(--s-3);box-shadow:var(--ink-shadow-sm);transform:rotate(-.5deg)}.share-row{display:flex;align-items:center;gap:var(--s-3);padding:var(--s-3);background:var(--paper-2);border:2.5px dashed var(--secondary);border-radius:var(--r-card)}.share-row .url{flex:1;font-family:var(--font-mono);font-size:12px;color:var(--secondary);word-break:break-all}.qr-wrap{background:var(--surface);padding:var(--s-3);border:2.5px solid var(--secondary);border-radius:12px 16px 14px 18px/16px 12px 18px 14px;display:inline-block;box-shadow:var(--ink-shadow);transform:rotate(-2deg)}.result-item{display:flex;justify-content:space-between;align-items:center;gap:var(--s-3);padding:var(--s-4) 0;border-bottom:2px dashed var(--secondary)}.result-item:last-child{border-bottom:none}.result-name-original{font-family:var(--font-display);font-size:var(--fs-xl);font-weight:900;color:var(--secondary);line-height:1.2;word-break:break-word}.result-name-chinese{font-size:var(--fs-sm);color:var(--muted);margin-top:2px;font-style:normal}.result-item .total-qty{font-family:var(--font-display);font-weight:900;font-size:var(--fs-xl);color:var(--primary-ink);white-space:nowrap}.seg-tabs{display:inline-flex;background:var(--surface);border:2px solid var(--secondary);border-radius:999px;padding:2px;box-shadow:var(--ink-shadow-sm)}.seg-tab{font-family:var(--font-display);font-size:var(--fs-sm);font-weight:700;color:var(--secondary);padding:4px 14px;border-radius:999px}.seg-tab.is-active{background:var(--primary)}.split-line{display:flex;justify-content:space-between;align-items:center;gap:var(--s-3);padding:8px 0;border-top:1px dashed rgba(38,61,91,.25)}.split-line:first-of-type{border-top:none}.split-line__amount{font-family:var(--font-mono);font-size:var(--fs-sm);font-weight:500;color:var(--secondary);white-space:nowrap}.doodle-star{display:inline-block;width:18px;height:18px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23263D5B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3 l2 6 6 .5 -4.5 4 1.5 6 -5-3-5 3 1.5-6L4 9.5 10 9z'/></svg>") no-repeat center / contain}.scribble-divider{height:16px;margin:var(--s-4) 0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 16' preserveAspectRatio='none'><path d='M2 10 Q 30 2 60 9 T 120 9 T 180 9 T 240 9 T 300 9 T 360 9 T 398 9' stroke='%23263D5B' stroke-width='2' fill='none' stroke-linecap='round' stroke-dasharray='1 0'/></svg>");background-repeat:no-repeat;background-size:100% 100%}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#263d5b59;display:flex;align-items:center;justify-content:center;padding:var(--s-4);z-index:100}.modal{width:100%;max-width:420px;background:var(--surface);border:2.5px solid var(--secondary);border-radius:var(--r-card);padding:var(--s-6);box-shadow:6px 6px 0 var(--secondary);transform:rotate(-.5deg)}.modal .heading{transform:rotate(-1deg)}.text-input{width:100%;padding:12px 14px;border:2.5px solid var(--secondary);border-radius:var(--r-btn);background:var(--paper);font-family:var(--font-body);font-size:var(--fs-md);font-weight:700;color:var(--secondary);outline:none}.text-input:focus{background:var(--surface);box-shadow:var(--ink-shadow-sm)}.orderers{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s-2);padding-top:var(--s-2);border-top:1px dashed rgba(38,61,91,.3)}.orderer-chip{display:inline-block;font-size:12px;color:var(--secondary);background:var(--paper-2);border:1.5px solid var(--secondary);border-radius:999px;padding:2px 10px;font-weight:700}.orderer-chip.is-me{background:var(--primary);color:var(--secondary)}.dest-picker{display:flex;align-items:center;gap:var(--s-3);padding:var(--s-3) var(--s-4);background:var(--paper-2);border:2.5px solid var(--secondary);border-radius:var(--r-card);margin-bottom:var(--s-3);box-shadow:var(--ink-shadow-sm);transform:rotate(-.3deg)}.dest-picker__label{font-weight:700;font-size:var(--fs-sm);color:var(--secondary);white-space:nowrap}.dest-picker__select{flex:1;font-family:var(--font-body);font-size:var(--fs-md);font-weight:700;color:var(--secondary);background:var(--surface);border:2px solid var(--secondary);border-radius:10px 14px 12px/14px 10px 14px 12px;padding:8px 32px 8px 12px;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23263D5B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='M3 6 l5 5 5-5'/></svg>");background-repeat:no-repeat;background-position:right 10px center;background-size:14px;cursor:pointer}.tag{display:inline-block;font-family:var(--font-display);font-size:var(--fs-xs);color:var(--secondary);background:var(--paper-2);border:2px solid var(--secondary);border-radius:999px;padding:2px 10px;transform:rotate(-2deg)}