.safari .flex{display:-webkit-box;display:-webkit-flex;display:flex}.safari .grid{display:-webkit-grid;display:grid}@supports (-webkit-touch-callout:none){.flex{display:-webkit-box;display:-webkit-flex;display:flex}.grid{display:-webkit-grid;display:grid}}.safari .sticky{position:-webkit-sticky;position:sticky}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}.safari .glassmorphism{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.safari .responsive-font{font-size:16px;font-size:min(max(14px,3vw),22px)}.safari .layout-fix{transform:translateZ(0);-webkit-transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}@supports (-webkit-touch-callout:none){.full-height{height:-webkit-fill-available}}.btn-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--gap)}.btn,.btn-ghost,.btn-outline,.btn-primary{appearance:none;-webkit-tap-highlight-color:transparent;border:1px solid var(--border-color);background:var(--surface-color);color:var(--text-color);padding:var(--btn-padding);border-radius:var(--btn-border-radius);font-weight:700;cursor:pointer;box-shadow:var(--shadow-sm);transition:all var(--transition) ease;display:inline-flex;align-items:center;justify-content:center;gap:var(--gap-sm);text-decoration:none;user-select:none;max-width:100%;min-width:0;box-sizing:border-box}.btn-ghost:hover,.btn-outline:hover,.btn-primary:hover,.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-lg);filter:brightness(1.03)}.btn-ghost:active,.btn-outline:active,.btn-primary:active,.btn:active{transform:translateY(0);filter:none}.btn-ghost:focus-visible,.btn-outline:focus-visible,.btn-primary:focus-visible,.btn:focus-visible{outline:2px solid transparent;box-shadow:0 0 0 4px var(--ring-color),var(--shadow-lg)}.btn-lg{padding:var(--btn-padding-lg);font-size:1.05rem}.btn-sm{padding:var(--btn-padding-sm);font-size:.92rem;border-radius:var(--btn-border-radius-sm)}.btn-primary{background:linear-gradient(180deg,color-mix(in oklab,var(--btn-bg) 88%,#fff 12%),var(--btn-bg));color:var(--btn-text)}.btn-ghost,.btn-primary{border-color:transparent}.btn-ghost,.btn-outline{background:transparent}.btn:disabled,.btn[disabled]{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}html.dark .btn-primary{color:#ffffff!important}html.dark .btn,html.dark .btn-ghost,html.dark .btn-outline{border-color:rgba(255,255,255,.08);box-shadow:none}.card-grid,.options-grid{display:grid;grid-template-columns:var(--grid-columns);gap:var(--grid-gap)}.article-card,.mode-card,.option-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius);padding:var(--gap-lg);box-shadow:var(--shadow);display:flex;flex-direction:column;transition:all var(--transition-slow);min-width:0;max-width:100%;box-sizing:border-box}.article-card:hover,.mode-card:hover,.option-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}html.dark .article-card:hover,html.dark .mode-card:hover,html.dark .option-card:hover{box-shadow:0 8px 25px rgba(0,0,0,.3)}.card-actions{margin-top:auto;padding-top:var(--gap);display:flex;flex-wrap:wrap;gap:var(--gap-sm);align-items:center}.list-footer{display:flex;justify-content:center;margin-top:var(--gap)}.list-footer .btn{min-width:180px}.article-card,.mode-card,.option-card{container-type:inline-size}@container (max-width: 420px){.card-actions{display:grid;grid-template-columns:1fr;gap:var(--gap-sm)}.card-actions .btn{width:100%;max-width:100%;min-width:0}}.list-hint{margin-top:var(--gap-sm);text-align:center;font-size:.85rem;color:var(--text-muted)}.leaderboard-container{width:100%;max-width:var(--leaderboard-max-width);margin:0 auto;padding:var(--leaderboard-padding);box-sizing:border-box;color:var(--text-color);overflow-x:auto}@media (max-width:320px){.leaderboard-container{padding:0 4px;font-size:12px}}.leaderboard-header,.leaderboard-row{display:grid;grid-template-columns:var(--leaderboard-grid-columns);align-items:center;gap:var(--leaderboard-gap)}.leaderboard-header{font-weight:600;padding:10px 0;border-bottom:1px solid var(--border-color);color:var(--text-muted);font-size:clamp(12px,2.5vw,14px)}@media (max-width:640px){.leaderboard-header{font-size:clamp(10px,3vw,12px);padding:8px 0}}@media (max-width:480px){.leaderboard-header{font-size:clamp(9px,3.5vw,11px);padding:6px 0}}@media (max-width:380px){.leaderboard-header{font-size:clamp(8px,4vw,10px);padding:4px 0}}.leaderboard-entries{margin-top:8px}.leaderboard-row{padding:8px 0;color:var(--text-color);border-bottom:1px solid var(--border-color)}.leaderboard-row,.leaderboard-row>*{min-width:0;max-width:100%}.leaderboard-container .col-rank{text-align:right;padding-right:8px;color:var(--text-muted);font-size:clamp(14px,2.5vw,16px);font-variant-numeric:tabular-nums}.leaderboard-container .col-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:8px;font-size:clamp(14px,2.5vw,16px);color:var(--text-color);text-align:left;word-break:break-all;cursor:help;transition:var(--transition-fast)}.leaderboard-container .col-name:hover{color:var(--primary-color)}@media (max-width:640px){.leaderboard-container .col-name{font-size:clamp(12px,3vw,14px);padding-right:4px;max-width:100%}}@media (max-width:480px){.leaderboard-container .col-name{font-size:clamp(11px,3.5vw,13px);padding-right:2px}}@media (max-width:380px){.leaderboard-container .col-name{font-size:clamp(10px,4vw,12px);padding-right:1px}}.leaderboard-container .col-level{text-align:center;font-size:clamp(11px,2vw,13px);font-weight:500;color:var(--text-muted);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width:640px){.leaderboard-container .col-level{font-size:clamp(9px,2.5vw,11px)}}@media (max-width:480px){.leaderboard-container .col-level{font-size:clamp(8px,3vw,10px)}}@media (max-width:380px){.leaderboard-container .col-level{font-size:clamp(7px,3.5vw,9px)}}.leaderboard-container .col-badge{text-align:center;min-width:0;overflow:hidden;font-weight:500;color:var(--text-color)}.leaderboard-container .badge-pill{display:inline-flex;align-items:center;gap:6px;color:var(--text-color);font-size:clamp(11px,2vw,12px);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.leaderboard-container .badge-pill .emoji{display:inline-block;font-size:1.2em;margin-right:2px;flex-shrink:0}@media (max-width:640px){.leaderboard-container .badge-pill{font-size:clamp(9px,2.5vw,11px);gap:3px}.leaderboard-container .badge-pill .emoji{font-size:1.1em;margin-right:1px}}@media (max-width:480px){.leaderboard-container .badge-pill{font-size:clamp(8px,3vw,10px);gap:2px}.leaderboard-container .badge-pill .emoji{font-size:1em;margin-right:0}}@media (max-width:380px){.leaderboard-container .badge-pill{font-size:clamp(7px,3.5vw,9px);gap:1px}.leaderboard-container .badge-pill .emoji{font-size:.9em}}.leaderboard-container .col-score{text-align:right;font-variant-numeric:tabular-nums;font-size:clamp(14px,2.5vw,16px);color:var(--text-color);font-weight:600}.leaderboard-container .btn,.leaderboard-container .btn-sm{font-size:.875rem;padding:var(--btn-padding-sm);border-radius:var(--btn-border-radius-sm)}@media (max-width:640px){.leaderboard-container .col-name{padding-right:6px}.leaderboard-container .col-rank{font-size:clamp(12px,3vw,14px);padding-right:4px}.leaderboard-container .col-score{font-size:clamp(12px,3vw,14px)}}@media (max-width:480px){.leaderboard-container .col-rank{font-size:clamp(11px,3.5vw,13px);padding-right:2px}.leaderboard-container .col-score{font-size:clamp(11px,3.5vw,13px)}}@media (max-width:380px){.leaderboard-container .col-rank{font-size:clamp(10px,4vw,12px);padding-right:1px}.leaderboard-container .col-score{font-size:clamp(10px,4vw,12px)}.leaderboard-container .badge-pill{padding:2px 6px}}:root{--text-default:var(--text-color);--muted:var(--text-muted);--surface:var(--surface-color);--result-item-bg:var(--surface-color);--primary-gradient:linear-gradient(135deg,#4CAF50,#43a047)}html.dark{--primary-gradient:linear-gradient(135deg,#8e24aa,#7b1fa2)}html.light{--primary-gradient:linear-gradient(135deg,#4CAF50,#43a047)}.simulator-container{max-width:1000px;margin:0 auto;padding:var(--gap-lg) var(--gap);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);color:var(--text-default)}.simulator-title{text-align:center;margin-bottom:var(--gap-lg);font-size:2rem;font-weight:600;background:linear-gradient(90deg,#4CAF50,#2196F3);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.simulator-tabs{display:flex;justify-content:center;gap:var(--gap-sm);margin-bottom:var(--gap-lg);flex-wrap:wrap}.simulator-tab{padding:var(--gap-sm) var(--gap);background-color:#f8f9fa;border:none;border-radius:var(--radius-sm);cursor:pointer;font-weight:600;font-size:.9rem;transition:all var(--transition-slow);box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:var(--gap-sm);color:var(--text-default)}.simulator-tab.active{background:var(--primary-gradient);color:white;transform:translateY(-3px);box-shadow:0 4px 12px rgba(76,175,80,.3)}.simulator-tab:hover{background-color:#f0f0f0;transform:translateY(-2px)}.simulator-tab.active:hover{background:linear-gradient(135deg,#43a047,#388e3c)}.simulator-content{min-height:300px}.simulator-section{animation:fadeIn .5s ease;max-width:800px;margin:0 auto;padding:var(--gap);background-color:rgba(240,240,240,.9);backdrop-filter:blur(10px);border-radius:var(--radius);box-shadow:var(--shadow-sm);color:var(--text-default)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.expense-form{display:flex;flex-direction:column;gap:var(--gap-sm);margin-bottom:var(--gap-xl)}.form-group{margin-bottom:var(--gap)}.input-icon-wrapper{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:12px;font-size:1.2rem;z-index:1}.modern-input{width:100%;padding:10px 10px 10px 40px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:14px;transition:all var(--transition-slow);box-shadow:var(--shadow-sm);background:var(--surface-color);color:var(--text-default)}.modern-input:focus{border-color:#4CAF50;box-shadow:0 0 0 3px rgba(76,175,80,.2);outline:none}.modern-button{display:flex;align-items:center;justify-content:center;gap:var(--gap-sm);padding:10px 20px;background:var(--primary-gradient);color:white;border:none;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;transition:all var(--transition-slow);box-shadow:0 4px 8px rgba(76,175,80,.3)}.modern-button:hover{background:linear-gradient(135deg,#43a047,#388e3c);transform:translateY(-2px);box-shadow:0 6px 12px rgba(76,175,80,.4)}.button-icon{font-size:18px}.chart-container{margin:2rem 0}.chart-wrapper{height:clamp(200px,40vw,300px);position:relative;margin:0 auto;max-width:500px}.calculation-results{margin:var(--gap-lg) 0;padding:var(--gap-sm);background-color:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-sm);color:var(--text-default)}.results-container{display:flex;flex-direction:column;gap:var(--gap-sm);margin-top:var(--gap)}.result-item{display:flex;justify-content:space-between;align-items:center;padding:var(--gap-sm) var(--gap-sm);background-color:var(--result-item-bg);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm)}.result-label{font-weight:600;color:var(--text-default)}.result-value{font-weight:500}.friendly-reminder{margin-top:var(--gap-xl);padding:var(--gap);background-color:#f9f9f9;border-radius:var(--radius);box-shadow:var(--shadow-sm)}.reminder-card{display:flex;align-items:center;gap:var(--gap);padding:var(--gap-sm);background-color:var(--surface-color);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);margin-bottom:var(--gap-lg)}.reminder-icon{font-size:2rem}.reminder-tips{flex-direction:column}.reminder-tips,.tip-item{display:flex;gap:var(--gap-sm)}.tip-item{align-items:center;padding:var(--gap-sm);background-color:var(--surface-color);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm)}html.dark .simulator-tab{background-color:#444;color:var(--text-default)}html.dark .simulator-tab.active{background:var(--primary-gradient)}html.dark .simulator-tab:hover{background-color:#555}html.dark .simulator-tab.active:hover{background:linear-gradient(135deg,#7b1fa2,#6a1b9a)}html.dark .simulator-section{background-color:rgba(50,50,50,.8)}html.dark .modern-input{background-color:#333;border-color:#555;color:var(--text-default)}html.dark .modern-input::placeholder{color:#aaa}html.dark .modern-input:focus{border-color:#8e24aa;box-shadow:0 0 0 3px rgba(142,36,170,.2)}html.dark .modern-button{background:var(--primary-gradient);box-shadow:0 4px 8px rgba(142,36,170,.3)}html.dark .modern-button:hover{background:linear-gradient(135deg,#7b1fa2,#6a1b9a);box-shadow:0 6px 12px rgba(142,36,170,.4)}html.dark .friendly-reminder{background-color:#333}html.dark .reminder-card,html.dark .tip-item{background-color:#444;color:var(--text-default)}html.dark .calculation-results{background-color:#444}html.dark .result-item{background-color:var(--result-item-bg)}html.dark .result-label{color:var(--text-default)}@media (max-width:768px){.simulator-title{font-size:1.75rem}.simulator-tabs{gap:.5rem}.simulator-tab{padding:.5rem}.chart-wrapper{height:clamp(180px,42vw,260px)}}@media (max-width:480px){.simulator-title{font-size:1.5rem}.simulator-tabs{gap:.5rem}.modern-input{font-size:12px;padding:8px 8px 8px 35px}.modern-button{padding:8px 16px;font-size:12px}}.navbar{background-color:rgba(255,255,255,.7);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);position:sticky;top:0;width:100%;z-index:1000;border-bottom:1px solid var(--border-color);transition:background-color .3s ease,border-color .3s ease}html.dark .navbar{background-color:rgba(15,23,42,.7)}.navbar .container{display:flex;justify-content:space-between;align-items:center;padding:1rem 0;height:var(--navbar-h);box-sizing:border-box}.navbar .logo{display:inline-flex;align-items:center;gap:10px;font-size:1.25rem;font-weight:700;color:var(--text-color);text-decoration:none;transition:color .2s ease}.navbar .logo:hover{color:var(--primary-color)}.navbar .logo img{display:block}.navbar nav{display:flex;gap:1.5rem}.navbar nav a{font-weight:500;color:var(--text-color);text-decoration:none;position:relative;padding:.25rem 0;transition:color .2s ease}.navbar nav a:hover{color:var(--primary-color)}.navbar nav a:after{content:"";position:absolute;width:100%;height:2px;background-color:var(--primary-color);bottom:0;left:0;transform:scaleX(0);transform-origin:bottom right;transition:transform .3s ease-out}.navbar nav a:hover:after{transform:scaleX(1);transform-origin:bottom left}.navbar .logo-desktop,.navbar .search-form-desktop,.navbar nav{display:none}.navbar .logo-mobile,.navbar .menu-toggle,.navbar .search-icon-mobile{display:block}.header-actions{display:flex;align-items:center;gap:.75rem}.menu-toggle{background:none;border:none;cursor:pointer;padding:.25rem;color:var(--text-color);z-index:1001}.search-icon-mobile{color:var(--text-color);font-size:1.5rem;text-decoration:none}.navbar nav.nav-open{display:flex;flex-direction:column;position:absolute;top:var(--navbar-h);left:0;width:100%;background-color:var(--surface-color);padding:1rem;border-bottom:1px solid var(--border-color);box-shadow:0 4px 12px rgba(0,0,0,.1);gap:1rem}.navbar nav.nav-open a{padding:.5rem;border-radius:6px}.navbar nav.nav-open a:hover{background-color:var(--bg-color)}.navbar .logo img{max-width:100%;height:auto}@media (min-width:992px){.navbar .logo-desktop,.navbar .search-form-desktop,.navbar nav{display:flex;align-items:center}.navbar .logo-mobile,.navbar .menu-toggle,.navbar .search-icon-mobile{display:none}.navbar nav{position:static;flex-direction:row;background:none;padding:0;border:none;box-shadow:none;gap:1.5rem}.search-form-desktop{gap:.5rem}.search-form-desktop input{padding:.5rem .75rem;border:1px solid var(--border-color);border-radius:8px;background-color:var(--surface-color);color:var(--text-color)}}#darkModeToggle{background:none;border:none;cursor:pointer;font-size:1.5rem;padding:.25rem;margin-left:1rem;line-height:1;border-radius:8px;transition:transform .2s ease}#darkModeToggle:hover{transform:scale(1.1) rotate(15deg)}#darkModeToggle:focus-visible{outline:3px solid var(--ring-color);outline-offset:2px}.logo-mobile{display:none}.search-bar-global{display:flex}.search-toggle-mobile{display:none}