:root{--bg-color: #f5f7fa;--container-color: #ffffff;--border-color: #e0e6ed;--screen-color: #f0f4f8;--screen-border: #d3e0ef;--input-color: #ffffff;--text-color: #2d3748;--button-color: #edf2f7;--button-border: #cbd5e0;--copy-color: #ebf8ff;--copy-border: #bee3f8;--reset-color: #fff5f5;--reset-border: #fed7d7;--dot-color: #a0aec0;--shadow-color: rgba(0, 0, 0, .08);--primary-color: #4299e1;--transition-time: .4s;--border-radius: 16px;--font-main: "SF Pro Display", -apple-system, BlinkMacSystemFont, sans-serif}.dark-mode{--bg-color: #0f172a;--container-color: #1e293b;--border-color: #334155;--screen-color: #1e293b;--screen-border: #475569;--input-color: #1e293b;--text-color: #f8fafc;--button-color: #334155;--button-border: #475569;--copy-color: #1e3a8a;--copy-border: #1e40af;--reset-color: #7f1d1d;--reset-border: #991b1b;--dot-color: #475569;--shadow-color: rgba(0, 0, 0, .3);--primary-color: #60a5fa;--glow-effect: 0 0 12px rgba(96, 165, 250, .6)}body{background-color:var(--bg-color);font-family:var(--font-main);height:100vh;display:flex;justify-content:center;align-items:center;margin:0;transition:background-color var(--transition-time) ease;color:var(--text-color)}.tamagotchi-wrapper{position:relative;display:flex;flex-direction:column;align-items:center;padding:20px}.tamagotchi-container{background-color:var(--container-color);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:24px;width:320px;box-shadow:0 10px 25px var(--shadow-color);position:relative;transition:all var(--transition-time) ease;overflow:hidden}.tamagotchi-container:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color),#a78bfa);z-index:2}.tamagotchi-screen{background-color:var(--screen-color);border:1px solid var(--screen-border);border-radius:12px;padding:20px;margin-bottom:20px;transition:all var(--transition-time) ease;position:relative;overflow:hidden}.tamagotchi-screen:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#ffffff1a,#fff0,#ffffff1a);pointer-events:none}.counter-input{background-color:var(--input-color);border:1px solid var(--screen-border);border-radius:8px;width:100%;font-size:28px;font-weight:600;text-align:center;margin-bottom:16px;color:var(--text-color);padding:12px;transition:all var(--transition-time) ease;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.dark-mode .counter-input{box-shadow:var(--glow-effect)}.counter-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #4299e133}.counter-buttons{display:flex;justify-content:space-between;gap:12px}.btn-tamagotchi{background-color:var(--button-color);border:1px solid var(--button-border);width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.btn-tamagotchi:hover{transform:translateY(-2px);border-color:var(--primary-color)}.btn-tamagotchi svg{width:20px;height:20px;transition:transform .2s ease}.btn-tamagotchi:hover svg{transform:scale(1.1)}.action-buttons{display:flex;justify-content:space-between;margin-top:20px;gap:12px}.copy-button,.reset-button{font-weight:500;padding:10px 16px;border-radius:8px;display:flex;align-items:center;gap:8px;transition:all .2s ease;font-size:14px;border:1px solid transparent}.copy-button{background-color:var(--copy-color);color:#1a56a1;border-color:var(--copy-border)}.dark-mode .copy-button{color:#bfdbfe}.reset-button{background-color:var(--reset-color);color:#9b1c1c;border-color:var(--reset-border)}.dark-mode .reset-button{color:#fecaca}.copy-button:hover,.reset-button:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.tamagotchi-dots{display:flex;justify-content:center;margin-top:24px;gap:12px}.dot{width:8px;height:8px;background-color:var(--dot-color);border-radius:50%;transition:all var(--transition-time) ease}.dark-mode .dot{box-shadow:0 0 6px #60a5fa66}.theme-toggle{margin-top:24px;padding:10px 16px;border-radius:8px;background-color:var(--button-color);color:var(--text-color);border:1px solid var(--button-border);cursor:pointer;font-weight:500;transition:all .2s ease;width:100%;display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px}.theme-toggle:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a;border-color:var(--primary-color)}.theme-toggle svg{width:16px;height:16px;transition:transform .2s ease}.theme-toggle:hover svg{transform:rotate(180deg)}.copy-message,.limit-message{position:absolute;top:16px;left:50%;transform:translate(-50%);background-color:var(--container-color);color:var(--text-color);padding:8px 16px;border-radius:20px;display:none;z-index:10;font-size:14px;font-weight:500;box-shadow:0 4px 12px #0000001a;border:1px solid var(--border-color)}.limit-message{color:#e53e3e}.dark-mode .limit-message{background-color:#7f1d1d;color:#fecaca}.credits{margin-top:24px;padding:10px 16px;border-radius:var(--border-radius);background-color:var(--button-color);border:1px solid var(--button-border);color:var(--text-color);font-size:14px;font-family:var(--font-main);transition:all var(--transition-time) ease;text-align:center;box-shadow:0 2px 8px var(--shadow-color)}.credits a{color:var(--primary-color);text-decoration:none;font-weight:500;transition:color .2s ease}.credits a:hover{color:var(--primary-color);text-decoration:underline}.dark-mode .credits{background-color:var(--container-color);border-color:var(--border-color);box-shadow:0 2px 12px #0003}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.tamagotchi-container{animation:fadeIn .6s ease-out}@keyframes pulse-glow{0%{box-shadow:0 0 #60a5fa66}70%{box-shadow:0 0 0 10px #60a5fa00}to{box-shadow:0 0 #60a5fa00}}.dark-mode .counter-input{animation:pulse-glow 3s infinite}.copy-message.show,.limit-message.show{display:block}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{width:100%;min-height:100vh;display:flex;justify-content:center;align-items:center}
