Doubao Seed API for Reasoning and Coding

एक पूरा single-file HTML page बनाएं — एक .html document जिसमें सारा CSS और JavaScript inline हो, zero external dependencies हों, कोई CDN links न हों, कोई web fonts न हों, कोई image files या data URIs न हों। हर visual runtime पर Canvas 2D API या inline SVG से procedurally draw होना चाहिए; कहीं भी bitmaps, photographs या emoji नहीं होने चाहिए। Page एक real-time generative canvas है जिसका title कुछ ऐसा हो: "Harvest Field — Aerial Geometry Studio," और पूरा concept एक cultivated farmland का god's-eye, top-down view है जिसे user sliders से shape करता है, जबकि एक single pixelated combine harvester उस पर रेंगता है, raw crop से ordered stripes मिटाता हुआ — chaos से order कटकर निकलने का शांत, संतोषजनक क्षण। Composition और rendering: पूरे viewport को rye-like field plots की regular rectangular grid से भरें, जो flat-vector shapes में subtle isometric / faux-2.5D lift के साथ laid out हों, ताकि हर plot low block जैसा पढ़े, flat rectangle जैसा नहीं। Scene को एक single directional dusk sun से light करें जो एक corner से warm, low-angle पर raking in हो; हर plot और harvester opposite direction में long soft shadow cast करें ताकि field की geometric, blocky solidity मजबूत हो। Palette restrained, tasteful earth-tone family हो: mustard yellow, ochre, olive green, और freshly turned soil के लिए scorched tilled burnt-umber का single accent — कोई neon नहीं, कोई pure primaries नहीं, high-end और muted रखें। Overall style flat vector meets isometric micro-relief हो, precise और architectural। Living behavior: हर plot के भीतर fine drill-seeding rows (thin parallel lines) render करें जिनकी density adjustable हो। एक pixelated combine harvester — कुछ rectangles से draw किया गया छोटा blocky sprite — ONLY moving element हो और वही grid की symmetry तोड़ने वाली एकमात्र चीज हो। यह धीरे-धीरे या तो spiral inward path पर या serpentine boustrophedon (回字 / back-and-forth) route पर plots के across आगे बढ़े। चलते समय यह अपने swath में सीधे खड़ी crop को "erase" करे और पीछे real-time harvest stripes छोड़े — alternating light और dark cut bands, जैसे mown lawn या real combine का header trail — जो reset तक field पर permanently painted रहें। Harvest requestAnimationFrame के जरिए continuous, self-running animation हो; इसे field भरते देखना calm और hypnotic महसूस होना चाहिए। Interactivity — सभी controls sliders हों (साथ में कुछ छोटे toggles/buttons) और clean, minimal side या bottom panel में हों, और हर control page reload के बिना live respond करे: field plots की संख्या के लिए slider (grid resolution, जैसे 3×3 से 12×12 तक), drill-seeding row density के लिए slider, crop hue के लिए slider (standing crop को mustard-ochre-olive range में shift करते हुए), harvest progress या harvester speed के लिए slider, और harvester path को spiral और boustrophedon के बीच switch करने के लिए toggle। एक subtle Reset/Replant button दें जो field regenerate करे और pass restart करे। Plot count या density बदलने पर layout smoothly regenerate होना चाहिए; hue drag करने पर real time में retint होना चाहिए। इसे पूरी तरह responsive बनाएं ताकि window resize पर grid और shadows recompute हों, frame rate smooth रहे, और code clean तथा self-contained हो ताकि file को double-click करके सही से खोला जा सके। यह न game है न dashboard — यह generative art instrument है। Procedural geometry, path animation और parameter linkage को जितना आगे ले जा सकें ले जाएं; isometric shading, long dusk shadows और harvest stripes की crispness ही इस render को अलग दिखानी चाहिए।

