diff --git a/index.html b/index.html
new file mode 100644
index 0000000..6ca1f68
--- /dev/null
+++ b/index.html
@@ -0,0 +1,124 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>NurOS DeltaDesign Concept</title>
+    <link href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@400;700&display=swap" rel="stylesheet">
+    <style>
+        body {
+            font-family: 'Comfortaa', cursive;
+            margin: 0;
+            padding: 0;
+            background-color: #121212;
+            color: #fff;
+            transition: background-color 0.3s, color 0.3s;
+        }
+        header {
+            background-color: #1E1E1E;
+            color: #fff;
+            padding: 1em 0;
+            text-align: center;
+            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
+        }
+        .container {
+            padding: 2em;
+            max-width: 800px;
+            margin: 0 auto;
+        }
+        .theme {
+            margin-bottom: 2em;
+            padding: 1em;
+            background-color: #1E1E1E;
+            border-radius: 8px;
+            box-shadow: 0 2px 4px rgba(0,0,0,0.5);
+        }
+        .theme h2 {
+            margin-top: 0;
+            font-size: 1.5em;
+        }
+        ul {
+            padding-left: 1.2em;
+        }
+        ul li {
+            margin-bottom: 0.5em;
+        }
+    </style>
+</head>
+<body>
+    <header>
+        <h1>NurOS DeltaDesign Concept</h1>
+    </header>
+    <div class="container">
+        <section id="night-theme" class="theme">
+            <h2>Night Theme</h2>
+            <p>The main concept of NurOS Iconpack Night is based on the following principles:</p>
+            <ul>
+                <li>Deep minimalism with a focus on comfortable nighttime use</li>
+                <li>Soft transitions between shades</li>
+                <li>Reduced contrast to reduce eye strain</li>
+                <li>Maintaining readability in any lighting</li>
+                <li>Elegance and modernity in every detail</li>
+            </ul>
+            <h3>Primary Palette</h3>
+            <ul>
+                <li>Primary Dark: #121212</li>
+                <li>Secondary Dark: #1E1E1E</li>
+                <li>Night Blue: #2D5B9E</li>
+                <li>Night Purple: #6B4BA3</li>
+                <li>Night Teal: #1C746C</li>
+            </ul>
+            <h3>Neutral Shades</h3>
+            <ul>
+                <li>Surface Light: #3A3A3A</li>
+                <li>Surface Mid: #2C2C2C</li>
+                <li>Surface Dark: #1A1A1A</li>
+            </ul>
+            <h3>Color Usage Rules</h3>
+            <ul>
+                <li>A maximum of 2-3 colors per icon</li>
+                <li>The dark background always uses shades from the base palette</li>
+                <li>Accents are applied with reduced saturation</li>
+                <li>Gradients are used to create depth in dark tones</li>
+            </ul>
+            <h3>Contrast and Accessibility</h3>
+            <ul>
+                <li>Optimal contrast between elements: 2.5:1</li>
+                <li>Contrast of important elements: at least 3.5:1</li>
+                <li>All icons must be distinguishable at low screen brightness</li>
+            </ul>
+            <h3>Stylistic Standards</h3>
+            <ul>
+                <li>Main shape: rounded square with a 14px radius</li>
+                <li>Line thickness: 1.8px for better visibility in the dark</li>
+                <li>Inner padding: at least 5px from the edge</li>
+                <li>Grid size: 24x24px base size</li>
+            </ul>
+            <h3>Shadows and Volume</h3>
+            <ul>
+                <li>Inner shadows: opacity 15%, soft spread</li>
+                <li>Light glow for accent elements</li>
+                <li>Use of gradients to create volume</li>
+            </ul>
+            <h3>Implementation Recommendations</h3>
+            <ul>
+                <li>SVG as the primary format</li>
+                <li>PNG with transparency preserved</li>
+                <li>Optimization of files for dark themes</li>
+            </ul>
+            <h3>Scalability</h3>
+            <ul>
+                <li>Testing in sizes from 16x16px to 512x512px</li>
+                <li>Maintaining clarity in low light conditions</li>
+                <li>Optimization for OLED/AMOLED screens</li>
+            </ul>
+            <h3>Compatibility</h3>
+            <ul>
+                <li>Automatic adaptation to system dark theme</li>
+                <li>Correct display on different types of screens</li>
+                <li>Support for various night lighting modes</li>
+            </ul>
+        </section>
+    </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/night/index.html b/night/index.html
new file mode 100644
index 0000000..71313c5
--- /dev/null
+++ b/night/index.html
@@ -0,0 +1,151 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>DeltaDesign Concept Night Calculator</title>
+    <style>
+        body {
+            background: linear-gradient(135deg, #121212, #1E1E1E);
+            color: #fff;
+            font-family: Arial, sans-serif;
+            height: 100vh;
+            margin: 0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+        }
+
+        .calculator {
+            background: #1A1A1A;
+            width: 320px;
+            border-radius: 16px;
+            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
+            padding: 20px;
+        }
+
+        .screen {
+            background: #2C2C2C;
+            height: 80px;
+            border-radius: 8px;
+            margin-bottom: 20px;
+            box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.5);
+            display: flex;
+            justify-content: flex-end;
+            align-items: center;
+            padding: 10px;
+            color: #fff;
+            font-size: 24px;
+        }
+
+        .buttons {
+            display: grid;
+            grid-template-columns: repeat(4, 1fr);
+            gap: 10px;
+        }
+
+        .btn {
+            background: #3A3A3A;
+            color: white;
+            font-size: 18px;
+            border: none;
+            border-radius: 8px;
+            padding: 15px;
+            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
+            transition: all 0.3s ease;
+        }
+
+        .btn:hover {
+            background: #6B4BA3;
+            box-shadow: 0 6px 10px rgba(0, 0, 0, 0.7);
+        }
+
+        .btn.highlight {
+            background: #2D5B9E;
+        }
+    </style>
+</head>
+<body>
+    <div class="calculator">
+        <div class="screen" id="screen">0</div>
+        <div class="buttons">
+            <button class="btn" onclick="appendNumber('1')">1</button>
+            <button class="btn" onclick="appendNumber('2')">2</button>
+            <button class="btn" onclick="appendNumber('3')">3</button>
+            <button class="btn highlight" onclick="setOperation('+')">+</button>
+
+            <button class="btn" onclick="appendNumber('4')">4</button>
+            <button class="btn" onclick="appendNumber('5')">5</button>
+            <button class="btn" onclick="appendNumber('6')">6</button>
+            <button class="btn highlight" onclick="setOperation('-')">-</button>
+
+            <button class="btn" onclick="appendNumber('7')">7</button>
+            <button class="btn" onclick="appendNumber('8')">8</button>
+            <button class="btn" onclick="appendNumber('9')">9</button>
+            <button class="btn highlight" onclick="setOperation('*')">*</button>
+
+            <button class="btn" onclick="appendNumber('0')">0</button>
+            <button class="btn" onclick="appendNumber('.')">.</button>
+            <button class="btn highlight" onclick="calculate()">=</button>
+            <button class="btn highlight" onclick="setOperation('/')">/</button>
+        </div>
+    </div>
+
+    <script>
+        let currentNumber = '';
+        let previousNumber = '';
+        let operation = null;
+
+        const screen = document.getElementById('screen');
+
+        function appendNumber(number) {
+            if (number === '.' && currentNumber.includes('.')) return;
+            currentNumber += number;
+            updateScreen();
+        }
+
+        function setOperation(op) {
+            if (currentNumber === '') return;
+            if (previousNumber !== '') {
+                calculate();
+            }
+            operation = op;
+            previousNumber = currentNumber;
+            currentNumber = '';
+        }
+
+        function calculate() {
+            if (operation === null || currentNumber === '' || previousNumber === '') return;
+            let result;
+            const prev = parseFloat(previousNumber);
+            const current = parseFloat(currentNumber);
+
+            switch (operation) {
+                case '+':
+                    result = prev + current;
+                    break;
+                case '-':
+                    result = prev - current;
+                    break;
+                case '*':
+                    result = prev * current;
+                    break;
+                case '/':
+                    result = current === 0 ? 'Error' : prev / current;
+                    break;
+                default:
+                    return;
+            }
+
+            currentNumber = result.toString();
+            operation = null;
+            previousNumber = '';
+            updateScreen();
+        }
+
+        function updateScreen() {
+            screen.textContent = currentNumber || '0';
+        }
+    </script>
+</body>
+</html>
