@font-face{font-family:Buffalo;src:url(/fonts/Buffalo.otf) format("opentype");font-weight:400;font-style:normal}@font-face{font-family:RobotoCustom;src:url(/fonts/Roboto-Regular.ttf) format("truetype");font-weight:400;font-style:normal}:root{--bg-color: #000000;--panel-bg: rgba(255, 255, 255, .05);--border-color: rgba(255, 255, 255, .1);--text-primary: #ffffff;--text-secondary: #888888;--accent-color: #ff6b00;--past-color: #ffffff;--future-color: #222222;--special-color: #ffcf00;--glass-bg: rgba(18, 18, 18, .8);--button-radius: 12px;--font-family: "RobotoCustom", "Inter", -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-primary);min-height:100vh;line-height:1.5}#app{width:100%;max-width:600px;margin:0 auto;padding:40px 20px}.main-content{display:flex;flex-direction:column;gap:48px;align-items:center}.site-header{text-align:center}.site-header h1{font-size:32px;font-weight:800;letter-spacing:-.02em;margin-bottom:8px}.site-header p{color:var(--text-secondary);font-size:16px}.config-panel{width:100%;background:var(--panel-bg);border:1px solid var(--border-color);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:24px}.config-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media(max-width:480px){.config-grid{grid-template-columns:1fr}}.control-group{display:flex;flex-direction:column;gap:8px}.control-group label{font-size:13px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}select,input[type=text],input[type=date]{background:#ffffff14;border:1px solid var(--border-color);color:#fff;padding:12px;border-radius:var(--button-radius);font-size:15px;outline:none;width:100%}select:focus,input:focus{border-color:var(--accent-color)}.btn-text{background:none;border:none;color:var(--accent-color);font-weight:600;font-size:14px;cursor:pointer;display:flex;align-items:center;gap:4px;padding:8px 0}.dates-list{display:flex;flex-direction:column;gap:8px}.legend{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;padding-top:16px;border-top:1px solid var(--border-color)}.legend-item{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-secondary)}.dot{width:8px;height:8px;border-radius:50%}.dot.past{background:var(--past-color)}.dot.present{background:var(--accent-color)}.dot.future{background:var(--future-color)}.dot.special{background:var(--special-color)}.actions{width:100%}.btn-main{width:100%;background:var(--accent-color);color:#fff;border:none;padding:16px;border-radius:40px;font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:transform .2s,box-shadow .2s}.btn-main:hover{transform:translateY(-2px);box-shadow:0 8px 25px #ff6b0066}.preview-section{display:flex;flex-direction:column;align-items:center;gap:24px;width:100%}.phone-frame-container{padding:20px;background:radial-gradient(circle at center,#1a1a1a,#000);border-radius:64px;box-shadow:0 40px 100px #000c;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.phone-frame{width:330px;height:720px;background:#000;border:14px solid #1a1a1a;border-radius:48px;position:relative;overflow:hidden;box-shadow:inset 0 0 30px #ffffff05}.phone-notch{position:absolute;top:0;left:50%;transform:translate(-50%);width:120px;height:30px;background:#000;border-bottom-left-radius:18px;border-bottom-right-radius:18px;z-index:10}.phone-content-wrapper{width:100%;height:100%;position:relative}.preview-wrapper{width:100%;height:100%}#grid-canvas{width:100%;height:100%;object-fit:contain}.shortcut-section{width:100%}.shortcut-card{background:#111;border:1px solid var(--border-color);border-radius:20px;padding:32px;text-align:center;display:flex;flex-direction:column;gap:16px}.shortcut-card h3{font-size:18px;font-weight:700}.shortcut-card p{font-size:14px;color:var(--text-secondary);line-height:1.6}.btn-install{background:#fff;color:#000;text-decoration:none;padding:16px;border-radius:12px;font-weight:800;font-size:18px;margin-top:8px;transition:transform .2s}.btn-install:hover{transform:scale(1.02)}.site-footer{font-size:12px;color:var(--text-secondary);text-align:center;padding-bottom:20px}.site-footer a{color:var(--text-primary);text-decoration:none}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}