एक single self-contained HTML file बनाएं (केवल inline CSS और JavaScript — बिल्कुल कोई external libraries, CDNs, frameworks, fonts या image URLs नहीं) जो एक interactive, physically-plausible mechanical pocket-watch movement teardown bench render करे, पूरी तरह SVG और/या Canvas से draw किया हुआ। Page किसी भी modern browser में double-click करने पर सही से open और run होना चाहिए, और सब कुछ real time में computed और animated होना चाहिए। THE SCENE. Workshop bench पर laid out exploded brass watch movement का top-down view। Living vector art के रूप में mainspring barrel, stacked gear train (barrel wheel → center wheel → third wheel → fourth wheel → escape wheel), आगे-पीछे rock करने वाला pallet fork, spiraling hairspring वाला balance wheel, और subtle chapter ring के ऊपर sweep करती hour/minute/second hands render करें। Real gear teeth draw करें (involute-style flanks, plain circles नहीं), pitch circles पर correct meshing हो, और visible arbors, jewels, bridges तथा screws हों। पूरी assembly movement core के around concentrically composed हो; control panel dark corner में tucked हो। THE MECHANICS (यही असली बात है — इसे सचमुच simulate करें, fake नहीं)। Gear train को real gear ratios से model करें: हर wheel की angular velocity उसके neighbor की velocity times उनके tooth counts के negative ratio के बराबर हो, ताकि meshing wheels proportional speeds पर visibly counter-rotate करें और teeth overlap या slide किए बिना interlock करें। Escapement को सचमुच tick करना चाहिए: escape wheel discrete steps में एक tooth at a time advance करे, oscillating pallet fork द्वारा lock और release हो, और pallet fork fixed beat पर swing करते balance wheel से driven हो। हर release ("tick") escape wheel में crisp step पैदा करे और Web Audio API से audible tick बनाए (synthesized, कोई audio files नहीं)। Seconds hand escapement के beat के साथ advance करे; minute और hour hands gear ratios से derive हों। Animation को requestAnimationFrame और real elapsed time से drive करें ताकि timing accurate रहे। THE INTERACTIONS (सब live respond करने चाहिए)। - Draggable winding crown/knob: mainspring को wind करने के लिए इसे drag करें (mouse या touch) — wind-up gauge fill हो और spring coil visibly tighten हो। Release करने पर stored energy discharge होकर train को power दे; movement तब तक चले जब तक spring unwind न हो जाए, फिर coast करके stop हो जाए। - एक "rate" slider जो beat/running speed scale करे ताकि आप इसे धीरे tick करते या तेज race करते देख सकें। - एक "explode" slider जो stacked components को उनकी axes के along continuously separate करे, fully assembled से fanned-out exploded diagram तक, smooth interpolation के साथ, separated parts के बीच connector guide-lines के साथ, और किसी भी explosion level पर सब कुछ अभी भी correctly rotate करता रहे। - किसी भी component पर hover (या tap) करने पर jeweler's loupe जैसा व्यवहार हो: उस part को highlight करें, बाकी को dim करें, और part के name तथा one-line function description वाला labeled callout float करें। - Buttons: Wind, Release, Reset। THE LOOK. Realistic watchmaking-workshop industrial aesthetic: warm aged brass, distressed steel-grey, deep ink-black background, crisp metallic highlights, finely etched gear teeth और beveled bridges। Upper-left से bench पर raking in करती window light की single shaft simulate करें ताकि parts soft elongated shadows cast करें, और gear faces के घूमने पर specular highlights उनके along travel करें। Depth के लिए gradients, filters और subtle grain use करें। Dark corner में clean, legible HUD-style controls और labels हों। REQUIREMENTS. सब कुछ एक .html file में हो; viewport के अनुसार scale होने वाला responsive layout; smooth 60fps animation; कोई placeholder graphics नहीं — movement procedurally drawn और genuinely mechanically coupled होना चाहिए ताकि capable model ऐसी watch बनाए जो सचमुच wind, mesh और tick करे, जबकि weak one static spinning circles में collapse हो जाए। Gear ratios और escapement logic को name करने वाली brief inline comments जोड़ें।