@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700;800&family=M+PLUS+Rounded+1c:wght@700;800&family=Noto+Sans+JP:wght@400;700&family=Noto+Sans+Thai:wght@400;700&family=Sarabun:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap";:root{--bg-primary: #120404;--bg-secondary: #220909;--bg-accent: rgba(88, 15, 15, .7);--glass-bg: rgba(255, 255, 255, .06);--glass-border: rgba(255, 255, 255, .12);--glass-highlight: rgba(255, 255, 255, .16);--text-primary: #fff7f2;--text-secondary: #f4c7c7;--text-muted: #c98b8b;--color-primary: #c62828;--color-secondary: #8e0000;--color-accent: #ff6b6b;--color-highlight: #ff3b30;--btn-primary-from: var(--color-primary);--btn-primary-to: var(--color-secondary);--btn-primary-hover-from: var(--color-accent);--btn-primary-hover-to: var(--color-primary);--btn-primary-shadow: rgba(198, 40, 40, .25);--btn-primary-shadow-hover: rgba(198, 40, 40, .4);--color-success: #10b981;--color-warning: #f59e0b;--font-heading: "Outfit", "Inter", system-ui, -apple-system, sans-serif;--font-body: "Inter", system-ui, -apple-system, sans-serif;--font-report: "Noto Sans JP", "Noto Sans Thai", "Inter", system-ui, sans-serif;--font-employee-form: "Sarabun", "TH Sarabun New", "Noto Sans Thai", sans-serif;--font-brand-jp: "M PLUS Rounded 1c", "Zen Maru Gothic", "Kosugi Maru", sans-serif;--blur-amount: 12px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 8px 24px rgba(0, 0, 0, .4);--shadow-lg: 0 16px 40px rgba(0, 0, 0, .5);--shadow-inset: inset 0 2px 4px rgba(255, 255, 255, .05);--transition-fast: .2s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 9999px}:root,[data-theme=dark]{--header-bg: rgba(18, 4, 4, .85)}[data-theme=light]{--bg-primary: #f8f8f8;--bg-secondary: #ffffff;--bg-accent: rgba(255, 255, 255, .9);--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(0, 0, 0, .08);--glass-highlight: rgba(0, 0, 0, .04);--text-primary: #1a1a1a;--text-secondary: #404040;--text-muted: #737373;--color-primary: #e53935;--color-secondary: #ef5350;--color-accent: #ff7043;--color-highlight: #e53935;--btn-primary-from: #ef5350;--btn-primary-to: #e53935;--btn-primary-hover-from: #ff8a65;--btn-primary-hover-to: #ef5350;--btn-primary-shadow: rgba(229, 57, 53, .22);--btn-primary-shadow-hover: rgba(229, 57, 53, .32);--blur-amount: 20px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .06);--shadow-md: 0 8px 24px rgba(0, 0, 0, .08);--shadow-lg: 0 16px 40px rgba(0, 0, 0, .12);--header-bg: rgba(255, 255, 255, .92)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px;background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font-body);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-height:100vh;overflow-x:hidden;background-image:radial-gradient(circle at 10% 20%,rgba(198,40,40,.16) 0%,transparent 40%),radial-gradient(circle at 90% 80%,rgba(255,107,107,.12) 0%,transparent 40%);background-attachment:fixed}[data-theme=light] body{background-image:radial-gradient(circle at 10% 20%,rgba(198,40,40,.06) 0%,transparent 40%),radial-gradient(circle at 90% 80%,rgba(0,0,0,.03) 0%,transparent 40%)}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;line-height:1.25;color:var(--text-primary);letter-spacing:-.025em}.brand-name-jp{font-family:var(--font-brand-jp);font-weight:800;letter-spacing:.04em}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}p{color:var(--text-secondary);font-size:1rem}a{color:var(--color-primary);text-decoration:none;transition:var(--transition-fast)}a:hover{color:var(--color-accent)}:root,[data-theme=dark],[data-theme=light]{--icon-color: var(--text-secondary);--icon-color-strong: var(--text-primary);--icon-color-accent: var(--color-primary)}[data-theme=dark] img.title-icon,[data-theme=dark] img.icon-img,[data-theme=dark] .title-row>img,[data-theme=dark] .form-heading>img,[data-theme=dark] .contact-line>img,[data-theme=dark] .sea-chart-download>img{filter:brightness(0) invert(1)}svg.lucide,svg[class*=lucide-],svg[stroke=currentColor]{stroke:currentColor;flex-shrink:0}.icon-primary{color:var(--icon-color-accent);flex-shrink:0}.icon-highlight{color:var(--color-highlight);flex-shrink:0}svg.lucide:not(.icon-primary):not(.icon-highlight):not(.icon-success):not(.icon-warning),svg[class*=lucide-]:not(.icon-primary):not(.icon-highlight):not(.icon-success):not(.icon-warning),svg[stroke=currentColor]:not(.icon-primary):not(.icon-highlight):not(.icon-success):not(.icon-warning){color:var(--icon-color-strong)}.btn-primary svg,.btn-danger svg,.btn-secondary svg,a svg,button svg{color:inherit}[data-theme=dark] .site-header .theme-toggle-btn,[data-theme=dark] .site-header .lang-toggle-btn,[data-theme=dark] .site-header .header-action-btn,[data-theme=dark] .site-header .mobile-nav-link,[data-theme=dark] .admin-sidebar-toggle,[data-theme=dark] .admin-sidebar-link{color:var(--text-primary)}[data-theme=dark] .site-header .theme-toggle-btn svg,[data-theme=dark] .site-header .lang-toggle-btn svg,[data-theme=dark] .site-header .header-action-btn svg,[data-theme=dark] .site-header .mobile-nav-link svg,[data-theme=dark] .admin-sidebar-toggle svg,[data-theme=dark] .admin-sidebar-link svg{color:inherit;stroke:currentColor}input[type=date]{font-family:var(--font-body)}input[type=date]::-webkit-datetime-edit,input[type=date]::-webkit-datetime-edit-fields-wrapper,input[type=date]::-webkit-datetime-edit-text,input[type=date]::-webkit-datetime-edit-month-field,input[type=date]::-webkit-datetime-edit-day-field,input[type=date]::-webkit-datetime-edit-year-field{font-family:inherit}input:not([type=checkbox]):not([type=radio]),select,textarea{font-family:var(--font-body)}button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--font-heading);font-weight:600;font-size:.95rem;padding:.75rem 1.5rem;border-radius:var(--radius-md);border:1px solid transparent;cursor:pointer;transition:all var(--transition-normal);background:none;color:inherit}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--bg-secondary);border:2px solid var(--bg-primary);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-secondary)}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(var(--blur-amount));-webkit-backdrop-filter:blur(var(--blur-amount));border:1px solid var(--glass-border);box-shadow:var(--shadow-md),var(--shadow-inset);border-radius:var(--radius-lg);padding:1.75rem;transition:border-color var(--transition-normal),box-shadow var(--transition-normal)}.glass-panel:hover{border-color:#ffffff1f;box-shadow:var(--shadow-lg),var(--shadow-inset)}.btn-primary{background:linear-gradient(135deg,var(--btn-primary-from) 0%,var(--btn-primary-to) 100%);color:#fff;box-shadow:0 4px 15px var(--btn-primary-shadow);position:relative;overflow:hidden;isolation:isolate}[data-theme=light] .btn-primary{box-shadow:0 4px 14px var(--btn-primary-shadow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px var(--btn-primary-shadow-hover);background:linear-gradient(135deg,var(--btn-primary-hover-from) 0%,var(--btn-primary-hover-to) 100%)}.btn-primary:active:not(:disabled){transform:translateY(0) scale(.97)}.btn-primary:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at var(--ripple-x, 50%) var(--ripple-y, 50%),rgba(255,255,255,.35) 0%,transparent 55%);opacity:0;transform:scale(.4);transition:opacity .45s ease,transform .45s ease;pointer-events:none}.btn-primary:active:not(:disabled):after{opacity:1;transform:scale(1.2);transition:opacity .1s ease,transform .1s ease}.btn-secondary{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-primary)}.btn-secondary:hover{background:var(--glass-highlight);border-color:var(--color-primary)}.btn-danger{background:var(--color-highlight);color:#fff;box-shadow:0 4px 12px #ff4d4d33}[data-theme=light] .btn-danger{background:#ef5350;box-shadow:0 4px 12px #e5393533}.btn-danger:hover{transform:translateY(-2px);box-shadow:0 6px 18px #ff4d4d66}[data-theme=light] .btn-danger:hover{background:#ff7043;box-shadow:0 6px 18px #e5393547}.app-container{display:flex;flex-direction:column;min-height:100vh}.main-content{flex-grow:1;width:100%;max-width:1200px;margin:0 auto;padding:2rem 1rem}.main-content:has(.admin-shell){max-width:none;width:100%;padding:1rem 1.25rem 2rem}.main-content:has(.admin-shell--wide){padding:.75rem .5rem 1.5rem}.page-transition:has(.admin-shell--wide){width:100%;max-width:none}.main-content:has(.staff-shell){max-width:none;width:100%;padding:1rem 1.25rem 2rem}.main-content:has(.staff-shell--wide){padding:.75rem .5rem 1.5rem}.page-transition:has(.staff-shell--wide){width:100%;max-width:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn var(--transition-normal) forwards}.scroll-reveal{opacity:0;transform:translateY(24px);transition:opacity var(--transition-slow) cubic-bezier(.22,1,.36,1),transform var(--transition-slow) cubic-bezier(.22,1,.36,1);transition-delay:var(--reveal-delay, 0ms);will-change:opacity,transform}.scroll-reveal.is-visible{opacity:1;transform:translateY(0)}.page-transition{opacity:0;transform:translateY(8px);transition:opacity var(--transition-normal),transform var(--transition-normal)}.page-transition--visible{opacity:1;transform:translateY(0)}@keyframes heroWave{0%,to{transform:translateY(0) scale(1);opacity:.45}50%{transform:translateY(-6px) scale(1.02);opacity:.55}}.hero-wave{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 80% 50% at 50% 100%,rgba(198,40,40,.35) 0%,transparent 70%),linear-gradient(180deg,transparent 60%,rgba(10,17,40,.25) 100%);animation:heroWave 8s ease-in-out infinite}.site-header.is-scrolled{backdrop-filter:blur(calc(var(--blur-amount) + 4px));-webkit-backdrop-filter:blur(calc(var(--blur-amount) + 4px));box-shadow:var(--shadow-sm)}.site-header.is-scrolled .header-container{padding-top:.5rem;padding-bottom:.5rem}.site-header.is-scrolled .logo-icon{width:38px;height:38px}.btn-interactive{position:relative;overflow:hidden;isolation:isolate}.btn-interactive:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at var(--ripple-x, 50%) var(--ripple-y, 50%),rgba(255,255,255,.35) 0%,transparent 55%);opacity:0;transform:scale(.4);transition:opacity .45s ease,transform .45s ease;pointer-events:none}.btn-interactive:active:after{opacity:1;transform:scale(1.2);transition:opacity .1s ease,transform .1s ease}.btn-interactive:active:not(:disabled){transform:scale(.97)}@keyframes fishSplash{0%{opacity:0;transform:translate(-50%) scale(.6)}20%{opacity:1;transform:translate(-50%,-8px) scale(1)}to{opacity:0;transform:translate(-50%,-28px) scale(.85)}}.logo-splash{position:absolute;left:50%;bottom:-4px;font-size:1.1rem;pointer-events:none;animation:fishSplash 1.2s ease-out forwards;z-index:10;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.logo-section{position:relative}@keyframes todayPulse{0%,to{box-shadow:0 0 #10b98159}50%{box-shadow:0 0 0 4px #10b98126}}.cal-cell.today{animation:todayPulse 3s ease-in-out infinite}.progress-fill.is-animated{transition:width .8s cubic-bezier(.22,1,.36,1),background .3s ease}.loading-spinner-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;padding:2rem;color:var(--color-primary)}.loading-spinner-wrap--sm{padding:1rem}.loading-spinner-wrap--inline{flex-direction:row;padding:0;gap:.5rem}.loading-spinner-wrap--inline.loading-spinner-wrap--sm{padding:0}.loading-spinner-wrap--inline.loading-spinner-wrap--sm .fish-hook-spinner{width:22px;height:22px}.loading-spinner-wrap--sm .fish-hook-spinner{width:28px;height:28px}.fish-hook-spinner{width:40px;height:40px;animation:hookBob 1.4s ease-in-out infinite}@keyframes hookBob{0%,to{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-6px) rotate(4deg)}}.fish-hook-spinner svg{width:100%;height:100%}.hook-bobber{animation:bobberGlow 1.4s ease-in-out infinite}@keyframes bobberGlow{0%,to{opacity:.7}50%{opacity:1}}.loading-spinner-label{font-size:.9rem;color:var(--text-secondary)}.auth-loading-overlay{display:flex;align-items:center;justify-content:center;min-height:40vh}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.scroll-reveal,.page-transition{opacity:1;transform:none;transition:none}.btn-primary:hover,.btn-danger:hover{transform:none}.cal-cell.today,.hero-wave,.fish-hook-spinner{animation:none}}.grid-container{display:grid;gap:1.5rem}.grid-cols-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.grid-cols-3{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}@media (max-width: 900px){.main-content:has(.admin-shell--wide),.page-transition:has(.admin-shell--wide){overflow-x:clip;max-width:100%}}@media (max-width: 768px){html{font-size:15px}.main-content{padding:1.25rem .75rem}}@media print{html:has(.admin-report-page),html.admin-report-printing{height:auto!important;min-height:0!important}body:has(.admin-report-page),body.admin-report-printing{min-height:0!important;height:auto!important;overflow:hidden!important;background:#fff!important;background-image:none!important}body:has(.admin-report-page) .app-container,body.admin-report-printing .app-container{display:block!important;position:relative!important;min-height:0!important;height:auto!important;overflow:hidden!important}body:has(.admin-report-page) .main-content,body:has(.admin-report-page) .page-transition,body:has(.admin-report-page) .admin-shell,body:has(.admin-report-page) .admin-content,body.admin-report-printing .main-content,body.admin-report-printing .page-transition,body.admin-report-printing .admin-shell,body.admin-report-printing .admin-content{min-height:0!important;height:auto!important;max-height:none!important;flex-grow:0!important;padding:0!important;margin:0!important}body:has(.admin-report-page) .site-header,body:has(.admin-report-page) .site-footer,body.admin-report-printing .site-header,body.admin-report-printing .site-footer,body:has(.admin-report-page) .api-health-banner,body.admin-report-printing .api-health-banner{display:none!important;height:0!important;max-height:0!important;overflow:hidden!important;margin:0!important;padding:0!important;visibility:hidden!important}body:has(.admin-report-page--receipt-tax){height:auto!important;min-height:0!important;overflow:hidden!important}body:has(.admin-report-page--receipt-tax) .app-container,body:has(.admin-report-page--receipt-tax) .main-content,body:has(.admin-report-page--receipt-tax) .page-transition,body:has(.admin-report-page--receipt-tax) .admin-shell,body:has(.admin-report-page--receipt-tax) .admin-content{height:0!important;min-height:0!important;max-height:none!important;overflow:visible!important;padding:0!important;margin:0!important;flex:none!important;flex-grow:0!important}body:has(.admin-report-page--receipt-tax) *{visibility:hidden}body:has(.admin-report-page--receipt-tax) .admin-report-page--receipt-tax,body:has(.admin-report-page--receipt-tax) .admin-report-page--receipt-tax *{visibility:visible}body:has(.admin-report-page--receipt-tax) .admin-report-page--receipt-tax{position:absolute;top:0;left:0;width:100%;margin:0;padding:0}body:has(.admin-report-page--receipt-tax) .no-print{display:none!important;visibility:hidden!important}body:has(.admin-report-page--receipt){height:auto!important;min-height:0!important;overflow:hidden!important}body:has(.admin-report-page--receipt) .app-container,body:has(.admin-report-page--receipt) .main-content,body:has(.admin-report-page--receipt) .page-transition,body:has(.admin-report-page--receipt) .admin-shell,body:has(.admin-report-page--receipt) .admin-content{height:0!important;min-height:0!important;max-height:none!important;overflow:visible!important;padding:0!important;margin:0!important;flex:none!important;flex-grow:0!important}body:has(.admin-report-page--receipt) *{visibility:hidden}body:has(.admin-report-page--receipt) .admin-report-page--receipt,body:has(.admin-report-page--receipt) .admin-report-page--receipt *{visibility:visible}body:has(.admin-report-page--receipt) .admin-report-page--receipt{position:absolute;top:0;left:0;width:80mm;margin:0;padding:0}body:has(.admin-report-page--receipt) .no-print{display:none!important;visibility:hidden!important}}