��

mybb@mybb.ru (cashew) — Thu, 08 Oct 2026 13:42:14 +0300

[hideprofile]
[html]
<style>
/* �� */
.folio-card {
--paper: #f5f3ef;
--panel: #fffefa;
--ink: #343738;
--muted: #696d69;
--line: #deded6;
--accent: #526759;
box-sizing: border-box;
position: relative;
width: 100%;
max-width: 860px;
margin: 24px auto;
padding: 24px;
border: 1px solid var(--line);
border-radius: 18px;
background: var(--paper);
color: var(--ink);
font: 16px/1.65 Arial, sans-serif;
text-align: left;
color-scheme: light;
}
.folio-card * { box-sizing: border-box; }
.folio-card .folio-radio {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
overflow: hidden;
clip-path: inset(50%);
}
.folio-card .folio-layout { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 22px; }
.folio-card .folio-nav { display: flex; flex-direction: column; gap: 9px; padding-top: 7px; }
.folio-card .folio-caption { margin: 0 0 20px; color: var(--muted); font: 11px/1.5 Arial, sans-serif; letter-spacing: 2px; text-transform: uppercase; }
.folio-card .folio-nav label {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
width: 100%;
margin: 0;
padding: 12px 15px;
border: 1px solid var(--line);
border-radius: 7px;
background: transparent;
color: var(--ink);
font: 14px/1.4 Arial, sans-serif;
cursor: pointer;
transition: background .18s ease, color .18s ease;
}
.folio-card .folio-nav label span { font-size: 10px; opacity: .65; }
.folio-card .folio-nav label:hover { background: var(--panel); }
.folio-card .folio-main { min-width: 0; min-height: 370px; padding: 30px; border: 1px solid var(--line); border-radius: 11px; background: var(--panel); }
.folio-card .folio-panel { display: none; }
.folio-card .folio-kicker { margin-bottom: 16px; color: var(--accent); font: 11px/1.5 Arial, sans-serif; letter-spacing: 2px; text-transform: uppercase; }
.folio-card .folio-title { margin: 0 0 22px; padding: 0; border: 0; background: none; color: var(--ink); font: normal 36px/1.12 Georgia, serif; letter-spacing: -1px; text-transform: none; }
.folio-card .folio-text { margin: 0 0 16px; padding: 0; font: inherit; color: var(--ink); }
.folio-card .folio-note { margin-top: 25px; padding-top: 17px; border-top: 1px solid var(--line); color: var(--muted); font: 13px/1.65 Arial, sans-serif; }
.folio-card .folio-price { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.folio-card .folio-price strong { flex-shrink: 0; color: var(--accent); font-weight: 600; }
.folio-card .folio-footer { display: flex; justify-content: space-between; gap: 12px; margin-top: 19px; color: var(--muted); font: 11px/1.5 Arial, sans-serif; letter-spacing: .5px; }

/* �� */
.folio-card .folio-radio:nth-of-type(1):checked ~ .folio-layout .folio-panel:nth-child(1),
.folio-card .folio-radio:nth-of-type(2):checked ~ .folio-layout .folio-panel:nth-child(2),
.folio-card .folio-radio:nth-of-type(3):checked ~ .folio-layout .folio-panel:nth-child(3) { display: block; }
.folio-card .folio-radio:nth-of-type(1):checked ~ .folio-layout > .folio-nav > label:nth-of-type(1),
.folio-card .folio-radio:nth-of-type(2):checked ~ .folio-layout > .folio-nav > label:nth-of-type(2),
.folio-card .folio-radio:nth-of-type(3):checked ~ .folio-layout > .folio-nav > label:nth-of-type(3) { background: var(--ink); border-color: var(--ink); color: var(--panel); }
.folio-card .folio-radio:nth-of-type(1):focus-visible ~ .folio-layout > .folio-nav > label:nth-of-type(1),
.folio-card .folio-radio:nth-of-type(2):focus-visible ~ .folio-layout > .folio-nav > label:nth-of-type(2),
.folio-card .folio-radio:nth-of-type(3):focus-visible ~ .folio-layout > .folio-nav > label:nth-of-type(3) { outline: 2px solid var(--accent); outline-offset: 3px; }
@media (max-width: 620px) {
.folio-card { padding: 15px; }
.folio-card .folio-layout { grid-template-columns: minmax(0, 1fr); gap: 15px; }
.folio-card .folio-nav { flex-direction: row; flex-wrap: wrap; padding: 0; }
.folio-card .folio-caption { width: 100%; margin-bottom: 3px; }
.folio-card .folio-nav label { width: auto; flex: 1; min-width: 90px; padding: 10px; }
.folio-card .folio-main { padding: 23px 19px; min-height: 0; }
.folio-card .folio-title { font-size: 30px; }
.folio-card .folio-price { flex-wrap: wrap; gap: 3px 12px; }
}
@media (prefers-reduced-motion: reduce) { .folio-card .folio-nav label { transition: none; } }
/* �� */
.folio-card .fg-switch { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); }
.folio-card .fg-tabs { display: flex; flex-wrap: wrap; gap: 7px; margin: 20px 0 15px; }
.folio-card .fg-tabs label { display: block; margin: 0; padding: 7px 11px; border: 1px solid var(--line); border-radius: 5px; background: transparent; color: var(--accent); font: 13px/1.5 Arial,sans-serif; cursor: pointer; transition: background .18s,color .18s; }
.folio-card .fg-tabs label:hover { background: var(--paper); }
.folio-card .fg-switch:nth-of-type(1):checked ~ .fg-tabs label:nth-child(1),
.folio-card .fg-switch:nth-of-type(2):checked ~ .fg-tabs label:nth-child(2),
.folio-card .fg-switch:nth-of-type(3):checked ~ .fg-tabs label:nth-child(3),
.folio-card .fg-switch:nth-of-type(4):checked ~ .fg-tabs label:nth-child(4) { background: var(--accent); border-color: var(--accent); color: var(--panel); }
.folio-card .fg-switch:nth-of-type(1):focus-visible ~ .fg-tabs label:nth-child(1),
.folio-card .fg-switch:nth-of-type(2):focus-visible ~ .fg-tabs label:nth-child(2),
.folio-card .fg-switch:nth-of-type(3):focus-visible ~ .fg-tabs label:nth-child(3),
.folio-card .fg-switch:nth-of-type(4):focus-visible ~ .fg-tabs label:nth-child(4) { outline: 2px solid var(--accent); outline-offset: 3px; }
.folio-card .fg-panel { display: none; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-bottom: 20px; }
.folio-card .fg-switch:nth-of-type(1):checked ~ .fg-panels > .fg-panel:nth-child(1),
.folio-card .fg-switch:nth-of-type(2):checked ~ .fg-panels > .fg-panel:nth-child(2),
.folio-card .fg-switch:nth-of-type(3):checked ~ .fg-panels > .fg-panel:nth-child(3),
.folio-card .fg-switch:nth-of-type(4):checked ~ .fg-panels > .fg-panel:nth-child(4) { display: grid; }
/* �� , �� */
.folio-card .fg-shot { min-width: 0; height: 112px; margin: 0; padding: 0; border: 0; background: none; }
.folio-card .fg-shot summary { display: flex; align-items: center; justify-content: center; width: 100%; height: 112px; margin: 0; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--paper); cursor: zoom-in; list-style: none; }
.folio-card .fg-shot summary::-webkit-details-marker { display: none; }
.folio-card .fg-shot summary::marker { content: ''; }
.folio-card .fg-shot summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.folio-card .fg-shot img { display: block; width: 100%; height: 100%; max-width: none; margin: 0; padding: 0; border: 0; object-fit: cover; filter: saturate(.55) brightness(.8); transition: filter .22s ease; }
.folio-card .fg-shot summary:hover img,
.folio-card .fg-shot summary:focus-visible img { filter: saturate(1) brightness(1); }
.folio-card .fg-empty { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 9px; width: 100%; height: 100%; padding: 15px; color: var(--muted); background: var(--paper); font: 12px/1.5 Arial,sans-serif; text-align: center; }
.folio-card .fg-empty::before { content: '+'; font: 26px/1 Georgia,serif; opacity: .5; }
.folio-card .fg-shot[open] summary { position: fixed; inset: 0; z-index: 2147483647; width: 100%; height: 100%; padding: 48px 24px; border: 0; border-radius: 0; background: rgba(20,24,22,.88); cursor: zoom-out; }
.folio-card .fg-shot[open] summary::after { content: '× ��'; position: absolute; top: 15px; right: 22px; color: #fff; font: 14px/1.5 Arial,sans-serif; }
.folio-card .fg-shot[open] img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; filter: none; }
.folio-card .fg-shot[open] .fg-empty { width: 760px; max-width: 100%; height: 500px; max-height: 100%; border-radius: 9px; }
@media (max-width: 620px) { .folio-card .fg-panel { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (prefers-reduced-motion: reduce) { .folio-card .fg-shot img,.folio-card .fg-tabs label { transition: none; } }
</style>

<div class="folio-card">
<input class="folio-radio" type="radio" name="folio-tabs-01" id="folio-about-01" aria-label="� ��" checked>
<input class="folio-radio" type="radio" name="folio-tabs-01" id="folio-design-01" aria-label="��">
<input class="folio-radio" type="radio" name="folio-tabs-01" id="folio-html-01" aria-label="��">
<div class="folio-layout">
<div class="folio-nav">
<div class="folio-caption">�� </div>
<label for="folio-about-01">� �� <span>01</span></label>
<label for="folio-design-01">�� <span>02</span></label>
<label for="folio-html-01">�� <span>03</span></label>
</div>
<div class="folio-main">
<section class="folio-panel">
<div class="folio-kicker">�� </div>
<h2 class="folio-title">��, � ��<br>� �� .</h2>
<p class="folio-text">�� , ��, �� ? ��, �� , �� ? ��!<br><br>
�� . �� : �� , �� .</p>
<p class="folio-text">�� , �� .</p>
<p class="folio-text">�� , �� 2-3 ��..</p>
<p class="folio-text"><<< �� , �� </p>
<div class="folio-note">�� ? �� , �� .</div>
</section>
<section class="folio-panel">
<div class="folio-kicker">�� / ��</div>
<div class="folio-price"><span>�� <u>��</u> ��</span><strong>�� 3 000 ₽</strong></div>
<div class="folio-price"><span>�� 0</span><strong>�� 5 000 ₽</strong></div>
<div class="folio-price"><span>�� </span><strong>�� 10 000 ₽</strong></div>
<div class="folio-price"><span>�� -��, ��, ��, ��</span><strong>��</strong></div>
<div class="folio-note">�� . �� .</div>
</section>
<section class="folio-panel">
<div class="folio-kicker">�� / ��</div>
<div class="fg-gallery">
<input class="fg-switch" type="radio" name="fg-examples-01" id="fg-category-1" aria-label="��" checked>
<input class="fg-switch" type="radio" name="fg-examples-01" id="fg-category-2" aria-label="��">
<input class="fg-switch" type="radio" name="fg-examples-01" id="fg-category-3" aria-label="�� ">
<input class="fg-switch" type="radio" name="fg-examples-01" id="fg-category-4" aria-label="��">
<div class="fg-tabs">
<label for="fg-category-1">��</label>
<label for="fg-category-2">��</label>
<label for="fg-category-3">�� </label>
<label for="fg-category-4">��</label>
</div>
<div class="fg-panels">

<div class="fg-panel">
<details class="fg-shot">
<summary aria-label="��: �� 1">

<span class="fg-empty">��<br>�� 1</span>
</summary>
</details>
<details class="fg-shot">
<summary aria-label="��: �� 2">

<span class="fg-empty">��<br>�� 2</span>
</summary>
</details>
<details class="fg-shot">
<summary aria-label="��: �� 3">

<span class="fg-empty">��<br>�� 3</span>
</summary>
</details>
</div>

<div class="fg-panel">
<details class="fg-shot">
<summary aria-label="��: �� 1">

<span class="fg-empty">��<br>�� 1</span>
</summary>
</details>
<details class="fg-shot">
<summary aria-label="��: �� 2">

<span class="fg-empty">��<br>�� 2</span>
</summary>
</details>
<details class="fg-shot">
<summary aria-label="��: �� 3">

<span class="fg-empty">��<br>�� 3</span>
</summary>
</details>
</div>

<div class="fg-panel">
<details class="fg-shot">
<summary aria-label="�� : �� 1">

<span class="fg-empty">�� <br>�� 1</span>
</summary>
</details>
<details class="fg-shot">
<summary aria-label="�� : �� 2">

<span class="fg-empty">�� <br>�� 2</span>
</summary>
</details>
<details class="fg-shot">
<summary aria-label="�� : �� 3">

<span class="fg-empty">�� <br>�� 3</span>
</summary>
</details>
</div>

<div class="fg-panel">
<details class="fg-shot">
<summary aria-label="��: �� 1">

<span class="fg-empty">��<br>�� 1</span>
</summary>
</details>
<details class="fg-shot">
<summary aria-label="��: �� 2">

<span class="fg-empty">��<br>�� 2</span>
</summary>
</details>
<details class="fg-shot">
<summary aria-label="��: �� 3">

<span class="fg-empty">��<br>�� 3</span>
</summary>
</details>
</div>
</div>
</div>
<p class="folio-text">�� , �� ..</p>
<div class="folio-note">�� .</div>
</section>
</div>
</div>
</div>
[/html]

��

mybb@mybb.ru (cashew) — Mon, 05 Oct 2026 21:08:28 +0300

��

mybb@mybb.ru (cashew) — Mon, 05 Oct 2026 21:08:06 +0300

��

film stock

������� ��������� ������� ��������� ������� ��������� ������� ��������

������ ����

�������� ����

��

��

��